Video Posts Tab

Before setting up the Video Posts Tab Widget, ensure that the Animation Addons for Elementor plugin is installed and activated on your site. Once activated, you’ll have access to all Elementor widgets, including the Video Posts Tab Widget—completely free! You can also explore both free and pro widgets by filtering the selection options.

Introduction

The Video Posts Tab Widget displays videos in tabs, allowing easy navigation and customization for better user engagement.

Key Use Cases for the Video Posts Tab Widget:

• Display videos in an organized tabbed format for easy navigation.
• Customize design and transitions to match your site’s style.

Prerequisite

• Elementor
• Animation Addons for Elementor

How to Activate the Video Posts Tab Widget:

• Go to Animation Addons → Elements in your WordPress dashboard.
• Find the Video Posts Tab widget in the list.
• Toggle it on to enable the widget.
• Now, the Video Posts Tab widget is ready to use!

How to Add the Video Posts Tab Widget in Elementor:

• Open the page where you want to add the Video Posts Tab Widget.
• Launch the Elementor editor.
• In the Elementor panel, search for “Video Posts Tab Widget.”
• Drag the widget to your desired section.
• The Video Posts Tab widget is now ready for customization.

How to Configure Video Posts Tab Widget

Enable it, create a new page, set a title, choose the Elementor Full Width template, and publish. Adjust options as needed.

• Navigate to Animation Addons → Elements in your WordPress dashboard and ensure the Video Story Widget is enabled.
• Go to Pages → Add New and create a new page where you want to showcase the video stories.
• Enter a relevant title for your page to define its purpose.
• From the page attributes section, select the Elementor Full Width template to utilize a clean, full-width layout.
• Click the Publish button to make the page live.
• Launch the Elementor editor for the newly created page.
• In the Elementor panel, use the search bar to find “Video Story Widget.”
• Drag the Video Story Widget into your desired section of the page.

Configure widget options such as video sources, layout, playback settings, title, excerpt, taxonomy, and meta display to suit your content and design preferences.

Configuring Video Posts Tab Widget : A Step-by-Step Guide

Once the Video Posts Tab Widget is added to your page, you can configure its settings under different tabs: Content,Style and Advanced.

Content Settings

You’ll find three customization options in the content section: Query, Settings, and Button. I only adjusted the Query section—that’s it.

Query – Video Story Widget: Define which content to display in the video stories 

• Order By: Determines the criteria used to sort the displayed posts (e.g., by date, title, menu order, or custom fields).
  
• Order: Sets the sorting direction—Ascending (ASC) or Descending (DESC)—based on the selected “Order By” option.
  
• Ignore Sticky Posts: Enable this option to exclude sticky posts from the query results, ensuring only regular posts appear in the video story layout.

Settings – Video Story Widget : Customize the core behavior of your video stories. 

• Posts Per Page:
  Set the number of video story posts to display per page.
• Image Resolution:
  Choose the image size (e.g., Medium – 300×300) for thumbnails or cover visuals.
• Show Thumb:
  Toggle to display or hide the thumbnail image for each story.
• Show Title:
  Enable to display the story title.
• Title Length:
  Limit the number 
• Show Author:
  Display the author name for each story.
• Show Taxonomy:
  Show categories or tags associated with each post.
• Read More:
  Enable a “Read More” button to link to the full post.

Additional Read More Settings:

• Read More Text: Customize the text displayed on the button (“Read More”, “Watch Full Story”).
• Read More Icon: Add an icon to visually enhance the button.
• Icon Position: Choose whether the icon appears before or after the button text.
• Icon Spacing: Adjust the spacing between the icon and the text for better visual balance.

Button
Configure the call-to-action button shown with each story. You can set the button text, link destination, and adjust alignment or visibility to drive user interaction.

View All Button

Enable or disable a “View All” button that directs users to a full listing or archive page of all video stories.

View Text

Customize the text label displayed on the View All button.
Example:

• “View All”
• “See More Stories”
• “Explore Videos”

Link

Define the URL or permalink where the View All button redirects users. This should typically point to a dedicated video story archive or a custom landing page.

Icon

Add a visual icon alongside the View Text to enhance clarity and aesthetics. This icon can be placed before or after the text.

Additional Icon Options:

• Icon Library  : The Icon Library provides a wide range of commonly used icons (arrows, play buttons, magnifiers) that can be easily selected and applied without uploading external files.
• Icon SVG : Upload or paste a custom SVG (Scalable Vector Graphics) icon to use within the widget. This option is ideal when you need a unique or brand-specific icon not available in the default library.

Style Settings

You’ll also find plenty of customization options in the Style section.

• Layout – Adjust the overall structure and arrangement of the video posts.
• Banner – Add and customize a banner for the video section.
• Play Icon – Modify the play button style, size, and color.
• Thumbnail – Customize the preview image for each video post.
• Title – Control the font, size, and color of the video titles.
• Excerpt – Adjust the visual presentation of the story excerpts to align with your site’s branding.
• Meta – Style the meta information to be clean and informative without overwhelming the design.
• Date – Present the date clearly and consistently with your overall typography scheme.
• View All Button – Make the “View All” button visually prominent and aligned with your site design.
• Read More Button – Refine the style of the “Read More” button for a polished and interactive user experience.

I made slight changes to fit my needs, but you can fully customize everything to match your design.

Advanced Settings

In the advanced settings, you’ll find a variety of advanced features designed to enhance your designs. Experiment with these options and experience the difference they make.

Final Outcome

That’s it! You’ve successfully learned how to configure the Archive Title widget in Elementor to display dynamic and customized titles for your archive pages.

For any further assistance or inquiries, feel free to contact our support team!

• Excerpt – Adjust the short description displayed with each video.
• Meta – Manage additional details like author name or category.
• Date – Show or hide the video post’s publication date.
• View All – Customize the “View All” button for accessing more videos.
• Read More – Adjust the styling and text for the “Read More” button.