jueves, 30 de mayo de 2013

Mostrar gadgets solo en la entrada del blog

El tiempo de carga de una página suele ser por lo general el mayor problema que muestran todos los blogs, pudiendo no solo hacer que los lectores dejen de visitarlos sino también dificultar el acceso al contenido publicado.

Los gadgets que instalamos en la sidebar o barra lateral son, la mayoría de veces, culpables.

Algunos son fundamentales por la información o las ventajas que ofrecen pero otros no hacen más que sobre cargar el sitio web. No queremos eliminarlos y por ello simplemente haremos que se muestren exclusivamente en la página principal o portada, evitando así que el visitante pueda verlos al acceder a una entrada de forma individual.

La explicación está basada en un gadget html-javascript aunque el mismo método puede aplicarse a cualquier otro (el de Seguidores o el de Lista de blogs, por ejemplo).

Diseño>Edición de HTML>expandimos artilugios



Busca el código del gadget y añade lo que resalto en color rojo:

<b:widget id='HTML2' locked='false' title='Visitas del blog' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

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

Tal y como puedes ver, la primera línea aparece justo después de <b:includable id='main'> y su correspondiente cierre justo antes de </b:includable>.

Con este par de aclaraciones no importará que el código sea distinto por tratarse de otro gadget dado que las líneas previamente citadas aparecerán siempre.

Recuerda que para encontrar el código de un gadget en tu plantilla con facilidad, bastará con incluirle antes de acceder al apartado de Diseño>Edición de HTML, un título único.

Posteriormente y haciendo uso del buscador de tu navegador (puede abrirse presionando las teclas Ctrl y F simultáneamente) escribiremos el título.

Aplicando el truco a varios gadgets lograremos que en la portada todos queden visibles, pero al abrir un artículo se ocultarán y quedarán visibles aquellos a los que no les hayas aplicado la modificación.

Guarda la plantilla y habrás terminado

miércoles, 8 de mayo de 2013

Texto sobre imagen


Añadir texto sobre una imagen permite incluir el título de ésta, describirla, o anunciar su procedencia

martes, 7 de mayo de 2013

Un gadget para que los lectores escriban notas



Esta aplicación permite al lector de un blog dejar cuantas notas o apuntes personales desee.

Una de las grandes ventajas es la de poder guardar el contenido escrito. Tus visitantes podrán, no solo escribir notas, sino también guardarlas de tal forma que aparezcan cada vez que se pulse el botón situado en la barra lateral del blog al acceder al sitio.

Poder apuntar los ingredientes de una receta o coger ideas de un artículo sobre la alimentación del gato sin abandonar la página en la que nos encontramos es comodísimo.

¿La característica que lo hace todavía más atractivo? El uso de jQuery. El widget puede arrastrarse a donde queramos.

Si deseas verlo en acción pulsa sobre la imagen situada a la derecha del artículo. No olvides guardar tu nota al terminarla y acceder nuevamente al blog para comprobar que sigue presente.


Diseño>Edición de HTML>expandimos artilugios



Busca la etiqueta </head> y añade antes estas líneas:
<!-- Gadget Notas Balcon -->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'/>
<script src='https://sites.google.com/site/scriptsbalcon/b/bljaimNotas.js' type='text/javascript'/>
<link href='https://sites.google.com/site/scriptsbalcon/b/bljjNota.css' rel='stylesheet' type='text/css'/>
<!-- Fin del Gadget Notas Balcon -->

Guarda la plantilla.

Diseño>añadir gadget (elemento de página)>html-javascript




Incluye esto en su interior:
<a href="javascript:notepad.loadpad('mynotepad1')"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr3cP7P2jZlGW3t_eSVk59clrOo3UsjNv-Ljt2DBbcPyxQxjCdQ63nz00_yt9xswhmT3X7VKKyd7Au3_ZLsOgyzeZeQAzWGtO3OaqewgIANUzj2AsBJNJAT55GUIF3XQVBi4JZfASSvjJR/s320/jaimisnotas.png"/></a>

La línea resaltada en color verde pertenede a la URL del botón 'Mis notas'.

Si prefieres mostrar un enlace con texto en lugar de imagen utiliza este otro código:
<a href="javascript:notepad.loadpad('mynotepad1')">TEXTO</a>

Sustituye TEXTO por el título del enlace que abrirá el gadget.

Con esto incluirás una nota. Para ofrecer la opción de escribir varias notas (y por tanto mostrar más botones) introduce el mismo código, aumentando la cifra numérica del término mynotepad1 (mynotepad2).

Guarda el gadget para terminar.

Por último recuerda que el gadget usa jQuery por lo tanto, si usas Scriptaculous, Prototype o Mootools seguramente no podrás utilizarlo.

Cargando el blog


Esta es una forma de mostrar el estado del blog por medio de una imagen de carga

Acelerar tu blog con Lazy Load



Cuando un lector accede a tu blog, todos

Un gadget para que los visitantes escriban notas


Esta aplicación permite al lector de un blog dejar cuantas notas o apuntes personales desee.

Cursor con burbujas


Se trata de una bonita forma de adornar el cursor