Taxonomy - active tag button

Archive
1

Hi,
how to highlight the active tag button?
Any ideas?

Marek

2

Can you give me a screenshot because it matters what theme your running and which ‘tag’ button you are talking about.

3

Active_tag_class

I want to highlight the active TAG button (sample = journal) on the sidebar and search results, theme antimatter.

Marek

4

It is possible, you would need to provide a partials/taxonomylist.html.twig file in your theme’s templates/ folder, then add some logic to it.

Basically as it loops over the taxonomy items, you check to see if that has been passed in via the URI object. Something like this:

{% set taxlist = taxonomylist.get() %}

{% if taxlist %}
<span class="tags">
    {% for tax,value in taxlist[taxonomy] %}
        {% set active = uri.param(taxonomy) == tax ? 'active' : '' %}
        <a class="{{ active }}" href="{{ base_url }}/{{ taxonomy }},{{ config.system.param_sep }},{{ tax|e('url') }}">{{ tax }}</a>
    {% endfor %}
</span>
{% endif %}
5

Hi,
thank you, this logic works fine for tag on the sidebar but unfortunately not for blog_item.html.twig,
It would be nice to see which tag has just been elected

Thanks,
Marek

6

uri.param(taxonomy) should work

7

Unfortunately, I still can’t force this to work on a blog_item.html.twig template
Marek

8

Well that was the one you had hightlighted in your screenshot! The same logic would need to be adapted for the displaying of the tags in the blog item.

9

The same logic on the blog item causes an error:
An exception has been thrown during the rendering of a template (“array_key_exists(): The first argument should be either a string or an integer”) in “partials/blog_item-a.html.twig” at line 28.

Whats’wrong?
Marek

10

Well it’s not exactly the same, but it’s similar.

If you want to be a successful web developer you will need to learn to break down and understand simple logical code and then adapt it to your needs. Try to understand what is happening in the sample code I gave you to get the highlight class added to the list of tags in the sidebar, then adapt that logic to the code that outputs the tags for each page. Once you understand this, then it should be a simple task.

Sure, I could open up antimatter, spend 5 minutes and write the code for your, but frankly that will be doing you a HUGE disservice. Take the time to work out how to do this and you will be a) very proud of yourself! and b) you will have gained knowledge to help you with similar tasks in the future!

11

Ofcourse you are right, sometimes a shortcut leads to nowhere, on the other hand, the knowledge must derive from smarter than us, so do not be surprised when sometimes I’ll ask you about something again

Thank you teacher :slight_smile:
Marek

12

Hi,
problem solved )
Thank you very much for help and time
Regards
Marek

13

What determines the order or the Tags in the tag list, I would like to organize the tags alphabetically but I dont see any place that sets the order of the list.

14

Hi Erik,

if you are using the above code, you can use the Twig filter sort :

{% set taxlist = taxonomylist.get() %}

{% if taxlist %}
<span class="tags">
    {% for tax,value in taxlist[taxonomy]|sort %}
        {% set active = uri.param(taxonomy) == tax ? 'active' : '' %}
        <a class="{{ active }}" href="{{ base_url }}/{{ taxonomy }},{{ config.system.param_sep }},{{ tax|e('url') }}">{{ tax }}</a>
    {% endfor %}
</span>
{% endif %}
1 Like