Tutorial ayuda para tu Blog

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'>

http://losprocesos-productivos.blogspot.com/

<b:includable id='main'> <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'><a expr:href='data:item.blogUrl' target='_blank'><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 cond='data:showItemTitle == "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:includable id='main'><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'><li expr:style='data:item.displayStyle'><div class='blog-icon' style='visibility: hidden; display: none;'><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' style='margin-bottom: 14px; font-size: 14px; text-decoration: none;'><a expr:href='data:item.blogUrl' style='text-decoration: none;' target='_blank'><img src='http://icons3.iconfinder.netdna-cdn.com/data/icons/Sizicons/12x12/arrow_2_right_round.png'/> <data:item.blogTitle/>...</a></div><div class='item-content' style='text-decoration: none;'><b:if cond='data:showItemThumbnail == "true"'><b:if cond='data:item.itemThumbnail'><div class='item-thumbnail'><a expr:href='data:item.blogUrl' target='_blank'><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' style='color: #006633; text-decoration: none;' target='_blank'><data:item.itemTitle/></a><b:else/><data:item.itemTitle/></b:if></span></b:if><b:if cond='data:showItemSnippet == "true"'><b:if cond='data:showItemTitle == "true"'>...</b:if><span class='item-snippet'><data:item.itemSnippet/></span></b:if><b:if cond='data:showTimePeriodSinceLastUpdate == "true"'><div class='item-time' style='margin-top: 6px; color: #006633; text-align: right;'><img src='http://icons3.iconfinder.netdna-cdn.com/data/icons/circular%20icons/bullet_black.png' style='padding-right:

4px;'/><data:item.timePeriodSinceLastUpdate/></div></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!

CREADO POR: RAMON SANCHEZ

Tutorial ayuda para tu Blog

Technology

Transcript of Tutorial ayuda para tu Blog