CMS Development

peesen
Contributor

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Hey Hubspot-Community

 

I have created a related posts hubl-template module. The related-posts are working finde but i have one problem. Before i show the related posts i have a title for this section "See related posts". Now this title is showing even when there are no related posts to be displayed. How can i just show this title (h2) when there are related posts to be displayed?

 

Thank you so much for your help and time

 

  {% macro blog_post_formatter(post) %}
    <article class="post">
      {% if post.featured_image %}
      <a class="image-link" href="{{ post.absolute_url }}">
        <img src="{{ post.featured_image }}" alt="{{ post.name }}">  
      </a>
      {% endif %}
      {% if post.tag_list %}
      <div class="tags">
        {% for tag in content.tag_list %}
        <a class="tag-link" href="{{ blog_tag_url(group.id, tag.slug) }}">{{ tag.name }}</a>{% if not loop.last %}{% endif %}
        {% endfor %}
      </div>
      {% endif %}
      <h3 class="post-title"><a href="{{ post.absolute_url }}">{{ post.name }}</a></h3>
      <div class="meta">
        <div class="author">Verfasst von <strong>{{ post.blog_post_author.display_name }}</strong></div>
        <div class="date">{{ post.publish_date_localized }}</div>
      </div>
    </article>
  {% endmacro %}
  
  <h2 class="section-title">See Related Posts</h2>
  <div class="related-posts-carousel posts-wrapper">
    {% related_blog_posts limit=3, post_formatter="blog_post_formatter" no_wrapper=True %}  
  </div>

 

0 Upvotes
1 Accepted solution
John
Solution
Top Contributor | Platinum Partner
Top Contributor | Platinum Partner

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Although the functionality above should exist... one work around I just thought of:

{% macro blog_post_formatter(post, index, count) %}

{% if index == 1 %}
<h2 class="section-title">See Related Posts</h2>
<div class="related-posts-carousel posts-wrapper">
{% endif %}

