-
Notifications
You must be signed in to change notification settings - Fork 6
Tips: category images in your listing
Lodewijk Evers edited this page Dec 21, 2016
·
2 revisions
If you want to add category images you first have to create an image for each category.
Suppose you have 3 categories: Category 1, Category 2 and Category 3
categories:
name: Categories
slug: categories
singular_name: Category
singular_slug: category
behaves_like: categories
multiple: true
options: { category-1: "Category 1", category-2: "Category 2", category-3: "Category 3" }
Create an image for each category that has the name the same as the category slug. (In this example all images are .png
images, you can use other types as long as they are all the same and you update the twig code to match.)
If you place those images in the images
folder of your theme it should look like this:
mytheme/images/category-1.png
mytheme/images/category-2.png
mytheme/images/category-3.png
In your twig file you can then list the categories with images like this:
{% set list = taxonomylist('categories') %}
<ul>
{% for item in list %}
<li>
<a class="taxonomy-{{ item.slug }}" href="{{ item.link }}" title="{{ item.name }}">
<img src="{{ paths.theme }}/images/{{ item.slug }}.png" alt="{{ item.name }}">
</a>
</li>
{% endfor %}
</ul>