Footer, Social Icons in Row

[texaskiwi13]

Hi team,

I know this question has been asked, and have tried many solutions in the forum, but still can’t get it to display properly.

I need the title to appear on one line, the line element underneath it and the social icons in a row.

I tried changing the flex box to row (rather than column), setting it to wrap and the title to 100% width, but then the icons didn’t line up left aligned (see screenshot). When I deleted the line element, they lined up correctly, but I need the line element there. Additionally, when I made the screen size for small mobile, you couldn’t even see the instagram logo.

I’m open to whatever solution gets it to display correctly across all devices.

Can you please advise?

Thanks,
Ashley

Can you please advise?

[christopher]

Hi Ashley,

I suggest that you use the column flexbox layout so that the title and social icons will be stacked up. Then please avoid adding the social icons directly to the footer builder. Instead, go to Pro > Global blocks and add a global block.

Use the Row Flexbox layout to add your social media icons to have them in one row instead of being stacked. You can treat a global block like where is nikah a normal content builder. Click here for more information on how to use the global block.

After you finished the work on the global block and save the result, go back to the footer builder and use the Global Block element to add the block below the title.

That way, you will use the column flexbox layout in the footer, but row flexbox layout in the global block which contains the social icons.

So the footer should be something like this:

• 

And the Global Block something like this:

• 

Thank you.

[texaskiwi13]

You’re a genius!! Thank you so much. That worked perfectly and will be so useful for the future! I’ve been using X/Pro so long, I don’t always keep up to date with the new features - that is a goodie!!

[ruenel]

You’re welcome Ashley!
We’re just glad @Christopher were able to help you out.

[wiser308]

This worked perfectly. However, when I check open link another window it does not work. Suggestions?

[ruenel]

Hello @wiser308,

Thanks for updating this thread. We are just confused what has work and what doesn’t. At this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.

Regards.