Looping multiple topics in a single blog content module including the topic name

SOLVE
Regular Contributor

Hi! I need help regarding on how to loop multiple topics in a single blog content module I have this code added on top of my listing page

 

{% set topic_posts = blog_recent_topic_posts(BlogIdNumber, 'whiskey-content', 3) %}

 

Now I also want another topic to be added in the loop , like the "tequila-content" and would also want to add a headline of the Topic Name in the loop for example

<h3> {% topic name here%} </h3> 

The above code should run for both the the if/else statement.

If you want to see my code I also attached it below, hope you could help me.. 

 

{% if topic %}

<div class="blog-section">
    <div class="blog-listing-wrapper cell-wrapper">
        {# simple_list_page indicates the "blog/all" page, which is a list of links to every blog post #}
        <div class="post-listing{% if simple_list_page %}-simple{% endif %}">
            {% if blog_author %}
                <div class="hs-author-profile">
                    <h2 class="hs-author-name">{{ blog_author.display_name }}</h2>
                    {% if blog_author.avatar %} <div class="hs-author-avatar"> <img src="{{ blog_author.avatar }}"> </div> {% endif %}
                    <div class="hs-author-bio">{{ blog_author.bio }}</div>
                    {% if blog_author.has_social_profiles %}
                        <div class="hs-author-social-section">
                            <span class="hs-author-social-label">Find me on:</span>
                            <div class="hs-author-social-links">
                                {% if blog_author.facebook %}
                                    <a href="{{ blog_author.facebook }}" target="_blank" class="hs-author-social-link hs-social-facebook">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.linkedin %}
                                    <a href="{{ blog_author.linkedin }}" target="_blank" class="hs-author-social-link hs-social-linkedin">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.twitter %}
                                    <a href="{{ blog_author.twitter }}" target="_blank" class="hs-author-social-link hs-social-twitter">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.google_plus %}
                                    <a href="{{ blog_author.google_plus }}?rel=author" target="_blank" class="hs-author-social-link hs-social-google-plus">&nbsp;</a>
                                {% endif %}
                            </div>
                        </div>
                    {% endif %}
                </div>
                <h3 class="hs-author-listing-header">Recent Posts</h3>
            {% endif %}
            {% for content in contents %}
                <div class="post-item">
                    {% if not simple_list_page %}
                                                <a href="{{content.absolute_url}}">
                         
                        <div class="post-body clearfix">

                       
                         {% if content.post_list_summary_featured_image %}
                                <div class="hs-featured-image-wrapper">
                                  
                                        <img src="{{ content.post_list_summary_featured_image }}" class="hs-featured-image"  alt="{{ content.name }}">
                                    
                                </div>
                        {% endif %}
                        <div class="custom-date">
                        {{ content.publish_date_local_time.strftime('%d') }}
                        {{ content.publish_date_local_time.strftime('%B') }}
                        </div>
                            
                        <div class="post-header">
                            <h2>{{ content.name }}</h2>
                        </div>
                        
                        
                          <!--post summary-->
                         
                            
                        </div>
                          </a>  
                       
                                            
                            
                       
                    {% else %}
                        <h2 class="post-listing-simple"><a href="{{content.absolute_url}}">{{ content.name }}</a></h2>
                    {% endif %}
                </div>
            {% endfor %}
        </div>

        {% if not simple_list_page %}
 <!-- Numbered Pagination -->
