Related blog posts HubL tag

[Anonymous]

When using the related blog posts HubL tag in the blog post template, is it possible to use the 'tags' parameter to display a selection of blog posts that share one or all of the same values as those used by a given blog post the user is viewing? And, can they be displayed in order of most views? What would that look like?

Any insights would be greatly appreciated.

[SSN]

Here is latest code for related post, It will not appear current post in current post, I have checked other comment they are using old code.

{% if content.topic_list %}
{% set max_posts = 3 %}<!-- Set the max number of related posts to be output to the page here -->
{% set post_list = [] %}
{% for topic in content.topic_list %}
{% set post_list = post_list + blog_recent_topic_posts(group.id, topic.slug, max_posts + 1 ) %}
{% if loop.last %}
{% set post_list = post_list|sort(true, false, 'publish_date')|unique('name') %}
{% set i = 0 %}

<h2>{{ topic|replace('-',' ') }}</h2> <!-- It will Show the Topic Name-->
{% for post in post_list %}
{% if content.absolute_url != post.absolute_url and i < max_posts %}
<li>
<a href="{{post.absolute_url}}">
<span class="crp_title">{{ post.name}}/span>
</a>
</li>
{% set i = i + 1 %}
{% endif %}
{% endfor %}
{% endif %}
{% endfor %}
</ul>
{% endif %}

[alyssamwilie]

Hey @Anonymous ,

The tags filter in related_blog_posts gives posts with the listed tags more relevancy. So posts with each of the tags would definitely have a higher chance of being listed, but there's no certainty that only posts with ALL the listed tags will be the ones shown.

If you want to grab the tags from the current post to add to your related_blog_posts function it would looks something like this :

{% set post_tags = content.tagList|join(", ") %}
{% related_blog_posts limit=3, tags="{{ post_tags }}" post_formatter="blog_post_formatter" %}

For your question of sorting them by most views--there is no option in the related_blog_posts function to do so (it would certainly be a great addition though and I suggest submitting an idea to the Ideas Forum for it). I believe only blog_popular_posts has that functionality and it can only be filtered down to a singular tag slug, not multiple.

{% set post_tag = [] %}
{% for topic in content.topic_list|first %}
  {% set post_tags = post_tag.append(topic.slug) %}
{% endfor %}

{% set pop_posts = blog_popular_posts('default', 3,  post_tag[0]) %}
{% for pop_post in pop_posts %}
    <h2>{{ post_post.name }}</h2>
{% endfor %}

[Anonymous]

Thank you so much for the reply, @alyssamwilie!

I've tried adding your code to the blog post template code but it won't let me publish it. I'm getting an error. Any ideas as to what the reason could be? Here is a copy of the code and I've marked the related blog posts part in red comments.

<div class="blog-section">
<div class="blog-post-wrapper cell-wrapper">
<div class="blog-section">
<div class="blog-post-wrapper cell-wrapper">
<!-- <img src="{{ content.featured_image }}" class="featured-image" /> -->

<div class="share-post">
<h3 class="share text-center">Share:</h3>
{% widget_block social_sharing "social_sharing" label='Social Sharing', use_page_url=True, overrideable=False %}
{% widget_attribute "twitter" is_json=True %}{"link_format": "https://twitter.com/intent/tweet?original_referer={{ social_link_url }}&url={{ social_link_url }}&source=tweetbutton&text={{ social_page_title }}", "network": "Twitter", "default": true, "enabled": true, "custom_link_format": "", "img_src": "https://static.hubspot.com/final/img/common/icons/social/twitter-24x24.png", "custom_link": ""}{% end_widget_attribute %}
{% widget_attribute "linkedin" is_json=True %}{"link_format": "http://www.linkedin.com/shareArticle?mini=true&url={{ social_link_url }}", "network": "LinkedIn", "default": true, "enabled": true, "custom_link_format": "", "img_src": "https://static.hubspot.com/final/img/common/icons/social/linkedin-24x24.png", "custom_link": ""}{% end_widget_attribute %}
{% widget_attribute "google_plus" is_json=True %}{"link_format": "https://plus.google.com/share?url={{ social_link_url }}", "network": "Google+", "default": true, "enabled": true, "custom_link_format": "", "img_src": "https://static.hubspot.com/final/img/common/icons/social/googleplus-24x24.png", "custom_link": ""}{% end_widget_attribute %}
{% widget_attribute "facebook" is_json=True %}{"link_format": "http://www.facebook.com/share.php?u={{ social_link_url }}", "network": "Facebook", "default": true, "enabled": true, "custom_link_format": "", "img_src": "https://static.hubspot.com/final/img/common/icons/social/facebook-24x24.png", "custom_link": ""}{% end_widget_attribute %}
{% widget_attribute "email" is_json=True %}{"link_format": "mailto:?subject=Check out {{ social_link_url }} &body=Check out {{ social_link_url }}", "network": "Email", "default": true, "enabled": true, "custom_link_format": "", "img_src": "https://static.hubspot.com/final/img/common/icons/social/email-24x24.png", "custom_link": ""}{% end_widget_attribute %}
{% end_widget_block %}
</div>

