domingo, 28 de noviembre de 2010

Blogumus o wp-cumulus en blogger "How-To"

Acabo de añadir "Blogumus", también conocido como "wp-cumulus", a mi blog de blogger, es un plugin diseñado originalmente para wordpress y que se encarga de mostrar las etiquetas de nuestro blog en forma de "nube", además es mucho más atractivo visualmente que el widget "etiquetas" que viene por defecto con blogger. Una bloggera de bloggerbuster ha conseguido hacerlo funcionar en blogger. Aquí dejo las instrucciones:

Lo primero que hay que hacer es guardar una copia de seguridad de nuestra plantilla. Después, una vez tengamos un respaldo de nuestra plantilla a salvo, activamos la opción "Expandir plantillas de artilugios" y buscamos la Línea:
<b:section-contents id='sidebar-right-1'>
Y justo debajo copiamos el siguiente código: Es recomendable copiar todo en el bloc de notas y luego pasarlo al editor de html de blogger.
<b:widget id='Label99' locked='false' title='Blogumus' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<script src='http://sites.google.com/site/bloggerustemplatus/code/swfobject.js' type='text/javascript'/>
<div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
<script type='text/javascript'>
var so = new SWFObject(&quot;http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;210&quot;, &quot;210&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
// uncomment next line to enable transparency
so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
so.addVariable(&quot;tcolor&quot;, &quot;0xffffff&quot;);
so.addVariable(&quot;tcolor2&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;hicolor&quot;, &quot;0x6699ff&quot;);
so.addVariable(&quot;mode&quot;, &quot;tags&quot;);
so.addVariable(&quot;distr&quot;, &quot;true&quot;);
so.addVariable(&quot;tspeed&quot;, &quot;100&quot;);
so.addVariable(&quot;tagcloud&quot;, &quot;<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>&quot;);
so.addParam(&quot;allowScriptAccess&quot;, &quot;always&quot;);
so.write(&quot;flashcontent&quot;);
</script>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Al acabar, guardamos la plantilla, a partir de ahora en "Elementos de la Página" nos aparecerá un nuevo widget llamado blogumus que nos servirá para mover el widget donde queramos.
Para cambiar el color de las etiquetas mostradas, deberemos "jugar" con las siguientes líneas
so.addVariable(&quot;tcolor&quot;, &quot;0xffffff&quot;);
so.addVariable(&quot;tcolor2&quot;, &quot;0x333333&quot;);
so.addVariable(&quot;hicolor&quot;, &quot;0x6699ff&quot;);
Siendo tcolor el color primario de las etiquetas de la nube, tcolor2 el color secundario y hicolor el color del resaltado, podéis mirar ésta imagen para saber los códigos de color: ffffff para blanco, 000000 para negro etc... Para hacer que aparezca el fondo (en vez de que sea invisible como en mi blog), cambiar
so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
Comentando la línea añadiendo // al principio de esta manera
//so.addParam(&quot;wmode&quot;, &quot;transparent&quot;);
Y editando esta línea podéis cambiar el color del fondo y la altura y anchura del widget.
<script type='text/javascript'>
var so = new SWFObject(&quot;http://sites.google.com/site/bloggerustemplatus/code/tagcloud.swf&quot;, &quot;tagcloud&quot;, &quot;210&quot;, &quot;210&quot;, &quot;7&quot;, &quot;#ffffff&quot;);
Podéis descargar el script "swfobject.js" y el archivo "SWF" y alojarlos donde queráis, o utilizar los del ejemplo. El único inconveniente que tiene es que no se pueden utilizar acentos en las etiquetas, si se utilizan, al hacer click en la nube, el "buscador" dará error.
Más Información en este enlace a bloggerbuster. Y en la web del creador del plugin wp-cumulus.

No hay comentarios:

Publicar un comentario