Add Bootstrap Tabs to template override

forty

Hi i need to add Tabs (Bootstrap) to template article override.
I tried some code but it is not working!
Check This https://getbootstrap.com/docs/5.2/components/navs-tabs/

saguaros

forty HI

Could you tell me how and where you add the code?

and share the URL + super admin + FTP account so I can take a look.

forty

saguaros I manage to add tabs with JA TABS plugin but i have 1 problem.
One tab has iframe code and height is wrong. I want iframe page full display!
Check link (tab Booking) https://movement-bookings.com/demo/tash-2.html

The code i use in template

{jatabs type="content" position="top" mouseType="click" animType="animMoveHor"} [tab title="Bio"] <div><?php echo $this->item->text; ?></div> [/tab] [tab title="News / Media"] News / Media [/tab] [tab title="Tour Dates"] <?php if($this->item->jcfields[4]->value): ?><?php echo $this->item->jcfields[4]->value; // Tour Dates ?></p><?php endif ;?> [/tab] [tab title="Booking"] <?php if($this->item->jcfields[13]->value): ?> <?php echo $this->item->jcfields[13]->value; // Booking ?></p><?php endif ;?> [/tab] {/jatabs}

saguaros

forty What you mean by 'full display'?

Here is how it looks from my side now:

Could you share screenshot of how you want it should be?

forty

Is is not full height. Check images. A layer "ja-tab-panel-top" has 596px height

saguaros

forty I got your point, let me check if it can be done.

saguaros

The provided admin account doesn't work, could you help to check again?

forty

saguaros Yes sorry now you can login

saguaros

forty JA Tab is pretty old 🙂 the iframe you added has height of 2559, if we set the same height, other tabs will not look nice.

Could you contact the provider of that gigwell booking form if it's possible to enable the scroll for the iframe?

forty

saguaros Do you have any other option to add tabs to article on template overide? If i load this i frame to a custom field height is prfect. I thin JA TABS take height form the 1st tab.
I will try to contact with them.

forty

Hi again i did it with custom.css

.ja-tab-panels-top { overflow: auto !important; }

But what you mean JA TABS are old. Templates don't have TABS Typography.
We don't want to have future problems with tabs which are important for this website.
If JA TABS have future updates it is ok.

saguaros

forty I meant old technology it used - when you set height for the panel, all tabs will inherit the same height and it will not look nice. However, this extension still works well without issue.

Is that ok now with your custom css?

forty

saguaros Yes i think!!!