Redesigning the tabs element

Hi,

We are trying to copy the design of the grid on https://www.nerdwallet.com/:

We are however having some problems with the content in the tab. Is it possible to insert buttons etc in them? Or is it possible to set up a global container/element that we can insert?

We are trying to implement it on the site http://invertia.grc-media.com/

Thanks in advance!

Hi Pontus,

Thanks for reaching out.
You can add any elements into the Tabs through the Global Blocks as a shortcode. I would suggest you create a Global Block with the specific elements and use that as a shortcode into the Tab content.
I would suggest you go through the following documentation.


Hope it helps.
Thanks

Thank you! I’m starting to get the hang of it and making progress. Is there any way to reduce the size of the “box” or whatever you want to call it of the tab?

I want to remove a lot of the spacing as it’s very big at the moment.

Thank you!

Hello Pontus,

Please remove the <p> tags and use only <br/> tag. For example:

<span><p><img src="http://invertia.grc-media.com/wp-content/uploads/2022/10/debit-cards-2.png" alt="" width="32" height="32" class="alignnone size-full wp-image-497"></p>
<p><strong>Credit Cards</strong></p></span>

Should be updated into:

<span><img src="http://invertia.grc-media.com/wp-content/uploads/2022/10/debit-cards-2.png" alt="" width="32" height="32" class="alignnone size-full wp-image-497"><br/><strong>Credit Cards</strong></span>

Be advised that custom HTML coding is beyond the scope of our support under our Support Policy. If you are unfamiliar with code and resolving potential conflicts, you may select our One service for further assistance.

Best Regards.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.