Learn how to add CMS loops in sections to dynamically display your content with ease. This guide will walk you through setting up CMS loops so you can showcase blog posts, product listings, or any type of repeatable data on your website — perfect for creating structured, scalable, and dynamic pages.
Adding Blog List Block
Open the Grigora site editor and click on "Elements". Search for "Blog List" and drag and drop it into the editor where you want your dynamic content to appear.
Configuring Blog List Settings
Once the Blog list is added, open its settings to customize how your content displays. Set the number of posts according to your requirement.
You can also adjust offset, order, order by, and apply filters as needed to control which posts appear and in what sequence.
Creating Column Layout
Scroll down and select "Columns" under Size & Space section to create a column layout for your CMS list. This organizes your content in a grid format that's visually appealing and responsive across devices.
Adding and Linking Inner Section
Add an Inner Section by dragging it from "Elements" and placing it inside the Blog list.
Link this container dynamically to the CMS post by going to its settings, opening the link section, and toggling on "Dynamic Source". Then select "Current CMS Post" — this makes your container clickable and linked to CMS posts dynamically.
Designing the Content Layout
Typically inside a CMS loop, you add elements like the post's featured image, title, date, and excerpt:
Add an image block inside the Inner Section. In its settings under Advanced Image Options, toggle on "Is Image Dynamic" and select "Post Featured Image" as the source to display each post's featured image automatically.
Add a Text block for the post title, turn on the Dynamic toggle next to the structure tag selector, and select Post Title as the source.
Add the post date by dragging it from "Elements" to show when each post was published.
For the post excerpt, add another text block. Toggle on Dynamic next to the structure tag selector , select "Post Summary", and limit the number of words as per your requirement. You can also add a suffix like three dots for a clean, professional look.
Styling and Customization
To remove unwanted link decoration, select the Inner Section and in its settings under "Links," enable "Remove Link Decoration".
To differentiate each card, add a border to the Inner Section (for example, one pixel solid black) to create clear visual separation between posts.
Using Pre-Built CMS Sections
Click the Add Section button on the existing section to add a new prebuilt CMS section above or below it, depending on where you want to place the section.
Now, a modal will appear. Select Sections from the top menu, then choose Blogs from the available categories to view the pre-built blog section templates. Choose a template you like and click on it to add it to your editor..
Publishing Your CMS Loop
After configuring all elements, save and publish your website. Your CMS loop is now ready and when a user clicks on any card, it will dynamically open that post, creating a seamless browsing experience for your visitors.