Link blog image to page URL in Antimatter Blog Theme

Archive
1

Hi Guys,

I know it’s mostly developer types in here but thought this might be useful to someone who’s not a coder (kind of like me :-). I’m using the Antimatter theme and wanted to link the blog image at the top of the posts to the post URL.

First you need to set up your custom theme using theme inheritance.

Then when you have that set up you need to edit your user/themes/mytheme/templates/partials/blog_item.html.twig file.

Where you see the code

   {% endif %}
        {% if big_header %}
            {{ page.media.images|first.cropResize(900,600).html }}
        {% else %}
            {{ page.media.images|first.cropZoom(900,300).html }}
        {% endif %}

You need to change it to

   {% endif %}
        <a href="{{ page.url }}">
        {% if big_header %} 
            {{ page.media.images|first.cropResize(900,600).html }}
        {% else %}
            {{ page.media.images|first.cropZoom(900,300).html }}
            </a>
        {% endif %}

Now the images that show at the top of your blog posts should link to the actual post.

Admins and developers if there’s a better way of doing this please let me know :slight_smile:

2

You need to put your last </a> below the {% endif %} or you will have issues when using big_header. This is because you have the opening tag above the if statement, so the closing tag should be below it.

3

Ahhh…thanks for that rhukster. Have made this edit.