Acelerar tu blog con Lazy Load

Cuando un lector accede a tu blog, todos los elementos que componen la plantilla y especialmente las imágenes se cargan al mismo tiempo -a pesar de no estarse visualizando-. Al instalar Lazy load, plugin de jQuery, bloqueamos la carga de imágenes y hacemos que únicamente se muestren cuando el usuario desea verlas, es decir, a medida que baja por la página.

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

Busca la etiqueta </head> y añade esto encima:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/>
<script src='https://sites.google.com/site/scriptsbalcon/b/blcnlazzy' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function($){
jQuery("img").lazyload({
effect:"fadeIn",
});
});
</script>

La primera línea del bloque es la librería jquery (1.4.2) y se carga directamente desde las API de Google.

El término resaltado en naranja (img) representa a todas las imágenes del blog. Si tan solo deseas aplicar el truco a las imágenes de las entradas, utiliza el término .post img.

Guarda la plantilla y comprueba el resultado. Accede a la portada de tu bitácora y realiza un scroll de página hacia abajo para visualizar la aparición de toda imagen o icono.

Utilizando este script evitarás que se "atasque todo" cuando publicas muchas imágenes en los artículos.
Si tienes alguna duda con la implementación deja un comentario.