Tab anchors not working
-
Hi,
I’ve set a tab block with 2 tabs, and each of them has set an anchor.
When I click the link of the first anchor it slides properly but when I click on the second tab’s anchor it doesn’t slides, and doesn’t opens the tab.
Do I need to do this in JS / jQuery or it’s part of the tab blocks?
Once I open the second tab both anchor work but they don’t open the “active” tab, it just slides.
Thank you!
-
Hello @allanext ,
Can you please share a screencast with us that shows us the steps to replicate the issue? It will help us to guide you in a better way.
Looking forward to hearing from you.
Regards,
SwetaHello @allanext ,
We haven’t heard back from you in a while, so I’m going to mark this as resolved – if you have any further questions, you can start a new thread.
Thank you!
Sorry for getting back only now.
I’ve just created 3 anchors to each tab, as you can see if you click on the first anchor (by default open) it scrolls down (a bit too much but it can be fixed with css). If you click on the anchors 2 and 3 nothing happens, shouldn’t it scroll to the anchor and open the tab selected ?
This is the code of the page:
<!-- wp:html --> <div class="entry-content"> <a href="/test-anchor-on-tabs#anchor1">Anchor 1</a> <a href="/test-anchor-on-tabs#anchor2">Anchor 2</a> <a href="/test-anchor-on-tabs#anchor3">Anchor 3</a> </div> <!-- /wp:html --> <!-- wp:paragraph --> <p>Let's put a vertical spacer</p> <!-- /wp:paragraph --> <!-- wp:spacer {"height":286} --> <div style="height:286px" aria-hidden="true" class="wp-block-spacer"></div> <!-- /wp:spacer --> <!-- wp:uagb/tabs {"block_id":"f9e6c8ed","tabActive":2} --> <div class="wp-block-uagb-tabs uagb-block-f9e6c8ed uagb-tabs__wrap uagb-tabs__hstyle1-desktop uagb-tabs__vstyle6-tablet uagb-tabs__vstyle6-mobile" data-tab-active="0"><ul class="uagb-tabs__panel uagb-tabs__align-left"><li class="uagb-tab uagb-tabs__active"><a href="#uagb-tabs__tab0" class="uagb-tabs-list uagb-tabs__icon-position-left" data-tab="0"><span>Tab 1</span></a></li><li class="uagb-tab "><a href="#uagb-tabs__tab1" class="uagb-tabs-list uagb-tabs__icon-position-left" data-tab="1"><span>Tab 2</span></a></li><li class="uagb-tab "><a href="#uagb-tabs__tab2" class="uagb-tabs-list uagb-tabs__icon-position-left" data-tab="2"><span>Tab 3</span></a></li></ul><div class="uagb-tabs__body-wrap"><!-- wp:uagb/tabs-child {"block_id":"6b27d634","tabActive":2,"tabHeaders":["Tab 1","Tab 2","Tab 3"]} --> <div class="wp-block-uagb-tabs-child uagb-tabs__body-container uagb-tabs__inner-tab uagb-inner-tab-0" id="anchor1"><div class="uagb-blocks__6b27d634 uagb-tabs__body" aria-labelledby="uagb-tabs__tab0"><!-- wp:paragraph --> <p>Content Tab 1</p> <!-- /wp:paragraph --></div></div> <!-- /wp:uagb/tabs-child --> <!-- wp:uagb/tabs-child {"block_id":"9d8537cc","id":1,"tabActive":2,"tabHeaders":["Tab 1","Tab 2","Tab 3"]} --> <div class="wp-block-uagb-tabs-child uagb-tabs__body-container uagb-tabs__inner-tab uagb-inner-tab-1" id="anchor2"><div class="uagb-blocks__9d8537cc uagb-tabs__body" aria-labelledby="uagb-tabs__tab1"><!-- wp:paragraph --> <p><meta charset="utf-8">Content Tab 2</p> <!-- /wp:paragraph --></div></div> <!-- /wp:uagb/tabs-child --> <!-- wp:uagb/tabs-child {"block_id":"a8895db2","id":2,"tabActive":2,"tabHeaders":["Tab 1","Tab 2","Tab 3"]} --> <div class="wp-block-uagb-tabs-child uagb-tabs__body-container uagb-tabs__inner-tab uagb-inner-tab-2" id="anchor3"><div class="uagb-blocks__a8895db2 uagb-tabs__body" aria-labelledby="uagb-tabs__tab2"><!-- wp:paragraph --> <p><meta charset="utf-8">Content Tab 3</p> <!-- /wp:paragraph --></div></div> <!-- /wp:uagb/tabs-child --></div></div> <!-- /wp:uagb/tabs -->
Thank you
Hello @allanext ,
Could you please confirm if you are using UAG Tabs block? Or you are using custom Tab?
Looking forward to hearing from you.
Regards,
SwetaHi @swetakumari,
Yes, I’m using “The Ultimate Addons for Gutenberg” Tabs, I’ve installed this plugin just for the Tabs!
Thank you!
ok just did.
I think we should keep this open till the issue is resolved.
Thank you
Hello @allanext,
It seems like you have opened a ticket with the same issue and our team has already responded to that ticket.
Could you please check it once?
correct, but the issue hasn’t been resolved yet
Thank you
Hi @allanext,
We have replied to your ticket ID – 126919.
Could you please check it once?
Please check screencast to know how tabs anchor work.
I hope you understand.
-
This reply was modified 3 years, 3 months ago by
Abhijit Nage.
Hello @allanext,
We haven’t heard back from you in a while, so I’m going to mark this as resolved – if you have any further questions, you can start a new thread.
Thank you!
-
This reply was modified 3 years, 3 months ago by
- The topic ‘Tab anchors not working’ is closed to new replies.