Textpattern tips, tutorials and code snippets

Highlight the active article title

I wanted to know how to style the active article title on a section landing page, so I asked the question in this thread on the ever helpful Textpattern Forums.

Els kindly posted some code, which I have adjusted slightly.

The code

<txp:if_individual_article>
	<txp:article_custom section="whatever" sort="whatever">
		<txp:if_first_article><ol class="whatever"></txp:if_first_article>
		<li<txp:if_article_id> class="active"</txp:if_article_id>><txp:permlink><txp:title /></txp:permlink></li>
		<txp:if_last_article></ol></txp:if_last_article>
	</txp:article_custom>
<txp:else />
	<txp:article_custom section="whatever" sort="whatever">
		<txp:if_first_article><ol class="whatever"></txp:if_first_article>
		<li<txp:if_first_article> class="active"</txp:if_first_article>><txp:permlink><txp:title /></txp:permlink></li>
		<txp:if_last_article></ol></txp:if_last_article>
	</txp:article_custom>
</txp:if_individual_article>

Place this in your page template, and adjust the attributes – section="whatever" etc – as required.

Another way, using a plugin

Forum moderator mrdale came up with another method, using the rvm_if_this_article plugin:

<txp:if_first_article><ul></txp:if_first_article>
<li class="<txp:rvm_if_this_article> active</txp:rvm_if_this_article>"><txp:permlink><txp:title/></txp:permlink></li>
<txp:if_last_article></ul></txp:if_last_article>

Thanks to the forum users who posted these solutions.

4 Comments Comment feed

The if_first_article/if_last_article trick isn’t needed. You can just put wraptag=“ul” in <txp:article_custom>.

Incredible… Just what I was looking for! Thanks a lot, it works perfectly. I used the custom code one, it is more flexible then the plugin one though I installed it as well. Thanks a lot, and please, keep posting these great tips!
Thanks to Maniquí too!

This post (in the same thread as mentioned above!) with a highlighting ‘active’ solution for article titles in a category list is very nice too!

Fantabulous.
Thanks a lot, help helpful.

Add a comment

Use Textile help to style your comments