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>