We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 436 ☆ A M B ☆
    • 265 Posts
    I’m trying to figure out the best way for a client to select an icon to go alongside a heading. See this screenshot for an example of what I mean, each heading has a different icon, which the client can choose in the Manager.



    At the moment I have setup a radio option Template Variable so the client can select the icon to go with the article:



    Then in the getPage template for each article I have this code:

    <h1  
      [[+article-category:is=`euro`:then=`class="euro"`:else=`class="none"`]]
      [[+article-category:is=`shopping`:then=`class="shopping"`:else=`class="none"`]]
      [[+article-category:is=`house`:then=`class="house"`:else=`class="none"`]]
      [[+article-category:is=`sun`:then=`class="sun"`:else=`class="none"`]]  
      >


    This is the bit I don’t like and I’m sure there’s a better way to do this... this code will run a check for each possible TV option, if its true it will return a CSS class for the icon and add it to the heading.

    This will become messy when more icons are added, potentially there could be 15-25 icons to choose from; which running this check inside each template would become too processor intensive and could slow the site down. Especially displaying something like six articles on the homepage; that could be up to 150 checks undecided its also not that easy to update and modify.

    Anybody got any good ideas?
      MODX Ambassador for Thailand. Managing Director at Monogon, a web design and development studio based in Bangkok, Thailand. - Follow me on Twitter.
      • 36442
      • 97 Posts
      Why don’t just use:
      <h1 [[+article-category:notempty=`class="[[+article-category]]"`]]>