Notice: Manual CMS Loops are Not Available in the New AI Editor
This guide applies specifically to the legacy drag-and-drop editor. If you are building your website using the new AI editor, manually adding blog blocks, configuring dynamic loops, and dragging elements like post titles, images, or dates is not available or needed. The AI automatically creates, organizes, and styles all blog layouts and dynamic content for you based on your prompts.
Use CMS loops and dynamic text to display blog posts in a repeated layout. This guide explains how to adjust the cards and connect their titles, images, and other fields to your content.
Adding Blog List Block
Click "Elements" from the left side panel and search for "Blog List" in the search bar. Drag and drop the Blog list block into your editor where you want it to display.
Configuring CMS Loop Settings
Once the Blog List block is added, use the Query Configuration settings to control which posts are displayed and how they are ordered.
Limit: Set the maximum number of posts to display.
Offset: Skip a specified number of posts before displaying the results.
Sorting: Choose how posts are ordered and select the sorting direction.
Categories: Display posts from selected categories.
Search Keywords: Filter posts based on specific search terms.
Specific Author: Display posts from a selected author.
Exclude Author: Exclude posts written by a specific author.
Exclude Category: Exclude posts from selected categories.
Exclude Current Post: Prevent the current post from appearing in the results.
Only Include Posts from Current Post's Categories: Display only posts belonging to the same categories as the current post.
Enable Pagination: Add pagination to allow visitors to navigate through multiple sets of posts.
Use the Size & Space settings to configure the column layout, adjust the gap between posts, and control the Blog List width for responsive layouts.
Creating Blog Card
Click "Elements" and search for "Inner Section" to add it to the Blog list. This Inner Section will hold all elements for each individual blog card.
Select the inner Section and go to link settings. Enable dynamic source and select "Current CMS Post" from the dropdown. This allows users to click anywhere on the card to open the associated blog post.
Adding Dynamic Content Elements
Add an image block inside your Inner Section and toggle on "Is Image Dynamic" under Advanced Image options in settings. Select "Post Featured Image" from the dynamic source to display featured images automatically for each blog post.
Add a text block for the title, turn on the toggle next to the text settings, and select Post Title from the Dynamic Content source.
Add another text block for the summary, enable dynamic text, and select "Post Summary". Set word limit to control excerpt length and add suffix for better presentation.
Add post date by searching for "Date" in "Elements" and selecting "Post Date" from available options. Drag and drop the post date element into your container and adjust font size to match your design.
Styling and Customization
Select the Inner Section holding your blog card elements and remove link decoration to eliminate underlines.
Reduce padding for tighter spacing and add borders to create a card-like appearance.
Your CMS loop is now fully customized with dynamic content that automatically updates as you add new blog posts, providing visitors with an organized, professional way to browse and discover your content.