<div class="blog-pagination">
    {% set page_list = [-2, -1, 0, 1, 2] %}
    {% if contents.total_page_count - current_page_num == 1 %}{% set offset = -1 %}
    {% elif contents.total_page_count - current_page_num == 0 %}{% set offset = -2 %}
    {% elif current_page_num == 2 %}{% set offset = 1 %}
    {% elif current_page_num == 1 %}{% set offset = 2 %}
    {% else %}{% set offset = 0 %}{% endif %}

    <div class="blog-pagination-left">
        {% if contents.total_page_count > 5 %}
            {% if current_page_num >= 4 %}
                <a href="{{ blog_page_link(1) }}">1</a>
                <a class="elipses" href="{% if current_page_num <= 5 %}{{ blog_page_link(1) }}{% else %}{{ blog_page_link(current_page_num - 5) }}{% endif %}">...</a>
            {% endif %}
        {% endif %}
    </div>
    <div class="blog-pagination-center">
        {% for page in page_list %}
            {% set this_page = current_page_num + page + offset %}
            {% if this_page > 0 and this_page <= contents.total_page_count %}
                <a {% if this_page == current_page_num %}class="active"{% endif %} href="{{ blog_page_link(this_page) }}">{{ this_page }}</a>
            {% endif %}
        {% endfor %}
    </div>
    <div class="blog-pagination-right">
        {% if contents.total_page_count > 5 %}
            {% if contents.total_page_count - current_page_num > 2 %}
                <a class="elipses" href="{% if contents.total_page_count - current_page_num <= 5 %}{{ contents.total_page_count }}{% else %}{{ blog_page_link(current_page_num + 5) }}{% endif %}">...</a>
                <a href="{{ blog_page_link(contents.total_page_count) }}">{{ contents.total_page_count }}</a>
            {% endif %}
        {% endif %}   
    </div>
    <div class="pager">
         {% if last_page_num %}<a class="prev-link" href="{{ blog_page_link(last_page_num) }}">« Previous</a>{% endif %}
         {% if next_page_num %}<a class="next-link" href="{{ blog_page_link(current_page_num + 1) }}">Next »</a>{% endif %}
        
         
    </div>
</div>
{% endif %}
        
    </div>
</div>



{% endif %}


{% if is_listing_view %}

<div class="blog-section">
    <div class="blog-listing-wrapper cell-wrapper">
        {# simple_list_page indicates the "blog/all" page, which is a list of links to every blog post #}
     
      <div class="post-listing{% if simple_list_page %}-simple{% endif %}">
          
          {% if blog_author %}
                <div class="hs-author-profile">
                    <h2 class="hs-author-name">{{ blog_author.display_name }}</h2>
                    {% if blog_author.avatar %} <div class="hs-author-avatar"> <img src="{{ blog_author.avatar }}"> </div> {% endif %}
                    <div class="hs-author-bio">{{ blog_author.bio }}</div>
                    {% if blog_author.has_social_profiles %}
                        <div class="hs-author-social-section">
                            <span class="hs-author-social-label">Find me on:</span>
                            <div class="hs-author-social-links">
                                {% if blog_author.facebook %}
                                    <a href="{{ blog_author.facebook }}" target="_blank" class="hs-author-social-link hs-social-facebook">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.linkedin %}
                                    <a href="{{ blog_author.linkedin }}" target="_blank" class="hs-author-social-link hs-social-linkedin">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.twitter %}
                                    <a href="{{ blog_author.twitter }}" target="_blank" class="hs-author-social-link hs-social-twitter">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.google_plus %}
                                    <a href="{{ blog_author.google_plus }}?rel=author" target="_blank" class="hs-author-social-link hs-social-google-plus">&nbsp;</a>
                                {% endif %}
                            </div>
                        </div>
                    {% endif %}
                </div>
                <h3 class="hs-author-listing-header">Recent Posts</h3>
            {% endif %}
            {% for content in topic_posts %}
                <div class="post-item">
                    {% if not simple_list_page %}
                                                <a href="{{content.absolute_url}}">
                         
                        <div class="post-body clearfix">

                       
                         {% if content.post_list_summary_featured_image %}
                                <div class="hs-featured-image-wrapper">
                                  
                                        <img src="{{ content.post_list_summary_featured_image }}" class="hs-featured-image"  alt="{{ content.name }}">
                                    
                                </div>
                        {% endif %}
                        <div class="custom-date">
                        {{ content.publish_date_local_time.strftime('%d') }}
                        {{ content.publish_date_local_time.strftime('%B') }}
                        </div>
                            
                        <div class="post-header">
                            <h2>{{ content.name }}</h2>
                        </div>
                        
                        
                          <!--post summary-->
                         
                            
                        </div>
                          </a>  
                       
                                            
                            
                       
                    {% else %}
                        <h2 class="post-listing-simple"><a href="{{content.absolute_url}}">{{ content.name }}</a></h2>
                    {% endif %}
                </div>
            {% endfor %}
        <div class="view-all-articles">
    <p class="cta-blog-design"> <a href="https://news.besocialscene.com/topic/whiskey-content" target="_blank" >View All whiskey Articles</a></p> 
 </div>
        </div>

        {% if not simple_list_page %}
 <!-- Numbered Pagination -->

