XF 1.3 Add variable as class name

[NeoCHI]

Currently I'm using a bunch of if statements to check what the value is in $subCat.category_name then adding a class based on what it is:

  <xen:if is="{$subCat.category_name} == 'Review'">
                                   <li><a href="{xen:link 'articles', $subCat}" class="ribbon categoryReview">{$subCat.category_name}</a></li>
                                <xen:elseif is="{$subCat.category_name} == 'Release'" />
                                   <li><a href="{xen:link 'articles', $subCat}" class="ribbon categoryRelease">{$subCat.category_name}</a></li>
                                 .
                                 .
                                 .
                                <xen:else />
                                   <li><a href="{xen:link 'articles', $subCat}" class="ribbon">{$subCat.category_name}</a></li>

But I'm guessing there should be a more direct to make $subCat.category_name one of the classes of the <a> tags.

 

[Liam W]

<li><a href="{xen:link 'articles', $subCat}" class="ribbon category{$subCat.category_name}">{$subCat.category_name}</a></li>
<li><a href="{xen:link 'articles', $subCat}" class="ribbon category{$subCat.category_name}">{$subCat.category_name}</a></li>
<li><a href="{xen:link 'articles', $subCat}" class="ribbon category{$subCat.category_name}">{$subCat.category_name}</a></li>

and so on...

 

[NeoCHI]

<li><a href="{xen:link 'articles', $subCat}" class="ribbon category{$subCat.category_name}">{$subCat.category_name}</a></li>
<li><a href="{xen:link 'articles', $subCat}" class="ribbon category{$subCat.category_name}">{$subCat.category_name}</a></li>
<li><a href="{xen:link 'articles', $subCat}" class="ribbon category{$subCat.category_name}">{$subCat.category_name}</a></li>

and so on...

Wow coulda sworn I tried that....anyways thanks!

 

[Paul B]

You can also use a slightly shorter version of xen:if/else within the class declaration itself.
For example:

<div class="{xen:if "{$param}", 'thisClass', 'thatClass'} anotherClass">Content</div>