Tag cloud
Φίλοι bloggers, σήμερα σας παρουσιάζω ένα tag cloud …Μπορείτε να βάλετε όλο το κώδικα σαν gadget, html/javascript….μπορείτε επίσης να προσαρμόσετε τα χρώματα, ωστε να ταιριάζουν με τα χρώματα του blog σας…Ο ΚΩΔΙΚΑΣ:
<style>
.tagcloud { width:300px; margin:10px auto; font-family:Times; text-align:center; padding:15px 8px; border:solid 1px #000; background:#F4FA58; } .tcloud { padding:3px 6px; text-decoration:none; -o-transition:all 0.6s ease-in; -moz-transition:all 0.6s ease-in; -webkit-transition:all 0.6s ease-in; } .tcloud:link { color:#003EBA; } .tcloud:visited { color:#ff900; } .tcloud:hover { color:#ffffff; background:#08298A; text-decoration:none; } .tcloud:active { color:#ffffff; background:#5D7CBA; }
</style>
<div class="tagcloud"> <a style="font-size:10px" class="tcloud" href="ΕΤΙΚΕΤΑ-1" title="Title ΕΤΙΚΕΤΑ-1">ΕΤΙΚΕΤΑ-1</a> <a style="font-size:16px" class="tcloud" href="ΕΤΙΚΕΤΑ-2" title="Title ΕΤΙΚΕΤΑ-2"> ΕΤΙΚΕΤΑ-2</a> <a style="font-size:18px" class="tcloud" href="ΕΤΙΚΕΤΑ-3" title="Title ΕΤΙΚΕΤΑ-3">ΕΤΙΚΕΤΑ-3</a> <a style="font-size:14px" class="tcloud" href="ΕΤΙΚΕΤΑ-4" title="Title ΕΤΙΚΕΤΑ-4">ΕΤΙΚΕΤΑ-4</a> <a style="font-size:27px" class="tcloud" href="ΕΤΙΚΕΤΑ-5" title="Title ΕΤΙΚΕΤΑ-5">ΕΤΙΚΕΤΑ-5</a> <a style="font-size:22px" class="tcloud" href="ΕΤΙΚΕΤΑ-6" title="Title ΕΤΙΚΕΤΑ-6">ΕΤΙΚΕΤΑ-6</a> <a style="font-size:14px" class="tcloud" href="ΕΤΙΚΕΤΑ-7" title="Title ΕΤΙΚΕΤΑ-7">ΕΤΙΚΕΤΑ-7</a> <a style="font-size:18px" class="tcloud" href="ΕΤΙΚΕΤΑ-8" title="Title ΕΤΙΚΕΤΑ-8">ΕΤΙΚΕΤΑ-8</a> <a style="font-size:10px" class="tcloud" href="ΕΤΙΚΕΤΑ-9" title="Title ΕΤΙΚΕΤΑ-9">ΕΤΙΚΕΤΑ-9</a> <a style="font-size:14px" class="tcloud" href="ΕΤΙΚΕΤΑ-10" title="Title ΕΤΙΚΕΤΑ-10">ΕΤΙΚΕΤΑ-10</a> </div>***στο πρώτο μέρος του κώδικα (css) αλλάξτε τα χρώματα (πχ #ffffff)
***στο δευτερο μέρος, αλλάξτε αν θέλετε τα μεγέθη της γραμματοσειράς (πχ «font-size:10px)
***όπου href=»ΕΤΙΚΕΤΑ-1″ βαλτε τα link / url των ετικετών του blog σας…
***όπου title=»Title ΕΤΙΚΕΤΑ-1″>ΕΤΙΚΕΤΑ-1 βάλτε τον τίτλο και την ονομασία της ετικέτας…
***βάλτε κι άλλες ετικέτες, πολαπλασιάζοντας τη φράση
<a style="font-size:27px" class="tcloud" href="ΕΤΙΚΕΤΑ-5" title="Title ΕΤΙΚΕΤΑ-5">ΕΤΙΚΕΤΑ-5</a>