Keeping blog topic tag link active on pagination

SOLVE
donnakat1
Participant | Partner

I have created topic tag buttons for my blog that have an active state when on that topic page but once you click on next page the active state goes away. Here is the link. 

 

https://www.directimages.com/blog/topic/inbound-marketing

 

I need to keep the link active as long as you are on that topic. Can anyone help???

0 Upvotes
1 Accepted solution

Accepted Solutions
anthonypizzurro
Solution
HubSpot Product Team

It looks like your topic tags are hard-coded, and there is a programmatic way to output your topics which you can see here: 

 

This might not be a bulletproof solution, but since you know what your topics are, you should be able to match the 'topic slug' to the current URL like this: 

 

{% if request.path is string_containing "inbound-marketing" %}
<!-- This URL matches this link -->
{% endif %}

 

So in your template, your code would look something like: 

<a class="topic-tag {% if request.path is string_containing "inbound-marketing" %}active{% endif %}" href="/blog/topic/inbound-marketing">Inbound Marketing</a>

I hope that helps,

Anthony

View solution in original post

0 Upvotes
3 Replies 3
anthonypizzurro
HubSpot Product Team

Hi donnakat1,

 

Can you post the code that detects the active topic on the first page?

 

Best, 

Anthony

0 Upvotes
donnakat1
Participant | Partner

There is no code. I have a button that has the url of the topic page. I would probably have to do this with a script but so far only the button.

0 Upvotes
anthonypizzurro
Solution
HubSpot Product Team

It looks like your topic tags are hard-coded, and there is a programmatic way to output your topics which you can see here: 

 

This might not be a bulletproof solution, but since you know what your topics are, you should be able to match the 'topic slug' to the current URL like this: 

 

{% if request.path is string_containing "inbound-marketing" %}
<!-- This URL matches this link -->
{% endif %}

 

So in your template, your code would look something like: 

<a class="topic-tag {% if request.path is string_containing "inbound-marketing" %}active{% endif %}" href="/blog/topic/inbound-marketing">Inbound Marketing</a>

I hope that helps,

Anthony

View solution in original post

0 Upvotes