Issue with Tag diplaying on the blog

[GregDirick]

Hi there, 

I do have a question concerning blogpost Tag

We have for one of our client a blog where the Tag are mentionned (priority given to the number of post in the tag) therefore there are set in descending order. 

We would like to display them in an another order.  I've tried several things, but I'am not able to proceed the way I want (I'm not a dev)

For your Information, we have 7 tags.

Any Idea?  Here is the code :

{% if is_listing_view %}
<div class="hs-banner-area">
    <div class="hs-banner-bg">
      <div class="hs-banner-inner">
        <div class="breadcrumb"><a href="{{group.absolute_url}}/sample-blog">Accueil</a></div>
        <h1>{{ group.public_title }}</h1>
        
      </div>
    </div>
  <div class="view-filters">
          {% set my_topics = blog_topics('default', 7) %}
          <ul>
            {% for item in my_topics %}
            <li><a href="{{ blog_tag_url(group.id, item.slug) }}">{{ item }}</a></li>
            {% endfor %}
          </ul>
        </div>
</div>
{% else %}

<div class="hs-banner-area">
    <div class="hs-banner-bg">
      <div class="hs-banner-inner">
        <div class="breadcrumb"><a href="{{group.absolute_url}}/sample-blog">Accueil</a></div>
        <h1>{{ content.name }}</h1>
      </div>
    </div>
</div>

{% endif %}

Thx a lot.

Greg

[Tirabuchi]

Hello Greg,
I could help you further if you tell me which kind of sorting you'd like to use.
This can be achieved with a "comparator" macro, called just after 

{% for item in my_topics %}

to create a new array of "my_topics", sorted the way you want.

Useful documentation:
For loops - https://designers.hubspot.com/docs/hubl/for-loops

Macros - https://designers.hubspot.com/docs/hubl/hubl-variables-and-macros-syntax

Base patterns for sorting algorithms (regardless of code used): https://dev.to/wangonya/sorting-algorithms-with-javascript-part-1-4aca

[GregDirick]

Hello Tirabuchi,

Thx for the reply.

In fact there are 7 tags sorted out by number of posts.

He'd like them to be displayed like this : 

Actualités/Evénements – Electricité/Domotique – Chauffage – Sanitaire – Ventilation – Construction – Rénovation

As I'm not a dev, my knowledge is more than limited on this point.

Thx.

Greg

[Tirabuchi · Accepted solution]

It's not nice (if you change the number of tags or its order, you'll have to modify this accordingly) but this is fast, easier to read than a cycle and gets the job done:

 {% set my_topics = blog_topics('default', 7) %}
<ul>
  <li><a href="{{ blog_tag_url(group.id, my_topics[1].slug) }}">{{ my_topics[1] }}</a></li>
  <li><a href="{{ blog_tag_url(group.id, my_topics[0].slug) }}">{{ my_topics[0] }}</a></li>
  <li><a href="{{ blog_tag_url(group.id, my_topics[3].slug) }}">{{ my_topics[3] }}</a></li>
  <li><a href="{{ blog_tag_url(group.id, my_topics[5].slug) }}">{{ my_topics[5] }}</a></li>
  <li><a href="{{ blog_tag_url(group.id, my_topics[6].slug) }}">{{ my_topics[6] }}</a></li>
  <li><a href="{{ blog_tag_url(group.id, my_topics[2].slug) }}">{{ my_topics[2] }}</a></li>
  <li><a href="{{ blog_tag_url(group.id, my_topics[4].slug) }}">{{ my_topics[4] }}</a></li>
</ul>

As you can see, I just used hardcoded references of blog_topics array.
Hope this helps.

Cheers,
Tirabuchi

[GregDirick]

Thx a lot Tirabuchi

That works fine.

Have a nice day.

Greg

[Tirabuchi]

Just to be clearer, if order (number of posts in category) is gonna change, you still have to do a simple cycle like this (translate it to Hubl sintax):

set (array = empty array with same length of tags array)
for (item in tags) {

if (item == 'The first tag you want to display') {

array[0] = item;

}  elseif (item == 'The second tag you want to display') {

array[1] = item;

} and so on.

} endfor.

After that, to print on screen, do the same you did before (a simple FOR (tag in array) generating the list).

Cheers,
Tirabuchi