I'm trying to do a very simple shortcode tabs with my small developpment knowledge.
I have a problem with my shortcode. When I click on other tabs, the content doesn't change, I don't know why :/
Can you tell me what's wrong ?
The HTML version which works:
<ul class="nav nav-pills">
<li class="active"><a href="#home" data-toggle="pill"><img class="img-nav-pills" src="#" /> Menu 1</a></li>
<li><a href="#menu1" data-toggle="pill"><img class="img-nav-pills" src="#" /> Menu 2</a></li>
<li><a href="#menu2" data-toggle="pill"><img class="img-nav-pills" src="#" /> Menu 3</a></li>
</ul>
<div class="tab-content">
<div id="home" class="tab-pane fade in active">Content 1</div>
<div id="menu1" class="tab-pane fade">Content 2</div>
<div id="menu2" class="tab-pane fade">Content 3</div>
</div>
The code I wrote:
The shortcode code:
[tab_menu_skeleton]
[tab_menu tab_class="active" tab_id="1" tab_img="https://i.imgur.com/2AGKegq.png"]test[/tab_menu]
[tab_menu tab_class="" tab_id="2" tab_img="https://i.imgur.com/2AGKegq.png"]test2[/tab_menu]
[/tab_menu_skeleton][tab_content_skeleton]
[tab_content tab_content_active="in active" tab_content_id="1"]texte 1[/tab_content]
[tab_content tab_content_active="" tab_content_id="2"]texte 2[/tab_content]
[/tab_content_skeleton]
Thank you :)
You have a typo in the first row of your shortcode code:
Instead of this: [tab_menu_skeletone]
Use this: [tab_menu_skeleton]