Set Featured Blog Posts on the HubSpot Blog Listings Page

13 Aug, 2018

blogMockup

Setting one or more featured posts on your blog listings page allows you to draw your reader's attention to posts that you want to highlight.

On HubSpot, you can achieve this using post topics or tags and HubL. Your blog listings template will include a HubL expression that says "If the blog post has the featured tag, make it a featured post".

You will need to get your hands dirty with some code to do this so, if you're uncertain, check in with your developer or enlist the help of a HubSpot Freelance Developer.

 

Setting a Featured Post on your HubSpot Blog Listings Template

The basic code to separate out featured posts is simple and can be done from the listing template (click on the "Blog Content" module and click into "Edit Listing Template").





The code loops through through the posts twice: 

  • The first loop iterates through all posts ("for content in contents"), loops through every topic in each post ("for topic in content.topic_list") and then uses a conditional to check if that post has a "featured" topic. Any markup you put within that conditional will apply to featured posts.
  • The second loop iterates through all posts ("for content in contents") and any markup within this loop will apply to all posts.

As for your markup, you can find more detailed information on HubSpot's blog content markup here

 

Excluding Featured Posts from the Remaining Posts

If you don't want the featured posts to appear again below, you can add the opposite condition to the second loop, to make sure the posts don't have a "featured" tag:





 

Limiting the Number of Featured Posts

If your design only allows for a certain number of featured posts, you may want to limit how many appear in the "Featured" section. To do so, you can create a function that limits the number.














The first line contains a function that sets "featured_posts" to those from the "default" blog with the "featured" tag and limits it to 1. You can find more details on this here.

Note that I've updated "content in content" to "post in featured_posts" and changed "content" to "post" below as well.

 

Excluding the "Featured" Topic from Your Post

Perhaps you don't want users to see the "Featured" tag on your post. If that's the case, you can exclude a blog topic from a topics list using another conditional and CSS. This will look something like this: 

This code checks that a post has a topic list ("if post.topic_list"), loops through it ("for topic in post.topic_list") and checks to make sure that it's not featured ("if topic.name != 'featured'"). If it's not, it prints out the topic name below linking it to that topic's URL.

 

Putting It All Together

The markup you use will very much depend on what you're trying to achieve so there's really no size fits all. However, you can find HubSpot's basic blog content markup here and combine it with the above.

If you get stuck, feel free to give me a shout. There's also a great community at community.hubspot.com and someone will typically be happy to answer any questions you might have.

 

New call-to-action

 

Topics: tutorial, hubl, blog

Join the Conversation!

Do you have a question, feedback or comments on this post?