<article class="post-body">
{{ content.post_body }}
</article>

{% choice "optional_CTA" label="<span style=color:#e8771b;>Do you want to show the optional call-to-action?</span><br><span>Hit Save to refresh the preview.</span>", choices="No,Yes", export_to_template_context=True %}
{% text "call_to_action" label="Call to action", export_to_template_context=True %}
{% cta "cta" label="CTA button", export_to_template_context=True %}

{% if widget_data.optional_CTA.value == "Yes" %}
<hr>
<h3 style="text-align: center; font-size: 1.6em; line-height: 1.4em; margin-top: 20px; margin-bottom: 45px;">{% text "call_to_action" label="Call to action", no_wrapper=True %}</h3>
<div style="text-align:center;margin-bottom:1em">{% cta "cta" label="CTA button", no_wrapper=True %}</div>
{% endif %}

<div class="section section-narrow post-pagination no-padding-bottom">
{% if content.next_post_slug %}<a href="/{{ content.next_post_slug }}" class="prev-post-link">Previous Post</a>{% endif %}
{% if content.previous_post_slug %}<a href="/{{ content.previous_post_slug }}" class="next-post-link">Next Post</a>{% endif %}
</div>
</div>
</div>
</div>

<!-- related blog posts section starts here -->
<div class="row-fluid ">
<div class="span12 widget-span widget-type-raw_jinja " style="" data-widget-type="raw_jinja" data-x="0" data-w="12">
{% set post_tags = content.tagList|join(", ") %}
{% related_blog_posts limit=3, tags="{{ post_tags }}" post_formatter="blog_post_formatter" %}

{% for post in posts %}
<div class="span4">
<div class="post-card {% for topic in post.topic_list %}{{ topic.slug }}{% if not loop.last %} {% endif %} {% endfor %} bh-ver">
<div class="bh-hor">
<a href="{{ post.absolute_url }}">
<div class="ft-image" style="background: url('{{ post.featured_image }}') center no-repeat;">
</div>
<div class="content">
<h5>{{ post.name }}</h5>
<p>{{ post.publish_date|datetimeformat('%B %e, %Y') }}</p>
</div>
</a>
</div>
</div>
</div>
{% endfor %}

</div>
<!-- end of blog related section -->

</div>

[alyssamwilie · Accepted solution]

The related_blog_posts function works a little differently from other blog post listing functions in that it uses a macro to format the posts instead of a for loop.

<!-- related blog posts section starts here -->
<div class="row-fluid ">
    <div class="span12 widget-span widget-type-raw_jinja " style="" data-widget-type="raw_jinja" data-x="0" data-w="12">
    
     {% macro blog_post_formatter(post) %}
       <div class="span4">
         <div class="post-card {% for topic in post.topic_list %}{{ topic.slug }}{% if not loop.last %} {% endif %} {% endfor %} bh-ver">
           <div class="bh-hor">
             <a href="{{ post.absolute_url }}">
               <div class="ft-image" style="background: url('{{ post.featured_image }}') center no-repeat;">
               </div>
               <div class="content">
                 <h5>{{ post.name }}</h5>
                 <p>
                   {{ post.publish_date|datetimeformat('%B %e, %Y') }}
                 </p>
               </div>
             </a>
            </div>
           </div>
         </div>
       {% endmacro %}

       {% set post_tags = content.tagList|join(", ") %}
       {% related_blog_posts limit=3, tags="{{ post_tags }}" post_formatter="blog_post_formatter" %}

</div>
<!-- end of blog related section -->

You can read more about this function in one of my blog posts -

https://www.alyssawilie.com/blog/hubl-related-blog-posts

[Anonymous]

I tried out the macro code that @alyssamwilie provided and it worked. Thanks a lot! Three related blog posts are displaying at the end of each blog post and they're being matched to the current blog's tags.

Thank you all for your contributions.