Themeing taxonomy pages

Greetings,

I am using taxonomys and can display pages that are tagged with a taxonomy term. What I would like to do is use a different template for such pages, or at least generate a variable for templates so I can apply different styles/titles to the pages.

I really just want to make it clear to the viewer that they are looking at a list of items tagged with a particular term - otherwise it can be a bit confusing.

Cheers

Don

@dcrobertson

In your Twig template, you can get the taxonomy assigned to a page using:

page.header.taxonomy.mytag

Based on that variable you could do al sorts or things to change the layout/style of your page.

For example change the class of any element:

<body class="{{ page.header.taxonomy.mytag }}">

in combination with a style.css containing:

.cat {
   color: red;
}
.dog {
   color: green;
}

Or set the style of any element:

{% if page.header.taxonomy.mytag == 'cat' %}
    <body style="color: red">
{% elseif page.header.taxonomy.mytag == 'dog' %}
    <body style="color: green">
{% endif

Or change the layout of the page:

{% if page.header.taxonomy.mytag == 'cat' %}
    {% include 'partials/cat-partial.html.twig' %}
{% elseif page.header.taxonomy.mytag == 'dog' %}
    {% include 'partials/dog-partial.html.twig' %}
{% endif

Hope this gives you some idea’s of how you can change the layout/style of your page based on the taxonomy asigned to a page.

1 Like

If I am not mistaken, page.header.taxonomy.mytag would return the value of the taxonomy term ‘mytag’ as set in the individual page header.

What I am wanting is to be able to style or apply templates in the manner described, but to the pages that list items tagged with taxonomy terms.

Eg, when I am listing the pages tagged with ‘mytag’ at a url such as https://mysite/tag:mytag, I’d like to have a heading ‘Mytag Items’

I’ve tried to get variables for route, path, url etc - but they do not indicate that the page is a listing of tagged items. Is there a variable for collection items setting? Or something like that?

Cheers
don

@dcrobertson Yes, my examples were changing the appearance of the page containing a certain tag itself.

If you want to change the page that lists the pages with a certain tag and the tag is provided by the url parameters, you can use the variable: uri.params. See docs.

Given your url example https://mysite/tag:mytag, you might alter my previous examples with:

{% set tag = uri.params | split(':')[1] %}
{% if tag == 'mytag' %}
   {% set title = '"Mytag" items' %}
   ...

The above answers the question: How does the page dynamiccaly know which tag it has to use when searching for pages to list?

Your last sentence however, seems to ask a different question: How does a page know it has to list a set of pages?

The answer to that question lays in the direct relationship between the page and the Twig template assigned to the page. The template determines how the page should be rendered. See Content Pages & Twig Templates.