{% endif %}
        
  </div>
 </div>

{% endif %}

 

 

 

 

 

 

 

 

 

 

 

 

 

Reply
0 Upvotes
2 Accepted solutions

Accepted Solutions
Regular Advisor

You should be able to create two variables then, one that gets three whiskey posts and one that gets three tequila ones: 

 

 

{% set whiskey_content = blog_recent_topic_posts(BlogIdNumber, 'whiskey-content', 3) %}
{% set tequila_content = blog_recent_topic_posts(BlogIdNumber, 'tequila-content', 3) %}

 

 

Then have each section with it's corresponding loop. The buttons below can just lead to the corresponding topic URL using the blog_tag_url function, like this: 

 

 

<h3>Whiskey Content</h3>

{% for post in whiskey_content %}
  // Your code for the post here
{% endfor %}

<a class="topic-button" href="{{ blog_tag_url(BlogIdNumber, 'whiskey-content') }}"">See All</a> <h3>Tequila Content</h3> {% for post in tequila_content %} // Your code for the post here {% endfor %}

<a class="topic-button" href="{{ blog_tag_url(BlogIdNumber, 'tequila-content') }}"">See All</a>

 

 

I hope that helps!

 


Stephanie O'Gay Garcia

HubSpot CMS Design & Development

Website | Contact

 

If this helped, please mark it as the solution to your question, thanks!

Regular Contributor

Hi @Stephanie-OG , thank you for the help, the code that you said have worked in my

{% if is_listing_view %}

{% endif %}

 

I just want to ask how can I be able to use this template for topic, so for example they click on the view article button ,https://news.besocialscene.com/topic/whiskey-content This template below will work. Tried combining them to one module but it always leads to the above mentioned code. 

 

I really appreciate your help

 

{% if topic %}

<div class="blog-section">
    <div class="blog-listing-wrapper cell-wrapper">
        {# simple_list_page indicates the "blog/all" page, which is a list of links to every blog post #}
        <div class="post-listing{% if simple_list_page %}-simple{% endif %}">
            {% if blog_author %}
                <div class="hs-author-profile">
                    <h2 class="hs-author-name">{{ blog_author.display_name }}</h2>
                    {% if blog_author.avatar %} <div class="hs-author-avatar"> <img src="{{ blog_author.avatar }}"> </div> {% endif %}
                    <div class="hs-author-bio">{{ blog_author.bio }}</div>
                    {% if blog_author.has_social_profiles %}
                        <div class="hs-author-social-section">
                            <span class="hs-author-social-label">Find me on:</span>
                            <div class="hs-author-social-links">
                                {% if blog_author.facebook %}
                                    <a href="{{ blog_author.facebook }}" target="_blank" class="hs-author-social-link hs-social-facebook">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.linkedin %}
                                    <a href="{{ blog_author.linkedin }}" target="_blank" class="hs-author-social-link hs-social-linkedin">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.twitter %}
                                    <a href="{{ blog_author.twitter }}" target="_blank" class="hs-author-social-link hs-social-twitter">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.google_plus %}
                                    <a href="{{ blog_author.google_plus }}?rel=author" target="_blank" class="hs-author-social-link hs-social-google-plus">&nbsp;</a>
                                {% endif %}
                            </div>
                        </div>
                    {% endif %}
                </div>
                <h3 class="hs-author-listing-header">Recent Posts</h3>
            {% endif %}
            {% for content in contents %}
                <div class="post-item">
                    {% if not simple_list_page %}
                                                <a href="{{content.absolute_url}}">
                         
                        <div class="post-body clearfix">

                       
                         {% if content.post_list_summary_featured_image %}
                                <div class="hs-featured-image-wrapper">
                                  
                                        <img src="{{ content.post_list_summary_featured_image }}" class="hs-featured-image"  alt="{{ content.name }}">
                                    
                                </div>
                        {% endif %}
                        <div class="custom-date">
                        {{ content.publish_date_local_time.strftime('%d') }}
                        {{ content.publish_date_local_time.strftime('%B') }}
                        </div>
                            
                        <div class="post-header">
                            <h2>{{ content.name }}</h2>
                        </div>
                        
                        
                          <!--post summary-->
                         
                            
                        </div>
                          </a>  
                       
                                            
                            
                       
                    {% else %}
                        <h2 class="post-listing-simple"><a href="{{content.absolute_url}}">{{ content.name }}</a></h2>
                    {% endif %}
                </div>
            {% endfor %}
        </div>

        {% if not simple_list_page %}
 <!-- Numbered Pagination -->
