Vertex Addons Dynamic Archive Posts Documentation
The Dynamic Archive Posts widget allows you to dynamically display a list of posts for the current archive page. This widget is perfect for blog archive or category pages in Elementor Theme Builder - it automatically pulls the relevant posts based on the archive (category, tag, author, date, etc.) being viewed. You can design how these posts are laid out (grid or list, columns, spacing) and style each element (featured image, title, meta, etc.) without writing code.
Key Features
Section titled “Key Features”- Automatic Archive Query: No manual setup needed - the widget automatically shows posts from the current archive (e.g., all posts in the current category or tag).
- Flexible Layouts: Choose a grid layout with multiple columns or a full-width list. Control spacing, number of columns, and item alignment to achieve the desired look.
- Pagination & Load More: Enable traditional page pagination or an AJAX “Load More” button to let visitors fetch additional posts without leaving the page.
- Customizable Post Content: Toggle on/off elements like featured images, post titles, excerpts, and metadata (author, date, comments count) for each post item. Tailor what information is shown in the archive listings.
- Consistent Styling: Style the archive posts list to match your site - adjust typography for titles and excerpts, overlay and hover effects for images, colors for meta text, and more.
Install and Activate the Widget
Section titled “Install and Activate the Widget”Make sure the Dynamic Archive Posts widget is enabled in Vertex Addons. If you haven’t done so, refer to the Widget Activation Guide in the Vertex Addons documentation to activate any new widgets.
How to Configure Dynamic Archive Posts in Elementor
Section titled “How to Configure Dynamic Archive Posts in Elementor”- Add the Widget: In the Elementor editor, drag Dynamic Archive Posts into your Archive template design. The widget will immediately load posts from whatever archive the template is applied to.
- Layout Options (Content Tab): Under the Layout section, choose how your posts are arranged:
- Columns: Set the number of columns (e.g., 1 for list, 2-4 for grid) for different screen sizes.
- Item Spacing: Define the gap between post items.
- Layout Style: Select a basic layout style - for example, a Grid or Masonry layout for an even grid or a staggered grid. (Masonry allows posts to stack without uniform height, giving a Pinterest-style look.)
- Carousel: (Optional) You can toggle to a carousel mode (slider) if desired, though typically for archives a grid is used. In carousel mode, additional settings for navigation arrows, autoplay, and slide scrolling will appear.
- Query & Pagination (Content Tab): The widget defaults to the “Current Archive” query (so it knows to show the relevant posts). Configure pagination if needed:
- Posts Per Page: Set how many posts to show before pagination (or load more) is required.
- Pagination Type: Choose None (to show all posts), Numbers (traditional 1, 2, 3 page links), Prev/Next buttons, or Load More button. You can also enable Infinite Scroll (continuous loading as the user scrolls) if supported.
- If using Load More, you can customize the button text (e.g., “Load More Posts”) and an optional loading spinner icon.
- Post Content Settings (Content Tab): Under Post Content or similar sections, decide which parts of each post to display:
- Featured Image: Show or hide the post’s featured image. You can set the image size (thumbnail, medium, large, full) to optimize performance and appearance.
- Title: Show/hide the post title. If shown, you can choose the HTML tag (H2, H3, etc.) for SEO hierarchy and an optional link. Typically, you’d link the title to the post itself so visitors can click through.
- Excerpt: Show a short excerpt of the post. You can set the Excerpt Length (number of words) to keep it concise, and decide whether to override manual excerpts with this length.
- Meta Data: Choose which meta information to display (author name, publish date, post time, number of comments, etc.). You can also define a separator (e.g., a dot or vertical bar) between meta items.
- Read More Button: Optionally display a “Read More” button/link for each post. You can customize its text (e.g., “Read More” or “View Post”) and icon.
- Style the List (Style Tab): Switch to the Style tab to fine-tune the appearance:
- Layout & Item: Adjust the spacing around the whole post list and each item’s padding or border if needed.
- Image Style: If images are shown, you can set border radius (for rounded corners), an overlay color or icon on hover, and image hover animations (e.g., zoom or fade).
- Title Style: Set typography for titles (font family, size, weight), text color, and spacing (margin under the title).
- Excerpt Style: Style the excerpt text (typography and color) to ensure readability.
- Meta Style: Control the appearance of meta text - e.g., a lighter or italic font for author/date. Adjust the separator style (color and spacing) as well.
- Button Style: If using Read More buttons, customize their typography, background color, hover state, padding, and border radius to match your theme.
- Pagination Style: Style the pagination or Load More button (if enabled). For numbered pagination, you can adjust alignment (center/left/right) and active page styling. For the Load More button, you have similar controls as any button widget (typography, color, hover, etc.).
- Advanced Tab (Advanced Settings): As with all Vertex widgets, the Advanced tab offers controls like margins, padding, motion effects (entrance animations), responsive visibility, and custom CSS if needed. Use these to fine-tune positioning or add custom behaviors.
Conclusion
Section titled “Conclusion”Using the Dynamic Archive Posts widget, you can create archive pages that automatically list relevant posts with the design of your choice. This saves time and ensures consistency - one template serves all categories or tags. Once configured, your category pages (and other archives) will update automatically as you add new posts. Combine this widget with others (like Archive Title or Page Title for the heading) to build a complete archive page layout.