Product pages
Details, delivery and questions as tabs.
Content / widget · Elementor module
Bookmarkable Section Tabs Widget Plugin for Elementor
Turn sections already on the page into accessible tabs, with the open tab kept in the address for bookmarks.
Included in All AccessClassic Elementor widgetFrom $29 USD / year
Complementor / Bookmarkable section tabsProduct preview
Text, style and layout controls inside Elementor
01 / Interactive demonstration
Examples
Each example below is the actual published output of the Bookmarkable section tabs widget.
02 / Inside WordPress
Bookmarkable section tabs controls in Elementor
Content holds the tabs (text and section ID), the name of the tab list, the direction and what the Back button does. The Style tab covers the tabs in their normal, hover and selected states, the lines, padding and spacing.
03 / Website use cases
Where to use bookmarkable section tabs
Tabs hide content behind clicks, and most tab widgets give each tab no address of its own, so nobody can link to the delivery tab or bookmark the questions. Bookmarkable section tabs turns sections you have already built into tabs that follow the WAI-ARIA pattern, keep the open tab in the address, and fall back to plain links without JavaScript.
Help pages
Link straight to the right tab from an email.
Long landing pages
Shorten the page without hiding content from search.
04 / Installation and setup
How to add a bookmarkable section tabs in Elementor
Start with Complementor installed and your license connected. Enable this module in the WordPress library, then configure it in Elementor.
Install Complementor, connect your license and enable Bookmarkable section tabs in the Complementor library.
Add the widget to the page.
Give each section a CSS ID under Advanced > CSS ID.
Place the widget above the sections and add a tab for each.
Style the tabs.
05 / Content and style controls
Customize bookmarkable section tabs in Elementor
Configure the settings available for this module to suit the page you are building.
WAI-ARIA tabs pattern.
Arrow keys, Home and End.
Address for each tab.
Opens from links and bookmarks.
Row or column.
Plain links without JavaScript.
06 / Choose the right approach
Bookmarkable section tabs and Elementor alternatives
Compare the existing Elementor workflow with this Complementor module before choosing your setup.
Elementor Tabs widget
Content lives inside the widget, and tabs have no address of their own.
Separate pages
More clicks and more pages to keep up to date.
07 / Requirements and compatibility
Bookmarkable section tabs compatibility with Elementor
- Requires Elementor.
- Sections on the same page.
- Up to 12 tabs.
Complementor uses classic Elementor APIs. Atomic-native controls are not implemented. Check your theme, cache and integrations on a staging site before release.
08 / Common setup problems
Troubleshoot bookmarkable section tabs
Check these settings if the published page behaves differently from the editor.
Why is a tab missing?
No section on the page has its CSS ID. The editor lists the missing IDs.
Why are all sections visible in the editor?
So you can edit them. Preview the page to try the tabs.
Why does Back leave the page?
Choose “Goes back to the previous tab” under Browser Back button.
Can I link to a tab?
Yes. Use the page address with #section-id.
Bookmarkable section tabs plugin questions
Does it need Elementor Pro?
No. It works with the free version of Elementor.
Can I link to a single tab?
Yes. Each tab’s address is the page address with # and the section’s CSS ID.
What happens without JavaScript?
The tabs are plain links and every section stays visible.
Is it accessible?
Yes. It follows the WAI-ARIA tabs pattern with roles, selected state, arrow keys, Home and End.
Does it change my sections?
No. It shows and hides them in the browser and adds tab roles; your content stays as built.
10 / Annual All Access subscription
Get bookmarkable section tabs with Complementor
This module is included with all 1007 current Complementor solutions. Choose your production website allowance; every plan includes the same modules.
One website
$29USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $29 USD each year.
A few websites
$49USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $49 USD each year.
More websites
$99USD / year
- All 1007 current modules
- Plugin downloads and updates for one year
- New releases during the paid term
- Product support
Renews at $99 USD each year.
Applicable taxes extra. Annual subscriptions renew automatically unless canceled in your customer account. Elementor Pro is required for Exclude current post. Read the terms and 14-day technical-issue refund policy.