<div class="blog-pagination">
    {% set page_list = [-2, -1, 0, 1, 2] %}
    {% if contents.total_page_count - current_page_num == 1 %}{% set offset = -1 %}
    {% elif contents.total_page_count - current_page_num == 0 %}{% set offset = -2 %}
    {% elif current_page_num == 2 %}{% set offset = 1 %}
    {% elif current_page_num == 1 %}{% set offset = 2 %}
    {% else %}{% set offset = 0 %}{% endif %}

    <div class="blog-pagination-left">
        {% if contents.total_page_count > 5 %}
            {% if current_page_num >= 4 %}
                <a href="{{ blog_page_link(1) }}">1</a>
                <a class="elipses" href="{% if current_page_num <= 5 %}{{ blog_page_link(1) }}{% else %}{{ blog_page_link(current_page_num - 5) }}{% endif %}">...</a>
            {% endif %}
        {% endif %}
    </div>
    <div class="blog-pagination-center">
        {% for page in page_list %}
            {% set this_page = current_page_num + page + offset %}
            {% if this_page > 0 and this_page <= contents.total_page_count %}
                <a {% if this_page == current_page_num %}class="active"{% endif %} href="{{ blog_page_link(this_page) }}">{{ this_page }}</a>
            {% endif %}
        {% endfor %}
    </div>
    <div class="blog-pagination-right">
        {% if contents.total_page_count > 5 %}
            {% if contents.total_page_count - current_page_num > 2 %}
                <a class="elipses" href="{% if contents.total_page_count - current_page_num <= 5 %}{{ contents.total_page_count }}{% else %}{{ blog_page_link(current_page_num + 5) }}{% endif %}">...</a>
                <a href="{{ blog_page_link(contents.total_page_count) }}">{{ contents.total_page_count }}</a>
            {% endif %}
        {% endif %}   
    </div>
    <div class="pager">
         {% if last_page_num %}<a class="prev-link" href="{{ blog_page_link(last_page_num) }}">« Previous</a>{% endif %}
         {% if next_page_num %}<a class="next-link" href="{{ blog_page_link(current_page_num + 1) }}">Next »</a>{% endif %}
        
         
    </div>
</div>
{% endif %}
        
    </div>
</div>


{% endif %}

T

 

Reply
0 Upvotes
6 Replies 6
Regular Advisor

Hello! To clarify:

 

  • are you trying to create two sections on your blog, one for each topic with it's respective header above ("Whiskey Content" and "Tequila Content"), or
  • are you trying to create a single section "Whiskey & Tequila Content" that merges the two topics?

 


