๐ŸŽ‰ Happy 4th of July! Get 15% off GP Premium with the discount code: 4THOFJULY2020

[Resolved] Page Hero custom background image from custom field with fallback

Home Forums Support Page Hero custom background image from custom field with fallback

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1164776
    Martin

    Hi – I found this code here on the forum to generate a fallback for a custom image from a custom field:

    add_filter( 'generate_page_hero_background_image_url', function( $url, $options ) {
        $background_image = get_post_meta( get_the_ID(), 'wpcf-common_featured_media', true );
    
        if ( $background_image ) {
            $url = $background_image;
        } elseif ( has_post_thumbnail() ) {
            $url = $image_url = get_the_post_thumbnail_url( get_the_ID(), 'full' );
        }
    
        if ( ! $url ) {
            $url = get_the_post_thumbnail_url( $options['element_id'], 'full' );
        }
    
        return $url;
    }, 10, 2 );

    That code will:

    1. Use the custom field
    2. If no custom field exists, it will use the featured image of the post
    3. If that doesnโ€™t exist, it will use the image set in the Element.

    What I don’t know:

    a) where to put the add_filter code above? in a hook? wp_head? how to fire it in same places as page hero? – how does the hook fire before the page hero?
    b) I need it to run on posts of type ‘resource’ and type ‘directory’ – do I have to add a line to check for post type or is that covered in the ‘location’ display rules of the hook element
    c) problem is common_featured_media may be either a jpg or a video link
    – clearly if it is a video I need it to go to option 2 – featured image
    – I have a shortcode function [islocal][toolset shortcode for my custom field value][/islocal] to return 1 if is a local url in my domain or 0 if it is not (therefore a video like youtube). Does that go in my hook somehow?

    Sorry I’m confused.

    #1165578
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    a) It should be added using one of these methods: https://docs.generatepress.com/article/adding-php/

    b) You shouldn’t need a check. If you run into issues with it targeting other elements, we can adjust it a bit.

    c) Tricky, maybe try this function:

    add_filter( 'generate_page_hero_background_image_url', function( $url, $options ) {
        $background_image = get_post_meta( get_the_ID(), 'wpcf-common_featured_media', true );
        $isImage = false;
    
        if ( $background_image ) {
            $headers = get_headers( $background_image, 1 );
    
            if ( strpos( $headers['Content-Type'], 'image/' ) !== false) {
                $isImage = true;
            }
        }
    
        if ( $background_image && $isImage ) {
            $url = $background_image;
        } elseif ( has_post_thumbnail() ) {
            $url = $image_url = get_the_post_thumbnail_url( get_the_ID(), 'full' );
        }
    
        if ( ! $url ) {
            $url = get_the_post_thumbnail_url( $options['element_id'], 'full' );
        }
    
        return $url;
    }, 10, 2 );
    #1166584
    Martin

    Thanks Tom good idea except I had a problem with the get_headers throwing an error if there was a background image (which is contained in an embedded custom field if that matters?)

    Anyways I did this and it seems to work great (checking if my urls in the embedded field are local in which case I know it is an image…)

    add_filter( 'generate_page_hero_background_image_url', function( $url, $options ) {
        $background_image = get_post_meta( get_the_ID(), 'wpcf-common_featured_media', true );
        $isImage = false;
    
        if ( $background_image ) { 
            $site_url = get_bloginfo( 'url' );
    
            $isImage = strpos( $background_image, $site_url );
        }
    // Note use of !==.  Simply != would not work as expected
    // because the position of '$site_url' will usually be the 0th (first) character.
        if ( $background_image && $isImage !== false ) {
            $url = $background_image;
        } elseif ( has_post_thumbnail() ) {
            $url = $image_url = get_the_post_thumbnail_url( get_the_ID(), 'full' );
        }
    
        if ( ! $url ) {
            $url = get_the_post_thumbnail_url( $options['element_id'], 'full' );
        }
    // echo $url;
        return $url;
    }, 10, 2 );

    Thanks again for your thoughtful and quick response!

    #1166652
    Tom
    Lead Developer
    Lead Developer

    That looks good – good idea!

    Glad it’s all working now ๐Ÿ™‚

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.