{# simplified markup for example #} <article class="post"> {{ post.name }} </article>

{% if index == count %}
</div>
{% endif %}
{% endmacro %}
{% related_blog_posts limit=3, post_formatter="blog_post_formatter" no_wrapper=True %}

 



I like kudos almost as much as cake – a close second.

View solution in original post

12 Replies 12
Chris-M
Top Contributor

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Hi @peesen,

 

you need to put an if statement before the h2, if this value exist, show the h2.

I would try it with "related_blog_posts", this might work. If this doesn't work we need to find another value, which indicates that, there are existing blogposts on the page.

 

Lets give it a try with the following code:

  {% macro blog_post_formatter(post) %}
    <article class="post">
      {% if post.featured_image %}
      <a class="image-link" href="{{ post.absolute_url }}">
        <img src="{{ post.featured_image }}" alt="{{ post.name }}">  
      </a>
      {% endif %}
      {% if post.tag_list %}
      <div class="tags">
        {% for tag in content.tag_list %}
        <a class="tag-link" href="{{ blog_tag_url(group.id, tag.slug) }}">{{ tag.name }}</a>{% if not loop.last %}{% endif %}
        {% endfor %}
      </div>
      {% endif %}
      <h3 class="post-title"><a href="{{ post.absolute_url }}">{{ post.name }}</a></h3>
      <div class="meta">
        <div class="author">Verfasst von <strong>{{ post.blog_post_author.display_name }}</strong></div>
        <div class="date">{{ post.publish_date_localized }}</div>
      </div>
    </article>
  {% endmacro %}
  
  {% if related_blog_posts %}
    <h2 class="section-title">See Related Posts</h2>
  {% endif %}
  <div class="related-posts-carousel posts-wrapper">
    {% related_blog_posts limit=3, post_formatter="blog_post_formatter" no_wrapper=True %}  
  </div>

- Chris

 

 

Edit: if this works i would go even further and do it that way

...
{% if related_blog_posts %} <h2 class="section-title">See Related Posts</h2> <div class="related-posts-carousel posts-wrapper"> {% related_blog_posts limit=3, post_formatter="blog_post_formatter" no_wrapper=True %} </div> {% endif %}

With this we're not even displaying the empty div of "related-posts-carousel posts-wrapper" if there are not related_blog_posts

peesen
Contributor

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Thank you, yes i need an if statement but:

  {% if related_blog_posts %}

 Is not working. So bascially my question is how can i make such an if statement.

0 Upvotes
John
Top Contributor | Platinum Partner
Top Contributor | Platinum Partner

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Theoretically you could do

{% if related_blog_posts|length > 0 %}

But I think this functionality is missing. I've tried 5 things with no results.

{% related_blog_posts "related_instance_name" limit=3 %}

{{ related_instance_name|length }}   {# 0 #}
{{ related_instance_name.count }}    {# null #}
{{ related_blog_posts|length }}      {# 0 #}
{{ related_blog_posts.count }}       {# null #}

I even tried setting an empty array and appending to the array from the blog post formatter macro... No luck.

{% set related_counter = [] %}

{% macro blog_post_formatter(blog_post, index, count) %}
  {{ blog_post.name }} – {{ index }} {{ count }}
  {% do related_counter.append( index ) %}
{% endmacro %}

{% related_blog_posts "related_instance_name" post_formatter="blog_post_formatter" %}

{{ related_counter }} {# [] #}

 

I could not find anything helpful in developer info either. Maybe a hubspot dev can chime in on this.



I like kudos almost as much as cake – a close second.

peesen
Contributor

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Thank you so much for your work @John . I really hope Hubspot gets into this @sharonlicari 

0 Upvotes
John
Solution
Top Contributor | Platinum Partner
Top Contributor | Platinum Partner

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Although the functionality above should exist... one work around I just thought of:

{% macro blog_post_formatter(post, index, count) %}

{% if index == 1 %}
<h2 class="section-title">See Related Posts</h2>
<div class="related-posts-carousel posts-wrapper">
{% endif %}

{# simplified markup for example #} <article class="post"> {{ post.name }} </article>

{% if index == count %}
</div>
{% endif %}
{% endmacro %}
{% related_blog_posts limit=3, post_formatter="blog_post_formatter" no_wrapper=True %}

 



I like kudos almost as much as cake – a close second.

peesen
Contributor

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Oh @John  you are a true hero! Are you working for Hubspot?

0 Upvotes
John
Top Contributor | Platinum Partner
Top Contributor | Platinum Partner

Show title (h2-tag) to related posts just when related posts exist

SOLVE

@peesen wrote:

Oh @John  you are a true hero! Are you working for Hubspot?


Smiley LOL ha! Nope... but I will give a shameless plug to my current employer. I'm glad it solved your problem!



I like kudos almost as much as cake – a close second.

0 Upvotes
peesen
Contributor

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Haha yeah sure @John ! I just marked South Georgia on my map. If i will make it one day to this far place on the planet i will step by and bring you some swiss cheese or whatever  😄 Thank you really again. Get a beer its on hubspot 🙂

jonchim
Guide | Diamond Partner
Guide | Diamond Partner

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Hi @peesen 
I think you'll need to write some sort of if logic statement

that looks for any related posts and if there is, display title. 

Maybe something like

{% for content in contents... %}
{% if content.pop_posts... %}
<h2 class="section-title">See Related Posts</h2>
{% endif %}
{% endfor %}

 






Jon Chim
VP of Design & Development
Hypha HubSpot Development


check Did my post help answer your query? Help the Community by marking it as a solution
peesen
Contributor

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Hi @jonchim 

 

Thank you for your help.

 

Can you specify your answer a little bit? Your answer is not working out of the box. Where do i have to customize or which parameter do i have to work on?

0 Upvotes
peesen
Contributor

Show title (h2-tag) to related posts just when related posts exist

SOLVE

@sharonlicariHey Sharon. I still dont have a working solution for this. Can you forward my concern to tech-support? Best regards Pascal

0 Upvotes
sharonlicari
Community Manager
Community Manager

Show title (h2-tag) to related posts just when related posts exist

SOLVE

Hey @peesen  

 

Thank you for the information provided.I'll tag a few experts that can share their experience with you.  

 

Hey @Chris-M @ajchapman20 @JanetArmstrong any thoughts you would like to share with @peesen?  

 

Thanks

Sharon


Did you know that the Community is available in other languages?
Join regional conversations by changing your language settings !




0 Upvotes