first tab always stays active

Hi,

that sounds like a JavaScript error (the active class should be removed, when another tab is clicked).

I would really need to see the page online, so I could help you out, because there could be a lot of reasons to this problem. Maybe another plugin is causing this issue (so try to deactivate all other plugins) or maybe the theme is at fault (try switching to the twenty sixteen theme).

Also, are there any JS errors in your browser console?

Let me know if you make any progress or if your site is online, so I can take a look.

Take care!

Hello. Thank you for your prompt answer. Console does not show any js-script errors. Ok, will try to rule out any plugin/theme conflicts to isolate the issue… Br.

Hmm. Just checked the behavior again. I see that jquery does replace the active class only on the li-element but not on the a-element. So I moved the first tab active function in your class-tabs-widget.php from the a- element to li-element.

<li class="nav-item<?php echo empty( $item['active'] ) ? '' : ' active'; ?>">

instead of

<a class="nav-link<?php echo empty( $item['active'] ) ? '' : ' active'; ?>"

it works like a charm now ??

Have fun!

Hi,

hmm, that’s strange… The active class is supposed to be on the a tag and not on the li tag, like the example here: https://v4-alpha.getbootstrap.com/components/navs/#tabs.

But if that solves your issue, than ok ??

Take care!

Had same problem, and mkauf8’s solution worked for me as well. PS: you can find the code on line 58 of class-tabs-widget.php

Hi,

I see what could be the problem… Your theme or another plugin is using the bootstrap framework version 3.x and so the active class is located on the li element. In this plugin, we use the bootstrap version 4 and that’s why it does not work for you out of the box.

I might create a filter in the plugin to use the bootstrap 3 framework instead… Could you please tell me which themes you are using (so I can test this out)?

Take care!

Hi

I’am using ascent theme.
https://www.ads-software.com/themes/ascent/

Br.

Hi,

thanks. I just checked this theme and it indeed uses the bootstrap version 3.x.

As I said, I might create a filter in the plugin (to be using bootstrap v3 instead of v4), but this will not be a priority for me, since I have a few other projects, that take up my free time. I’ve added it to my to-do list, but I can’t make a promise on when this will be available in the plugin.

Have a nice day!

Hi,

I just updated the plugin to version 1.2.1, in which I added a filter, that adds the active class to the li instead of a. In order for this change to take effect, update the plugin and please follow the instructions here: https://www.ads-software.com/plugins/tabs-widget-for-page-builder/faq/.

Quick recap -> Use this filter: add_filter( 'pt-tabs/use_older_bootstrap_layout', '__return_true' );

Take care!