Dynamic Tabs Overview

The Dynamic Tabs widget in Elementor allows you to display tabbed content that is dynamically sourced from posts or custom fields such as ACF Repeater or ACF Relationship fields.

General#

• Source: Choose the data source for your tabs:

  • Custom – Manually add tabs items.
  • Posts – Automatically pull content from WordPress posts or custom post type.
  • ACF Repeater – Fetches items from a repeater field created in ACF.
  • ACF Relationship – Displays related posts/items from an ACF relationship field.

• Direction: Sets the tab layout direction: horizontal (tabs side by side) or vertical (stacked tabs).
• Justify: Adjusts the horizontal alignment of tabs (start, center, end, or spaced evenly).
• Align Title: Controls the text alignment inside each tab title (left, center, or right).

Tabs#

Source: Posts or ACF Relationship#

• Title: Choose what post element to display as tab title. You can also provide a custom field.
• Description: Choose what post element to display as tab description. You can also provide a custom field.
• Content Fields: When you select Posts or ACF Relationship as source, you can choose from the given options to display as a list item:

  • Post Title – Displays the post's title.
  • Post Author – Shows the name of the post author.
  • Post Date – Displays the post's published date.
  • Post Excerpt – Shows a trimmed version of the post content.
  • Post Content – Displays the full content of the post.
  • Post Comments Count – Shows how many comments the post has.
  • Post Terms – Displays terms (e.g., categories, tags) related to the post.
  • Post Featured Image – Renders the post's featured image.
  • Post Custom Field – Displays the value of a custom meta field.
  • ACF Field – Pulls in data from an ACF (Advanced Custom Fields) field.
  • Pods Field – Displays data from a Pods framework field.
  • Button – Adds a custom button element (e.g., Read More, View Project).

Source: ACF Repeater#

• ACF Repeater Sub Field - Title: Select which subfield from the chosen ACF Repeater will populate tab title.
• ACF Repeater Sub Field - Description: Select which subfield from the chosen ACF Repeater will populate tab description.
• Content Fields: You can select multiple subfield from the chosen ACF Repeater field for the tab content.

Query#

The advanced query logic in the Dynamic Tabs enables you to filter posts by category, tags, author, or other criteria, providing granular control. You can find more details here.

Layout#

This section is particularly useful for responsive design and SEO/JavaScript compatibility, ensuring your tabs look good across devices and maintain unique identifiers.

• Responsive Support: Determines whether tabs should switch to an accordion layout on smaller devices.

  • None – Keeps the tab layout the same across all devices.
  • For Tablet & Mobile – Converts tabs into an accordion layout on tablets and mobile devices for better readability.
  • For Mobile Only – Converts tabs into an accordion layout only on mobile devices.

• Default Active Tab Index: Sets which tab will be open/active by default when the page loads. Index starts from 1 (e.g., 1 = first tab, 2 = second tab, etc.).
• Custom ID Prefix: Lets you define a unique prefix for tab IDs in the HTML output. Useful to avoid ID conflicts when using multiple Dynamic Tabs widgets on the same page. Example: Prefix mytab will create IDs like mytab-1, mytab-2, etc. Allowed characters: dashes, underscores, letters, and numbers (no spaces).