Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

GB 2.0 replacement for generateblocks_background_image_url filter?

  • Hi. I use the following code to enable the use of shortcodes when specifying a background image URL. Works great, except it isn’t getting invoked for a GB 2.0 background:

    add_filter( 'generateblocks_background_image_url', function( $url ) {
        $url = do_shortcode( $url );
    
        return $url;
    } );

    When I use it with new blocks, I see the shortcode is directly output into the inline CSS, like this: background-image: [shortcode-name];. Is there perhaps a differently-named filter to handle the 2.0 version?

  • Hi there,

    The filter is still valid, but there is a known issue with rendering shortcodes in block settings in version 2, which we are aware of and plan to fix soon.

    Alternatively, you can use a custom dynamic tag to replace the shortcode. Let me know if you’d like to go that route.

  • I’d love to take a look at what you’ve got…

  • Or maybe you’ve got a better idea… What I’m trying to do is to take a URL from a postmeta field and dynamically substitute it into a container’s background image. I chose to implement this with a shortcode, which I then enter into the background image’s URL, but maybe you have a better way?

  • Can you provide the full code for the shortcode? I think we may be able to modify it to use dynamic tags instead.

  • Here’s the code for the shortcode. To use it, I simply enter [hero-background-business] into the background’s “background image” field:

    add_shortcode( 'hero-background-business', function( $atts ) {
        $defaultImageUrl = '/wp-content/uploads/2025/06/Contractor-Hero-Background.webp';
    
    	$atts = shortcode_atts( [
            'id'                => false,
    		'default-image-url'	=> '',
        ], $atts );
    
    	$id = absint( $atts[ "id" ] );
    	if ( $id === 0 ) {
    		$id = get_queried_object_id();
    	}
    
    	$bkgImageUrl = sanitize_url( $atts[ "default-image-url" ] );
    	if ( empty( $bkgImageUrl ) ) {
    		error_log( "+++ Missing or empty default image URL, using default URL" );
    		$bkgImageUrl = $defaultImageUrl;
    	}
    
    	$heroBkgId = get_post_meta( $id, 'af_hero_bg', true );
    	if ( empty( $heroBkgId ) ) {
    		error_log( "+++ Missing or empty af_hero_bg postmeta for ID {$id}" );
    		return $defaultImageUrl;
    	}
    
    	$imageAttr = wp_get_attachment_image_src( $heroBkgId , 'full' );
    	if ( empty( $imageAttr ) ) {
    		error_log( "+++ Missing image attributes for attachment ID {$heroBkgId}" );
    		return $defaultImageUrl;
    	}
    
    	$imageUrl  = $imageAttr[0];
    	if ( ! $imageUrl ) {
    		error_log( "+++ Missing or empty image URL for attachment ID {$heroBkgId}" );
    		return $defaultImageUrl;
    	}
    
    	error_log( "+++ Found hero background image: page ID {$id}, image ID {$heroBkgId}, URL {$imageUrl}" );
    	return parse_url( $imageUrl, PHP_URL_PATH );
    } );

    The problem isn’t in the shortcode itself; the problem is that background image URL is never run through the do_shortcode() function to start with.

  • Try applying this snippet:

    add_action( 'init', 'register_hero_background_business_dynamic_tag', 20 );
    function register_hero_background_business_dynamic_tag() {
        if ( class_exists( 'GenerateBlocks_Register_Dynamic_Tag' ) ) {
            new GenerateBlocks_Register_Dynamic_Tag(
                [
                    'title'       => __( 'Hero Background Business', 'generatepress-child' ),
                    'tag'         => 'hero_background_business',
                    'type'        => 'post',
                    'supports'    => [ 'source' ],
                    'description' => __( 'Get the hero background image path for a business page.', 'generatepress-child' ),
                    'options'     => [
                        'default-image-url' => [
                            'type'        => 'text',
                            'label'       => __( 'Default Image URL', 'generatepress-child' ),
                            'help'        => __( 'Default image URL to use if no hero background is found.', 'generatepress-child' ),
                        ],
                    ],
                    'return'      => 'get_hero_background_business_tag',
                ]
            );
        }
    }
    
    function get_hero_background_business_tag( $options, $block, $instance ) {
        $defaultImageUrl = '/wp-content/uploads/2025/06/Contractor-Hero-Background.webp';
    
        $id = isset( $options['id'] ) ? absint( $options['id'] ) : 0;
        if ( $id === 0 ) {
            $id = get_queried_object_id();
        }
    
        $bkgImageUrl = isset( $options['default-image-url'] ) ? sanitize_url( $options['default-image-url'] ) : '';
        if ( empty( $bkgImageUrl ) ) {
            $bkgImageUrl = $defaultImageUrl;
        }
    
        $heroBkgId = get_post_meta( $id, 'af_hero_bg', true );
        if ( empty( $heroBkgId ) ) {
            return $bkgImageUrl;
        }
    
        $imageAttr = wp_get_attachment_image_src( $heroBkgId, 'full' );
        if ( empty( $imageAttr ) ) {
            return $bkgImageUrl;
        }
    
        $imageUrl = $imageAttr[0];
        if ( ! $imageUrl ) {
            return $bkgImageUrl;
        }
    
        return parse_url( $imageUrl, PHP_URL_PATH );
    }

    You can use it similar to a shortcode by entering {{hero_background_business}} in the Image URL field.

    Basic usage (uses current post ID):
    {{hero_background_business}}

    With a specific post ID:
    {{hero_background_business id:123}}

    With a custom fallback image:
    {{hero_background_business default-image-url:/path/to/default.jpg}}

  • This seems to hold a lot of promise. Where can I find out more about writing these dynamic tags?

  • There is no official documentation for that at the moment, but if you take a look at the source code—particularly these files:

    https://github.com/tomusborne/generateblocks/blob/master/includes/dynamic-tags/class-register-dynamic-tag.php
    https://github.com/tomusborne/generateblocks/blob/master/includes/dynamic-tags/class-dynamic-tag-callbacks.php

    you can see various examples of how dynamic tags are registered for all default GenerateBlocks dynamic tags.

  • I put the following code into my customization plugin. It gives me message “+++ Registering Hero Background Business Dynamic Tag”, and nothing else. The code is:

    add_action( 'init', '\AcornFinance\Customizations\register_hero_background_business_dynamic_tag', 20 );
    function register_hero_background_business_dynamic_tag() {
        error_log( "+++ Registering Hero Background Business Dynamic Tag" );
    
        // if ( class_exists( 'GenerateBlocks_Register_Dynamic_Tag' ) ) {
            new \GenerateBlocks_Register_Dynamic_Tag(
                [
                    'title'       => __( 'Hero Background Business', 'generatepress-child' ),
                    'tag'         => 'hero_background_business',
                    'type'        => 'post',
                    'supports'    => [ 'source' ],
                    'description' => __( 'Get the hero background image path for a business page.', 'generatepress-child' ),
                    'options'     => [
                        'default-image-url' => [
                            'type'        => 'text',
                            'label'       => __( 'Default Image URL', 'generatepress-child' ),
                            'help'        => __( 'Default image URL to use if no hero background is found.', 'generatepress-child' ),
                        ],
                    ],
                    'return'      => 'get_hero_background_business_tag',
                ]
            );
        // }
    }
    
    function get_hero_background_business_tag( $options, $block, $instance ) {
        error_log( "+++ get_hero_background_business_tag called with options: " . print_r( $options, true ) );
    
        $defaultImageUrl = '/wp-content/uploads/2025/06/Contractor-Hero-Background.webp';
    
        $id = isset( $options['id'] ) ? absint( $options['id'] ) : 0;
        if ( $id === 0 ) {
            $id = get_queried_object_id();
        }
    
        $bkgImageUrl = isset( $options['default-image-url'] ) ? sanitize_url( $options['default-image-url'] ) : '';
        if ( empty( $bkgImageUrl ) ) {
            error_log( "+++ Missing or empty default image URL, using default URL" );
            $bkgImageUrl = $defaultImageUrl;
        }
    
        $heroBkgId = get_post_meta( $id, 'af_hero_bg', true );
        if ( empty( $heroBkgId ) ) {
            error_log( "+++ Missing or empty af_hero_bg postmeta for ID {$id}" );
            return $bkgImageUrl;
        }
    
        $imageAttr = wp_get_attachment_image_src( $heroBkgId, 'full' );
        if ( empty( $imageAttr ) ) {
            error_log( "+++ Missing image attributes for attachment ID {$heroBkgId}" );
            return $bkgImageUrl;
        }
    
        $imageUrl = $imageAttr[0];
        if ( ! $imageUrl ) {
            error_log( "+++ Missing or empty image URL for attachment ID {$heroBkgId}" );
            return $bkgImageUrl;
        }
    
        return parse_url( $imageUrl, PHP_URL_PATH );
    }

    So it seems like the line of code 'return' => 'get_hero_background_business_tag' isn’t being processed correctly, but I don’t know how to debug that…

  • …more info: I used string {{hero_background_business}} in the background’s “background image” field to trigger things, but I noticed that after saving the page with that value, it gets the outermost braces removed so it becomes {hero_background_business}. Is there some way I’m supposed to escape that string?

  • If you use the tag in the content area using a Text block, does it output the image URL?

  • Sorry for the delay, was out for a few weeks…

    When I use the tag as the content in a GB Text block, I get a fatal error:

    PHP Fatal error: Uncaught Error: Call to undefined function get_hero_background_business_tag() in /www/devph_206/public/wp-content/plugins/generateblocks/includes/dynamic-tags/class-register-dynamic-tag.php:129

    The function does exist, but it is inside the code’s namespace, do I need to use a different syntax in the 'return' => 'get_hero_background_business_tag', expression in the parameter to GenerateBlocks_Register_Dynamic_Tag to make it work?

  • Nevermind the previous comment, I fixed it by simply prefixing the function with the namespace. Now the function gets called, and it outputs the correct value in the text box, but when used in the background’s background image field with value {{hero_background_business}}, I get nothing for the property generated into the CSS. If you look at the URL provided below and inspect gb-element-4d922c3f, you’ll see a teeny bit of CSS for the class, but no background image.

  • …on the plus side, the double braces were no longer stripped as I mentioned on June 19, 2025 at 2:56 am.

  • I cannot view the site without the password/username.

    Did you add the dynamic tag in the styles panel > backgrounds > Backgrounds? Or did you add it to the settings panel > Image field?

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