Menu Close
Elementor unseen posts notification widget icon
2

What's New?

How to Navigate through Elementor Tabs from Different Pages

How to Navigate through Elementor Tabs from Different Pages

You can make your site better for people by using the newest Elementor Tabs widget feature from Premium Addons. This guide will show you how to use any element to create a button link to another page with a certain tab open. This makes it easier for visitors to find their way around.

Requirements:

  • You will need Premium Addons PRO plugin installed and activated on your website.
  • Also, make sure that this widget/addon is enabled so you can find it in the Elementor editor. Check this article to know how to do that.
  • Premium Addons works only with Elementor Page Builder plugin so you will need to have it installed and activated as well.

Putting in Button Widget on Your Page

  • Find the page (like test.com/) where you want to add the button for browsing.
  • You can drag and drop any feature that can be used as a link onto your page in the editor. It could be a button, picture, sign, or something else.
  • Change the text and look of the button to fit your design needs.

How to Set Up the Button for Redirect

Check out the settings for the thing you put in the editor, like the Button Widget. In the “Link” box, type in the URL you want to use and the tab number. To go to the third tab, for instance, type test.com/test-page?tab=3 into the address bar.

Linked URL to specific tabs through Elementor Tabs widget.
Using Button widget to link to another page and navigate through tabs.

Setting Up Tabs Widget on a Certain Page

  • If the page has more than one Tabs Widget, you need to give the tab you want to target its own unique ID.
  • Go to (test.com/test-page) and click on Premium Tabs Widget settings link.
  • You can give the tab you want to link to an ID in the “Custom Navigation Element Selector” field. To show this, use “#2” for the second tab.
  • Now, change the link in the element’s link field to match the custom selection you set. An example of this would be the Button Widget. You could use (test.com/test-page?tab=2) as an example. This makes sure that the menu will go to the right tab.
Custom Navigation Element Selector in Elementor editor.
Custom Navigation Element Selector

Testing How to Use the Buttons

  • Save the changes and look at the site again.
  • Go to (test.com/) and click on the button you added there.
  • Make sure that it goes to the right page (test.com/test-page) and opens the right tab.

Join the Community

You’re most welcome to join our Facebook group and YouTube channel to get updates about new features, improvements, and bug fixes.

Premium Addons for Elementor plugin logo

Stay Updated

Subscribe to our newsletter to receive the latest updates and features.