[Support request] How to Add dynamic Social icon in the hero section?

[Fernando]

I see. Set up the icon in the Icons section of the Block settings. Then, remove the Content source in the dynamic settings. Example: https://share.getcloudapp.com/v1uE8NOk

[Karan]

Hello Fernando,

The link is not appearing in the hero section. Please check it once again. Earlier it was the text custom field. Not the Link custom field.

I have done it as you said. Still the link is not appearing.

Check screen shot for better understanding.

[Karan]

Hello Fernando, are you there…? Waiting for your response

[David]

Use a GB Button Block.

1. Add the button,
2 Select the Icon,
3 Remove the Text so only the icon is displayed:

https://docs.generateblocks.com/article/buttons-overview/#remove-text

4 Now set the Dynamic Data:
DATA SOURCE: Current Post
CONTENT SOURCE: DO NOT SET – LEAVE AS DEFAULT ( SELECT )
LINK SOURCE: POST META
POST META FIELD: Your custom field name

[Karan]

Hello David, I have done as you have said. But the link is still not working. Please check it.

Check the Screenshot and the URL.

And also i don’t want this social icon in every post as some people don’t have their social media account. How to do that?

[David]

If the button is not showing then it means the Custom Field has nothing inside it.
Make sure you a) have the correct custom field name, and b) on THAT page the custom field has a value inside it.

[Karan]

Hello David, I have all the things You have mentioned as point a). and b).

Please check the screen shot for the same…!

[Fernando]

Can you try recreating the fields? Make sure to set the return value to Link URL before adding values to the Post Meta itself.

[Karan]

Hello Fernando. I have done as you have said. Its still not happening…!

Please help me with it.

[Ying]

Can you set the custom field type to URL, and update the Twitter link in the post editor?

[Karan]

Hello Ying, Thank you for your response.

The link is working with the URL custom Field. But the link is opening in the same tab. I want it to open in new tab.

Please help me with it.

[Ying]

You can add a CSS class eg. new-tab to the button block.
https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/

Then add this PHP snippet:

add_filter( 'render_block', function( $block_content, $block ) {
    if ( ! empty( $block['attrs']['className'] ) && strpos( $block['attrs']['className'], 'new-tab' ) !== false  ) {		
        $block_content = str_replace( '<a ', '<a target="_blank" ', $block_content );
    }

    return $block_content;
}, 10, 2 ); 

Adding PHP: https://docs.generatepress.com/article/adding-php/

If there’re any other headline/button blocks containing dynamic links and you want them to open in new tabs, just simply add the new-tab class to them.

[Karan]

Hello Ying, Thanks for your response.

My Next question is. When i use the button block in the Hero GB element. The social icon is appearing in all the posts. For. ex. If the person doesn’t have any social account. in that case also the button will appear. I don’t want the button to appear on that case.

Please help me with this.

[Fernando]

Hi Karan,

You can enable the “Remove Block if link is empty” option. Example: https://share.getcloudapp.com/4gu4qBbx

Let us know how it goes.

[Karan]

Thank You Fernando…!

[Author]

Posts