Assign conditional tag or use plug-in for active class?

christina.helen · 2009-03-29 23:14:53

Hi,

I would like to assign an active class (class=opacity) to the active article. The form I am using is

bc.
<txp:if_first_article><ul id=“portfolio”></txp:if_first_article> <li><a class=“opacity” href=”<txp:permlink />”><txp:excerpt /></a></li>
<txp:if_last_article></ul></txp:if_last_article>

How would I write a conditional tag to make only the article I am on use the opacity class? I have also seen the glx_hl_current plug-in but not sure which would be best.

Thanks for any help!

redbot · 2009-03-30 00:24:34

Try rvm_if_this_article

christina.helen · 2009-03-30 13:38:11

Thanks! I used the rvm plugin and it is working great. This forum is so helpful.

christina.helen · 2009-03-31 17:13:38

One more thing…using the rvm_if_this_article plugin works great for showing my active class except for on my section landing page (the gray thumbnail on the left should not be opaque but should be active).

I am using the following code on my portfolio page:

<div id="sidebar">
      <h4>Recent Projects</h4>
      <txp:article_custom sort="custom_5 asc" section="portfolio" form="portfolio_thumbs" />
</div>

and my portfolio_thumbs form is:

<txp:if_first_article><ul id="portfolio"></txp:if_first_article>
	<li<txp:rvm_if_this_article> class="active"</txp:rvm_if_this_article>><a href="<txp:permlink />"><txp:excerpt /></a></li>
<txp:if_last_article></ul></txp:if_last_article>

What would you suggest I add to make the landing page gray thumbnail active? Many, many thanks in advance.

els · 2009-03-31 18:27:31

rvm_if_this_article only works in individual context. You can solve it by replacing <txp:rvm_if_this_article> class="active"</txp:rvm_if_this_article> with

<txp:rvm_if_this_article> class="active"<txp:else /><txp:if_first_article> class="active"</txp:if_first_article></txp:rvm_if_this_article>

Note: the above code assumes that the article shown on the section landing page is always the first article in the list.

christina.helen · 2009-03-31 20:53:25

Thanks, Els. I replaced my form to read:

<txp:if_first_article><ul id="portfolio"></txp:if_first_article>
	<li<txp:rvm_if_this_article> class="active"<txp:else /><txp:if_first_article> class="active"</txp:if_first_article></txp:rvm_if_this_article>><a href="<txp:permlink />"><txp:excerpt /></a></li>
<txp:if_last_article></ul></txp:if_last_article>

Now the thumbnail is in the active state on the landing page but doesn’t go off of it when I switch articles (click on other thumbnails). Here’s the link so you can see what I mean.

els · 2009-03-31 21:21:20

Ah, I see, sorry. One more conditional added:

<txp:if_first_article><ul id="portfolio"></txp:if_first_article>
	<li<txp:rvm_if_this_article> class="active"<txp:else /><txp:if_article_list><txp:if_first_article> class="active"</txp:if_first_article></txp:if_article_list></txp:rvm_if_this_article>><a href="<txp:permlink />"><txp:excerpt /></a></li>
<txp:if_last_article></ul></txp:if_last_article>

christina.helen · 2009-04-01 00:57:19

Sorry, but I tried the above form and it did the same as the previous. The active state for the first thumbnail doesn’t come off on the other articles. Here is my html calling the form, in case it helps.

<div id="sidebar">
      <h4>Recent Projects</h4>
      <txp:article_custom sort="custom_5 asc" section="portfolio" form="portfolio_thumbs" />
</div>

Any other ideas of what I am doing wrong?

Last edited by christina.helen (2009-04-01 03:02:23)

els · 2009-04-01 10:45:40

OK, new approach. You are not doing anything wrong, you’re just doing what I told you to do ;)
Forget about the forms, try this code on your page:

<txp:if_individual_article>
	<txp:article_custom sort="custom_5 asc" section="portfolio">
		<txp:if_first_article><ul id="portfolio"></txp:if_first_article>
		<li<txp:rvm_if_this_article> class="active"</txp:rvm_if_this_article>><a href="<txp:permlink />"><txp:excerpt /></a></li>
		<txp:if_last_article></ul></txp:if_last_article>
	</txp:article_custom>
<txp:else />
	<txp:article_custom sort="custom_5 asc" section="portfolio">
		<txp:if_first_article><ul id="portfolio"></txp:if_first_article>
		<li<txp:if_first_article> class="active"</txp:if_first_article>><a href="<txp:permlink />"><txp:excerpt /></a></li>
		<txp:if_last_article></ul></txp:if_last_article>
	</txp:article_custom>
</txp:if_individual_article>

You must add the sort="custom_5 asc" to the article tag that displays the full article as well. If both article lists are not sorted in the same way, the if_first_article condition won’t match the full article. (The ‘single’ article on your section landing page is an article list, even though it’s only one article!)
In other words: if, for some reason, you want to use two different sort values, this code just won’t work.

Last edited by els (2009-04-01 10:47:14)

christina.helen · 2009-04-01 17:32:40

Once again, Els, many thanks. This worked perfectly! The first thumbnail now is “off” when I click to other articles. I appreciate your help.

Textpattern CMS

Textpattern CMS support forum

#1 2009-03-29 23:14:53

Assign conditional tag or use plug-in for active class?

#2 2009-03-30 00:24:34

Re: Assign conditional tag or use plug-in for active class?

#3 2009-03-30 13:38:11

Re: Assign conditional tag or use plug-in for active class?

#4 2009-03-31 17:13:38

Re: Assign conditional tag or use plug-in for active class?

#5 2009-03-31 18:27:31

Re: Assign conditional tag or use plug-in for active class?

#6 2009-03-31 20:53:25

Re: Assign conditional tag or use plug-in for active class?

#7 2009-03-31 21:21:20

Re: Assign conditional tag or use plug-in for active class?

#8 2009-04-01 00:57:19

Re: Assign conditional tag or use plug-in for active class?

#9 2009-04-01 10:45:40

Re: Assign conditional tag or use plug-in for active class?

#10 2009-04-01 17:32:40

Re: Assign conditional tag or use plug-in for active class?

Board footer