Hello!
We currently have two separate blogs in our Hubspot account. One is listed under news and stories, and the other was just created as “product spotlights.” I want to edit this code so that we have to spotlight our new product spotlight blogs. It is currently only pulling our “news and stories” blog, and I can’t figure out why it can’t pull our “product spotlight” blogs. I tried changing the “default,” but it doesn’t seem to be working.
{% set posts = blog_recent_posts(‘default’, 6) %}
{% set count = 0 %}
{% for post in posts %}
{% if count < 6 %}<!-- stops displaying after 6 posts. Compensates for ‘unless content.absolute_url == post.absolute_url’ removing one. -->
{% unless content.absolute_url == post.absolute_url %}<!-- excludes current post -->
<div class=“post-item blogcard”>
<div class=“hs-featured-image-wrapper”>
<a href=“{{ post.absolute_url }}”><img src=“{{ post.featured_image }}” alt=“{{ post.title }}”></a>
</div>
<div class=“blog-card-inner padding25t” style=“background-color:#fff;min-height: 100px;”>
<h3 class=“gibson”><a href=“{{post.absolute_url}}”>{{ post.name }}</a></h3>
<div id=“hubspot-author_data” class=“hubspot-editable” data-hubspot-form-id=“author_data” data-hubspot-name=“Blog Author”>
<p class=“meta”>{{ post.meta_description|striptags|truncate(100, breakword=False, end=‘…’) }}</p>
<a class=“button” href=“{{ post.absolute_url }}”>Read Now </a>
</div>
</div>
</div>
{% set count = count + 1 %}
{% endunless %}
{% endif %}
{% endfor %}
<div class=“blogList-pagination-wrapper”>
<div class=“blogList-pagination”><a class=“all-posts-link” href=“{{ group.absolute_url }}/all”>All Posts</a></div>
</div>
Hi @NCardarelli,
You can use two separate blog hubL calls and append them into an array. Here is an example:
{% set all_posts = [] %}
{# Get posts from News & Stories blog #}
{% set news_posts = blog_recent_posts('default', 6) %}
{% for post in news_posts %}
{% do all_posts.append(post) %}
{% endfor %}
{# Get posts from Product Spotlights blog #}
{% set product_posts = blog_recent_posts('product-spotlights', 6) %}
{% for post in product_posts %}
{% do all_posts.append(post) %}
{% endfor %}
{% set count = 0 %}
{% for post in all_posts %}
{% if count < 6 %}
{% unless content.absolute_url == post.absolute_url %}
{# Your existing display code here #}
{% set count = count + 1 %}
{% endunless %}
{% endif %}
{% endfor %}
Thank you so much for responding! I appreciate your help!! !
Reguarding the code for this page, I was curious if you knew anything about this. Now currently i’d like them three in a row (vertical for mobile). But for some reason it stacks all vertically. Here is the code:
{% set posts = blog_recent_posts(‘default’, 6) %}
{% set count = 0 %}
{% for post in posts %}
{% if count < 6 %}<!-- stops displaying after 6 posts. Compensates for ‘unless content.absolute_url == post.absolute_url’ removing one. -->
{% unless content.absolute_url == post.absolute_url %}<!-- excludes current post -->
<div class=“post-item blogcard”>
<div class=“hs-featured-image-wrapper”>
<a href=“{{ post.absolute_url }}”><img src=“{{ post.featured_image }}” alt=“{{ post.title }}”></a>
</div>
<div class=“blog-card-inner padding25t” style=“background-color:#fff;min-height: 100px;”>
<h3 class=“gibson”><a href=“{{post.absolute_url}}”>{{ post.name }}</a></h3>
<div id=“hubspot-author_data” class=“hubspot-editable” data-hubspot-form-id=“author_data” data-hubspot-name=“Blog Author”>
<p class=“meta”>{{ post.meta_description|striptags|truncate(100, breakword=False, end=‘…’) }}</p>
<a class=“button” href=“{{ post.absolute_url }}”>Read Now </a>
</div>
</div>
</div>
{% set count = count + 1 %}
{% endunless %}
{% endif %}
{% endfor %}
<div class=“blogList-pagination-wrapper”>
<div class=“blogList-pagination”><a class=“all-posts-link” href=“{{ group.absolute_url }}/all”>All Posts</a></div>
</div>
CSS:
/*see style.css*/
.post-item {
background-color: #fff;
margin-bottom: 2rem;
transition: opacity 250ms ease-out,transform 250ms ease-out,box-shadow 200ms ease;
max-width: 31%;
display: inline-block;
vertical-align: top;
margin: 0 2% 2% 0;
padding: 0px 3px 20px 3px;
box-sizing: border-box;
}
.blogcard h3 a {
color:#000;
}
.blogcard h3 {
margin:0;
font-size: 140%;
letter-spacing: -.5px;
}
.blogList-pagination-wrapper {
text-align: center!important;
font-size: 100%!important;
}
a.all-posts-link {
color: #046faf!important;
}
Thank you again for your help Ernesto!!