The future's so bright, I gotta wear shades!
Copyright-free image from Tack-o-Rama
Do you hate how your Labels look? All straggly and a list that goes on forever? You want to be thorough, you want to label your posts properly so that others can find them... but...
You need a label cloud!
This does take a little bit of code, but it isn't that hard and YES you can do it! Just follow the instructions exactly.
Before you start
BEFORE you start, though, go to Layout > Edit Html > Download Full Template. This saves your template to your Desktop, and it can be uploaded again, no damage done, if you made a complete hash of things - so no worries!
Go to Layout > Edit HTML
Open a new web page, then go here for the instructions for the label cloud as you'll need to go back & forth between the two pages.
Do exactly as in the instructions. To make it easy on yourself, click CTRL + F on your keyboard to open up the Find: box (a white box which will sit just above your bottom toolbar, immediately above your Start button). Copy&paste the first piece of code you need to find into this box, and it will highlight in the HTML box. Follow the instructions then go to the next section, etc etc.
When you have entered everything, you pretty much have your tag cloud sorted. You now need to alter the size by typing var maxFontSize into that Find box, so it highlights, then change the size if you want to (my max is set at 20 but my minimum is set at 12 as I like my fonts bigger so they are easier to read).
In the same section you'll see the colour codes: var maxColor
Here is where you change the set colours to the ones YOU want. The max colour is the most linked colour (the link will also show as the largest typeface) and the min colour is the link least typed in (and will show as the smallest typeface). The colours and sizes will sort themselves out as to how many times you type that particular link as a label for your post.
You need to choose two contrasting colours, then the size/colour range will vary between the two. The bigger the contrast, the more range of colour will show.
Open up another web page and click the link to choose your colours from the hexadecimal colour chart codes
Scroll down the page, and you will see the colours have a title at the top of each box, eg: RED is #CC0000 (this is how the colour would appear in your Fonts&Colours, in Layouts, when setting up your blog colours) but for the html code you are writing in your Label Cloud, you will use the three sets of numbers below, with a comma separating each colour (no spaces).
So var maxColor codes for RED would be typed in as 204,0,0
When you have finished, click Preview to see how it looks. Hate it? Want another go? Click Clear Edits, and all the code will be removed and you can start again. Click Save Template, and you're done... go and admire!
Clicked Save Template and you didn't mean to... well, you Downloaded Full Template before you started, so just reload it.
Hope you enjoyed this little tutorial! I love tag clouds!