Tutorial ayuda para tu Blog

Lo más probable es que si tienes un blog en blogger conozcas muy bien que existe la
posibilidad de añadir gadgets (elementos de página) a la sidebar o barra lateral. Uno de
los gadgets más destacados y, al mismo tiempo, más utilizados es el de "Lista de blogs".

Dicho elemento sirve para mostrar lo que lees con un blogroll (lista de enlaces) de tus
blogs favoritos.

El resultado es bastante prometedor ya que los blogs enlazados se van desplazando
hacia arriba, haciendo posible el que tu blog cargue con mayor rapidez.

Puedes ver un ejemplo en este blog de pruebas.

¿Te gusta el resultado? Sigue los pasos para conseguir la lista de blogs en movimiento...

Comprueba que has añadido el gadget "Lista de blogs":

En caso de no tenerlo, agrégalo a tu barra lateral.
Diseño>Edición de HTML>expandimos artilugios

Busca esta línea:
<b:widget id='BlogList1' locked='false' title='Blog de mis amigos'
type='BlogList'>

Lo que ves en naranja es el título de mi gadget. El tuyo tendrá el título que le
hayas atribuido.

Un poco más abajo encontrarás esta otra línea:
<b:includable id='main'>

Ahora borra desde esta línea hasta su etiqueta de cierre </b:includable>
(ambas incluidas) como te muestro a continuación:

<b:widget id='BlogList1' locked='false' title='Mi lista de blogs' type='BlogList'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>

<div class='widget-content'>
<div class='blog-list-container' expr:id='data:widget.instanceId +
"_container"'>
<ul expr:id='data:widget.instanceId + "_blogs"'>
<b:loop values='data:items' var='item'>
<li expr:style='data:item.displayStyle'>
<div class='blog-icon'>
<b:if cond='data:showIcon == "true"'>
<input expr:value='data:item.blogIconUrl' type='hidden'/>
</b:if>
</div>
<div class='blog-content'>
<div class='blog-title'>
<a expr:href='data:item.blogUrl' target='_blank'>
<data:item.blogTitle/></a>
</div>

<div class='item-content'>
<b:if cond='data:showItemThumbnail == "true"'>
<b:if cond='data:item.itemThumbnail'>
<div class='item-thumbnail'>
<img alt='' border='0' expr:height='data:item.itemThumbnail.height'
expr:src='data:item.itemThumbnail.url'
expr:width='data:item.itemThumbnail.width'/>

</a>
</div>
</b:if>
</b:if>
<b:if cond='data:showItemTitle == "true"'>
<span class='item-title'>
<b:if cond='data:item.itemUrl != ""'>
<a expr:href='data:item.itemUrl' target='_blank'>
<data:item.itemTitle/></a>
<b:else/>
<data:item.itemTitle/>
</b:if>
</span>
</b:if>
<b:if cond='data:showItemSnippet == "true"'>
-
</b:if>
<span class='item-snippet'>
<data:item.itemSnippet/>

</span>
</b:if>
<b:if cond='data:showTimePeriodSinceLastUpdate == "true"'>
<div class='item-time'>
<data:item.timePeriodSinceLastUpdate/>
</div>
</b:if>
</div>
</div>
<div style='clear: both;'/>
</li>
</b:loop>
</ul>

<b:if cond='data:numItemsToShow != 0'>
<b:if cond='data:totalItems > data:numItemsToShow'>
<div class='show-option'>
<span expr:id='data:widget.instanceId + "_show-n"' style='display:
none;'>
<a href='javascript:void(0)' onclick='return false;'><data:showNText/></a>
</span>
<span expr:id='data:widget.instanceId + "_show-all"' style='margin-
left: 5px;'>
<a href='javascript:void(0)' onclick='return false;'><data:showAllText/></a>
</span>
</div>
</b:if>
</b:if>

<b:include name='quickedit'/>
</div>
</div>
</b:includable>
</b:widget>

Una vez eliminado, inserta este otro código en su lugar:


<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>

<div class='widget-content'>
<div class='blog-list-container' expr:id='data:widget.instanceId +
"_container"'>
<marquee direction='up' onmouseout='this.start()' onmouseover='this.stop()'
scrollamount='1' scrolldelay='1' style='height: 240px; padding: 4px; border: 2px
solid #cccccc;'><ul expr:id='data:widget.instanceId + "_blogs"'>
<b:loop values='data:items' var='item'>

</b:if>
</div>
</div>
<div style='margin-bottom: 14px; border: 3px solid #ccc; clear: both;'/>

</li>
</b:loop>
</ul></marquee>

<b:if cond='data:numItemsToShow != 0'>
<b:if cond='data:totalItems > data:numItemsToShow'>
<div class='show-option'>
<span expr:id='data:widget.instanceId + "_show-n"' style='display:
none;'>
<a href='javascript:void(0)' onclick='return false;'><data:showNText/></a>

</span>

<span expr:id='data:widget.instanceId + "_show-all"' style='margin-
left: 5px;'>
<a href='javascript:void(0)' onclick='return false;'><data:showAllText/></a>
</span>
</div>
</b:if>
</b:if>

<b:include name='quickedit'/>
</div>
</div>
</b:includable>

En caso de querer editar el movimiento, reemplaza el valor 1 (marcado en rojo)
por 2, 3, 4...

Para cambiar la dirección y hacer que los blogs "suban" en lugar de que "bajen"
cambia down por up
Guarda el gadget para terminar.

¡Ya podrás disfrutar de una bonita lista en movimiento!

Tutorial ayuda para tu Blog

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (8)

Destacado

Destacado (6)

Similar a Tutorial ayuda para tu Blog

Similar a Tutorial ayuda para tu Blog (20)

Último

Último (20)

Tutorial ayuda para tu Blog