Categories

System Admin
DXM
Documents
Data

Links

Roll Down Tabs

The Roll Down Tabs widget enables you to see a post list that uses some elements of the post (image, link, headline) as a link and a read more button to view more on that post. The read more action allows the viewing of the actual post / content / information on the same page. See it in action on the Example area to understand more.

Table of Contents

This widget needs to be activated in the Network Admin area. 

How to add the Roll Down Tabs Widget

  1. Create / Edit a Page in Elementor

  2. Go to the list of widgets and search for “Roll Down Tabs”

  3. Drag and drop the widget onto the screen area on the right.

How to configure the Roll Down Tabs Widget using Dynamic Content

General Settings For Dynamic Content Source
  1. In the Content Source select area, you can select if you want to display dynamic or manual content. If you select Dynamic you will be able to call on posts within a post type.
  2. The Layout select area controls how the additional content (meta field content) is shown. If you select Roll Down the content will display below the relevant section.

    If you select Open Popup it will display the content in a popup.
  3. The Trigger Roll Down Tabs select area enables you to select what triggers the popup or roll-down effect. You can select one of 4 options
    1. Box (meaning the full post card area of the relevant post)
    2. Image (only the image is clickable)
    3. Title (only the title is clickable)
    4. Button (only the button is clickable)
  4. The column select area controls the column layout of the list that will be shown.
  5. The Featured Image toggle control if the posts featured image is displayed on each card.
    1. If you toggled the Feature image toggle on you will see the Image Size select area. This is where you set the size of your image
  6. Toggling the post title on shows the title, toggling it off hides it.
  7. Toggling the Content on shows the content of the post as an excerpt, toggling it off hides it.
  8. The Field Meta Key under the Content Toggle allows you to fill in a custom Meta Field Key for the content area instead of the default content.
  9. If you would like a button to be displayed in the listing you can toggle it on with the Button toggle.
    1. If you toggled the Button on you will see a button title area where you can fill in your own custom button text.
    2. If you have certain posts that do not have a Roll down or Popup attached to them then you can toggle the button off for those items. To make this work you need to set the Trigger Roll Down Tabs to Button
  10. The Description toggle below the button title should be on, this will show the field meta key area where you can place the meta field you would like to display in either the roll down area or the popup area.
    1. As mentioned above, the Field Meta Key area below the description toggle should contain the meta key that you would like to display in the roll-down area or popup.
Query Settings
  1. In the query area, you can select what you want to query with your Roll down tabs listing grid. This can be anything from posts to pages to custom post types.
  2. The Query posts by area allows you to select one of the following query types: latest posts, from a category, by specific IDs or related to the current. Which will allow you to have articles shown that are related to a specific Taxonomy or Keyword.
  3. In the Post number area, you can set how many posts you would like to display.
  4. The post offset area controls the space between the posts.
  5. With the Order select area, you can select if you want your posts to show in an ascending or descending order.
  6. The last item control what you want to order by, you can choose by date or title.
General settings For Manual Content Source
  1. If you select manual you will be able to manually add in the content. This will allow you to use the repeater area to add your content.
  2. The Layout select area controls how the additional content (meta field content) is shown. If you select Roll Down the content will display below the relevant section.

    If you select Open Popup it will display the content in a popup.
  3. The Trigger Roll Down Tabs select area enables you to select what triggers the popup or roll-down effect. You can select one of 4 options. Box (meaning the full post card area of the relevant post), Image, Title or Button.
  4. The column select area controls the column layout of the list that will be shown.
  5. The Featured Image toggle control if the posts featured image is displayed on each card.
    1. If you toggled the Feature image toggle on you will see the Image Size select area. This is where you set the size of your image
Repeater settings For Manual Content Source

To add a Manual Content area for the roll-down tabs you need to press the + Add item button. This will add an item to the Repeater list.

  1. Once you have added a repeater item you will see two items at the top of the area. The first is where you add in your content. The next is where you can add in your image.
  2. The next area is called Title. This is where you add in the title of your Item.
  3. In the main content area, you can place any type of content. But keep in mind that this is the excerpt type area for your roll-down tabs item.
  4. The next area will allow you to toggle the button on or off.
    1. If you toggled the Button on you will see a button title area where you can fill in your own custom button text.
    2. If you have certain posts that do not have a Roll down or Popup attached to them then you can toggle the button off for those items. To make this work you need to set the Trigger Roll Down Tabs to Button
  5. In the content type area, you can select if you want to add via the editor or a template for the popup/roll-down area.
    1. In this area, you can add in the content for your roll-down or popup depending on what you selected in the general area.
  6. If you selected Template for your content type the text area will be removed allowing you to select a template to show in your roll-down/popup area.
    1. You can select your template in the template area. Just start typing the name of the template and the search will find it for you.
    2. You can select any template in your template library.
  7. If you reverted from a template to content then you will still be able to see your template in the template area above the text box.

Example of the widget

Play Video

How to activate Kurtosys Widgets

Some widgets within DXM are turned off by default and you will have to go into the site’s Network area to activate them. In this short tutorial, we will show you how to do that. 

  1. Open your instance
  2. Go to the network area
  3. Once the network site is loaded. You will see the Kurtosys Extensions side menu item. Click on it.
  4. This will take you to the Kurtosys Extensions. This area contains all of the Kurtosys widgets as well as some other extensions of DXM.
  5. Below each extension card, there is a toggle. With this toggle, you can switch a widget/extension on or off.