Display Blog Posts by "Most Viewed"

[unicorndev]

Hello there,

I was wondering if anyone can look over my code and let me know where I went wrong. I want to display my blog posts by Most Viewed in order. The first shown(in screenshot below) is correct and is the most viewed. Then the order gets wonky. 5 Factors is the second most viewed and should be the next one. 

I got the code from the Hubl functions doc, but not sure if I am implementing it properly: 

{% call render_animation(module.animation) %}
      <section class="blog-index">
        {# Blog listing #}
         
        {% set pop_posts = blog_popular_posts("default", 4, "popular_all_time") %}
          {% for pop_post in pop_posts %}
        {% for content in contents %} 
        {% if loop.index == '4' %}
        {# On the blog listing page, the first post will be featured above older posts #}

        <article class="blog-index__post-wrapper">
          <div class="blog-index__post">
            
            {% if pop_post.featured_image and group.use_featured_image_in_summary %}
            <a class="blog-index__post-image" 
               style="background-image: url('{{ pop_post.featured_image }}');" 
               href="{{ pop_post.absolute_url }}">
            </a>
            {% endif %}
            <div class="blog-index__post-content">
              <div>
                {% set featured_tag = content.topic_list | first %}
                {% if featured_tag %}
                <span class="blog-index__post-preheader">{{ featured_tag }}</span>
                {% endif %}
                {#<h3><a href="{{ content.absolute_url }}">{{ content.name }}</a></h3>#}
                 <h3><a href="{{ pop_post.absolute_url }}">{{ pop_post.name }}</a></h3>
                {% if content_group.show_summary_in_listing %}
                {#<p>{{ content.meta_description | default(content.post_summary, true) | truncatehtml(150, '...', false) }}</p> #}
                {% endif %}
              </div>
              <div class="blog-index__post-meta">
                <span class="blog-index__post-author">
                  {{ pop_post.blog_post_author }}
                </span>
                <span class="blog-index__post-date">
                  {{ pop_post.publish_date | datetimeformat('%b %e, %Y') }}
                </span>
              </div>
            </div>
          </div>
        </article>
        {% endif %}
          {% endfor %}
        {% endfor %} 
        {# End blog listing #}

      </section>

Any help is greatly appreciated 🙂
 

[felixmacaspac · Accepted solution]

Hey, @unicorndev It becomes broken because you're looping the blog posts/contents redundantly. if you're looping the blog_popular_posts function you don't need to loop thru the contents.

Instead of doing this:

{% set pop_posts = blog_popular_posts("default", 4, "popular_all_time") %}
{% for pop_post in pop_posts %}
    {% for content in contents %}
      <div class="post-title">{{ pop_post.name }}</div>
    {% endfor %}
{% endfor %}

do this:

{% set pop_posts = blog_popular_posts("default", 4, "popular_all_time") %}
{% for pop_post in pop_posts %}
    <div class="post-title">{{ pop_post.name }}</div>
{% endfor %}

Just a hunch - hope it works out. 

[unicorndev]

It worked! Thank you 🙂