Tags Macro Example

This example shows a 'relevance' based tag cloud, meaning that the size of the tags displayed correspond to the number of items in the site having the tag.

Smartsite SXML CopyCode image Copy Code
<se:tags mode="cloud" thesaurus="KWD" tagrelevancemode="relevance"
    maxrows="20" threshold="1" 
    minfontsize="3" maxfontsize=".6"
    default="Sorry, no tags"
    >
    <se:parameters>
        <se:parameter name="format">
            <se:rowformat>
                <a class="{string.concat('TagTerm', ' s', this.rank(this.field(usagecount)), sys.iif(this.field(Nr)==$nr, ' SelectedTerm'))}" 
                href="{url.setparameter(channel.link(TAGS), 'name', this.field(name))}">{this.field(name)}</a>
            </se:rowformat>
        </se:parameter>
        <se:parameter name="resultformat">
            <se:placeholder.addcss>
                .MyTags {border: 1px dotted #ddd; width: 200px; padding: 2px; text-align: center; word-spacing: 1em}
                .MyTags .TagTerm {line-height: 1.05em }
                .MyTags .s0 {font-size: 1.0em; color: #55b; vertical-align: top; letter-spacing: -.1em}
                .MyTags .s1 {font-size: 1.2em; color: #22bb55; ; letter-spacing: .1em}
                .MyTags .s2 {font-size: 1.4em; vertical-align: bottom;}
                .MyTags .s3 {font-size: 1.6em; color: #b55}
                .MyTags .s4 {font-size: 1.8em; color:# b5b}
                .MyTags .s5 {font-size: 1.9em; color: #55b}
                .MyTags .s6 {font-size: 2.1em; font-weight: bolder}
                .MyTags .s7 {font-size: 2.3em}
            </se:placeholder.addcss>
            <div class="MyTags">{this.result()}</div>
        </se:parameter>
    </se:parameters>
</se:tags>