Ultima revisión 28/10/2012

TagCloud: Clase para crear nubes de etiquetas en PHP

Recientemente necesite usar nubes de etiquetas y he decidido realizar una pequeña clase para que crearlas sea portable, sencilla y que no necesie hacer grandes cambios para usarla.

Pues bien, ahora os la dejo para vuestro "use y disfrute".

La clase usa como fuente de datos una cadena en la que se encuentran todas las etiquetas o tags separadas por comas. Con la función create() se crearán las etiquetas y se le aplicarán los estilos definidos en tu CSS.

Código de la clase

<?php
class TagCloud {
            var $tags = "";
            var $url  = "";
            var $trimStr = "deleteSpaces";
            
            function create($tags, $url = ""){
                if($tags == "") $this->$tags = $tags;
                if($url == "") $url = $_SERVER['PHP_SELF'];
                $this->url = $url;
                
                // Formateamos y limpiamos el string sustituyendo caracteres especiales por comas
                $tags=substr($tags,0,strlen($tags)-1);
                $array_sustitucion = array(',,','.','/',':');
                $etiquetas=str_replace($array_sustitucion, ",", $tags);
    
                // Llenamos el array
                $etiquetas=explode(",",$etiquetas);
                @array_walk($etiquetas, $this->trimStr);
                $total=count($etiquetas);
                $etiquetasOk = array_count_values($etiquetas);
        
                foreach($etiquetasOk as $palabra=>$valor) {
                    $porcentaje = round($valor*100/$total);
                    if($porcentaje>= 70){
                        $estilo = 6;
                    }elseif($porcentaje>= 35){
                        $estilo = 5;
                    }elseif($porcentaje>= 30){
                        $estilo = 4;
                    }elseif($porcentaje>= 22){
                        $estilo = 3;
                    }elseif($porcentaje>= 10){
                        $estilo = 2;
                    }else{
                        $estilo = 1;
                    }
                    echo '<a href="'.$this->url.'?cat='.$palabra.'" title="Coincidencias: '.$valor.'" class="etiqueta'.$estilo.'">'.$palabra.'</a><span  class="etiqueta0">'.'('.$valor.')</span>';
                }
            }
            
            function deleteSpaces($e=' '){
                $e = trim($e);
            }
        }
?>

Estilos aplicados por CSS

Los estilos los podéis cambiar en la hoja de estilos CSS vuestra. Sólo tienen que estar definidos como los siguientes:

.etiqueta0 { color:#aaaaaa; font-size: 12px; }
.etiqueta0:hover span { text-decoration:none !important; }
a.etiqueta1 { font-size: 12px; text-decoration:none; padding:2px; margin:3px; display:inline-block; }
a.etiqueta2 { font-size: 16px; text-decoration:none; padding:2px; margin:3px; display:inline-block; }
a.etiqueta3 { font-size: 20px; text-decoration:none; padding:2px; margin:3px; display:inline-block; }
a.etiqueta4 { font-size: 24px; text-decoration:none; padding:2px; margin:3px; display:inline-block; }
a.etiqueta5 { font-size: 28px; text-decoration:none; padding:2px; margin:3px; display:inline-block; }
a.etiqueta6 { font-size: 32px; text-decoration:none; padding:2px; margin:3px; display:inline-block; }
a.etiqueta1:hover{ text-decoration:underline; }
a.etiqueta2:hover{ text-decoration:underline; }
a.etiqueta3:hover{ text-decoration:underline; }
a.etiqueta4:hover{ text-decoration:underline; }
a.etiqueta5:hover{ text-decoration:underline; }
a.etiqueta6:hover{ text-decoration:underline; }
a.etiqueta1:hover span{ text-decoration:none !important; color:#5567B9 }

Forma de usarla

Suponemos que tenemos una cadena que contiene los siguientes valores:

$tags = "KPIs,SEO,SEM,SEM,Marketing,Social Media,SEO,Marketing,SEM,Social Media,SERPsMarketing,Social Media,Social Media,SMO,Social Media,Redes Sociales,Redes Sociales";

si queremos crear la nube de etiquetas insertaremos las siguientes 2 líneas:

$tagCloud = new TagCloud;
$tagCloud->create($tags);

Si además le queremos enviar una URL distinta a la actual podemos incluirlo en la función create(). Si no se le pone URL se tomara por defecto la URL actual.

$tagCloud = new TagCloud;
$tagCloud->create($tags, $_SERVER['REQUEST_URI']);