Blog Page in 3 columns

Marketing & Content Hub Blog, Website & Page Publishing
1

Hello!
I am trying to get our blog listing page to be displayed into 3 columns accross versus the two that are showing using the standard blog content module.
I have tried creating custom modules and the posts then do not seem to filter in properly or show them all. I am guessing that is because it is not the standard Hubspot code for blogs to dynamically feed in?
I have also tried the 3 column module, but then the blogs are just listed 3 times in the columns.

2

@CFriedman6 You’re absolutely right — HubSpot’s default blog listing module is built to be used with specific internal blog variables (content, contents, blog_author, etc.), and when creating custom modules from scratch, if those variables aren’t referenced correctly or if the loop isn’t used properly, your posts won’t render dynamically.
nstead of creating a new custom module, the cleanest and most scalable way is to edit the existing blog listing template and modify the layout using CSS or grid logic. Here’s how:

  • Go to your blog listing template (Design Tools > Your Blog > Listing Template).
  • Locate the loop where posts are rendered:
    {% for content in contents %}
    <div class=“blog-card”>
    <!-- Blog card HTML: title, image, excerpt, etc. -->
    </div>
    {% endfor %}
  • Wrap the cards in a container like:
    <div class=“blog-grid”>
    {% for content in contents %}
    <div class=“blog-card”>
    <!-- Your content block -->
    </div>
    {% endfor %}
    </div>
  • Add CSS to the template or linked stylesheet:

.blog-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 2rem;
}
.blog-card {
/* optional styles */
}
Hope this helps!