Global Block Reformatting and Look different in Pro Footer

[rbkerr]

Hello,

I have turned of global containers in the global block rows and don’t everything I can to design a very simple footer to no avail.

I have a global block more-or-less looking how I want but the columns for contact details always squash or reformat when it’s put in the Footer Container.

The first image shows it’s appearance in the global block editor.

The second image shows it when it is placed in the footer.

The formatting looks ok on large screen sizes but pushes the phone number and social icon colours to lower rows on small screens.

I’d like them to stay in the same layout for all screen sizes.

Can you please assist?

I’d also be grateful for suggestions on how to better achieve the layout you see I want if I have poorly implemented Pro’s design editor.

[ruenel]

Hello Robert,

Thank you for the very detailed post information. Please edit your global block and check your column layout in your row settings. Make sure the column layout is the same across all screen sizes. At the moment, you are having this:

Hope this helps.

[rbkerr]

Fantastic, thank you. I overlooked setting the custom column widths for all media / screen sizes. It’d be nice to have an “all” tab on the different screen size layouts so they all changed together.

I’m still having trouble with small / mobile view. The phone number squashes to two rows. I’ve tried hiding the outside two columns on mobile view but the centre column still squashes the phone number. Can you show me what I missed please?

[ruenel]

Hello Robert,

On smaller screens, you should set the column layout to 1 column only.

And for those empty columns, it should be hidden away in smaller screens as well. You can enable the “Hide During Breakpoints” option in the “Customize” tab of the column settings.

For more details about the “Hide During Breakpoints” option, kindly check this out:

• https://theme.co/docs/hide-or-show-content-by-device-size

Best Regards.

[rbkerr]

Thank you that helped.

I also read other forum posts about designing inline icons with text and opted for the “social” element for the phone number and email contact links in the footer.

You can close this ticket thanks.

[marc_a]

Hi Robert,

You’re welcome and it’s our pleasure to help you. If you have any other concerns regarding our theme features, feel free to reach us.

Thank you.