Tämä yksinkertainen jQuery skripti mahdollistaa kuvien lisäämisen tagien yhteyteen WordPressin tagipilvessä (wp_tag_cloud). Skriptillä voi myös muotoilla tagipilveä käyttämättä WordPressin funktioita. Yksittäisen tagin yhteydessä olevan kuvan koko muuttuu WordPressin antaman tekstin koon mukaisesti.
jQuery(function() {
var imagesize;
var alttxt;
var linkhref;
jQuery('a[class^="tag-link-"]').each(function() {
imagesize = jQuery(this).css('font-size');
alttxt = jQuery(this).text();
linkhref = jQuery(this).attr('href');
jQuery(this).before(
'<a title="tag: ' +alttxt+ '" href="' +linkhref+ '">
<img src="path/to/your/image"
style="width:'+imagesize+';height:'+imagesize+';"
alt="'+alttxt+' icon" /></a>'
);
});
});
Ensin määritellään muutama muuttuja. Sitten jQuery kohdistetaan tietyn class-attribuutin omaaviin linkkeihin. Tagipilven tagilinkkien luokkanimet alkavat tekstijonolla ’tag-link-’ (ja päättyvät tagin id-numerolla). jQueryn .each() -funktio käy läpi jokaisen löydetyn kohteen.
Muuttujille annetaan arvot kohdistetuista linkeistä: käytetty tekstin koko, näkyvä linkin teksti ja tag-arkistoon osoittava href-attribuutti. Tämän jälkeen kirjoitetaan kokonaan uusi html-pätkä tagilinkin eteen. Tässä tapauksessa luodaan kuvalinkki ja täytetään sen arvot vastaavilla muuttuja-arvoilla.
Tämän tapaisen skriptin voi helposti laajentaa muuttamaan tagipilven ulkoasua vielä laajemmalti: esimerkiksi tekstin värin voi säätää muuttumaan tekstin koon mukaisesti. Tämä skripti on parasta sijoittaa sivun footer-osioon tai ainakin tagipilven jälkeen.