Stephanie O'Gay Garcia

HubSpot CMS Design & Development

Website | Contact

 

If this helped, please mark it as the solution to your question, thanks!

Reply
0 Upvotes
Regular Contributor

HI @Stephanie-OG , I am trying to create single section "Whiskey Content"  then loop 3 articles then below it a Tequila Content loop 3 articles.

I want this to happen because the issue that I encountered while adding separate modules for each section  is each time I click on the view all articles for example topic whiskey content. 

 

The Tequila content loop also appears below the pagination. 

Reply
0 Upvotes
Regular Advisor

You should be able to create two variables then, one that gets three whiskey posts and one that gets three tequila ones: 

 

 

{% set whiskey_content = blog_recent_topic_posts(BlogIdNumber, 'whiskey-content', 3) %}
{% set tequila_content = blog_recent_topic_posts(BlogIdNumber, 'tequila-content', 3) %}

 

 

Then have each section with it's corresponding loop. The buttons below can just lead to the corresponding topic URL using the blog_tag_url function, like this: 

 

 

<h3>Whiskey Content</h3>

{% for post in whiskey_content %}
  // Your code for the post here
{% endfor %}

<a class="topic-button" href="{{ blog_tag_url(BlogIdNumber, 'whiskey-content') }}"">See All</a> <h3>Tequila Content</h3> {% for post in tequila_content %} // Your code for the post here {% endfor %}

<a class="topic-button" href="{{ blog_tag_url(BlogIdNumber, 'tequila-content') }}"">See All</a>

 

 

I hope that helps!

 


Stephanie O'Gay Garcia

HubSpot CMS Design & Development

Website | Contact

 

If this helped, please mark it as the solution to your question, thanks!

Regular Contributor

Hi @Stephanie-OG , thank you for the help, the code that you said have worked in my

{% if is_listing_view %}

{% endif %}

 

I just want to ask how can I be able to use this template for topic, so for example they click on the view article button ,https://news.besocialscene.com/topic/whiskey-content This template below will work. Tried combining them to one module but it always leads to the above mentioned code. 

 

I really appreciate your help

 

{% if topic %}

<div class="blog-section">
    <div class="blog-listing-wrapper cell-wrapper">
        {# simple_list_page indicates the "blog/all" page, which is a list of links to every blog post #}
        <div class="post-listing{% if simple_list_page %}-simple{% endif %}">
            {% if blog_author %}
                <div class="hs-author-profile">
                    <h2 class="hs-author-name">{{ blog_author.display_name }}</h2>
                    {% if blog_author.avatar %} <div class="hs-author-avatar"> <img src="{{ blog_author.avatar }}"> </div> {% endif %}
                    <div class="hs-author-bio">{{ blog_author.bio }}</div>
                    {% if blog_author.has_social_profiles %}
                        <div class="hs-author-social-section">
                            <span class="hs-author-social-label">Find me on:</span>
                            <div class="hs-author-social-links">
                                {% if blog_author.facebook %}
                                    <a href="{{ blog_author.facebook }}" target="_blank" class="hs-author-social-link hs-social-facebook">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.linkedin %}
                                    <a href="{{ blog_author.linkedin }}" target="_blank" class="hs-author-social-link hs-social-linkedin">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.twitter %}
                                    <a href="{{ blog_author.twitter }}" target="_blank" class="hs-author-social-link hs-social-twitter">&nbsp;</a>
                                {% endif %}
                                {% if blog_author.google_plus %}
                                    <a href="{{ blog_author.google_plus }}?rel=author" target="_blank" class="hs-author-social-link hs-social-google-plus">&nbsp;</a>
                                {% endif %}
                            </div>
                        </div>
                    {% endif %}
                </div>
                <h3 class="hs-author-listing-header">Recent Posts</h3>
            {% endif %}
            {% for content in contents %}
                <div class="post-item">
                    {% if not simple_list_page %}
                                                <a href="{{content.absolute_url}}">
                         
                        <div class="post-body clearfix">

                       
                         {% if content.post_list_summary_featured_image %}
                                <div class="hs-featured-image-wrapper">
                                  
                                        <img src="{{ content.post_list_summary_featured_image }}" class="hs-featured-image"  alt="{{ content.name }}">
                                    
                                </div>
                        {% endif %}
                        <div class="custom-date">
                        {{ content.publish_date_local_time.strftime('%d') }}
                        {{ content.publish_date_local_time.strftime('%B') }}
                        </div>
                            
                        <div class="post-header">
                            <h2>{{ content.name }}</h2>
                        </div>
                        
                        
                          <!--post summary-->
                         
                            
                        </div>
                          </a>  
                       
                                            
                            
                       
                    {% else %}
                        <h2 class="post-listing-simple"><a href="{{content.absolute_url}}">{{ content.name }}</a></h2>
                    {% endif %}
                </div>
            {% endfor %}
        </div>

        {% if not simple_list_page %}
 <!-- Numbered Pagination -->
<div class="blog-pagination">
    {% set page_list = [-2, -1, 0, 1, 2] %}
    {% if contents.total_page_count - current_page_num == 1 %}{% set offset = -1 %}
    {% elif contents.total_page_count - current_page_num == 0 %}{% set offset = -2 %}
    {% elif current_page_num == 2 %}{% set offset = 1 %}
    {% elif current_page_num == 1 %}{% set offset = 2 %}
    {% else %}{% set offset = 0 %}{% endif %}

    <div class="blog-pagination-left">
        {% if contents.total_page_count > 5 %}
            {% if current_page_num >= 4 %}
                <a href="{{ blog_page_link(1) }}">1</a>
                <a class="elipses" href="{% if current_page_num <= 5 %}{{ blog_page_link(1) }}{% else %}{{ blog_page_link(current_page_num - 5) }}{% endif %}">...</a>
            {% endif %}
        {% endif %}
    </div>
    <div class="blog-pagination-center">
        {% for page in page_list %}
            {% set this_page = current_page_num + page + offset %}
            {% if this_page > 0 and this_page <= contents.total_page_count %}
                <a {% if this_page == current_page_num %}class="active"{% endif %} href="{{ blog_page_link(this_page) }}">{{ this_page }}</a>
            {% endif %}
        {% endfor %}
    </div>
    <div class="blog-pagination-right">
        {% if contents.total_page_count > 5 %}
            {% if contents.total_page_count - current_page_num > 2 %}
                <a class="elipses" href="{% if contents.total_page_count - current_page_num <= 5 %}{{ contents.total_page_count }}{% else %}{{ blog_page_link(current_page_num + 5) }}{% endif %}">...</a>
                <a href="{{ blog_page_link(contents.total_page_count) }}">{{ contents.total_page_count }}</a>
            {% endif %}
        {% endif %}   
    </div>
    <div class="pager">
         {% if last_page_num %}<a class="prev-link" href="{{ blog_page_link(last_page_num) }}">« Previous</a>{% endif %}
         {% if next_page_num %}<a class="next-link" href="{{ blog_page_link(current_page_num + 1) }}">Next »</a>{% endif %}
        
         
    </div>
</div>
{% endif %}
        
    </div>
</div>


{% endif %}

T

 

Reply
0 Upvotes
Regular Advisor

I remember your site, I believe we emailed once Smiley Happy 

 

I'm afraid I don't fully understand your question. Is there something specific that you're trying to display on a topic page that you don't want on the posts, listings or author pages?

 


Stephanie O'Gay Garcia

HubSpot CMS Design & Development

Website | Contact

Reply
0 Upvotes
Highlighted
Regular Contributor

sorry for the confusion. @Stephanie-OG 

this is the code that I want to run if they click on a topic tag url

{% if topic %}
/insert code here
/
{% endif %}


this will view 12 articles from a topic tag  with pagination.  and previous , next buttons.

 

Reply
0 Upvotes