Recargar la página igual que en iOS con Hook: cómo instalarlo en tu blog

Una de las novedades más útiles que trajo consigo iOS fue la acción de arrastrar hacia abajo y soltar para actualizar una aplicación, un timeline o una página web. Si no recuerdo mal la primera vez que vi esa función fue en el ya desaparecido Tweetie, el primer cliente decente de Twitter para el iPhone, que al final el propio Twitter terminó comprando y destrozando.

Pues ese sencillo gesto de arrastrar hacia abajo y soltar para actualizar ya podemos tenerlo también en nuestra página web o blog con Hook. Se trata de un script desarrollado por Jordan Singer y Brandon Jacoby que podemos descargar gratuitamente (al pie tenéis el enlace).

Cómo instalar Hook en tu blog

Instalarlo es muy sencillo. Una vez descargado debemos colocarlo en una carpeta llamada hook dentro del theme de WordPress que estemos usando.

Luego editamos el archivo header.php de nuestro theme y justo antes de la etiqueta </head> colocamos este código:

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<link rel="stylesheet" href="hook/hook.css" type="text/css" />
<script src="hook/hook.js" type="text/javascript"></script>

Después localizamos la etiqueta <body> y justo a continuación de la misma insertamos este código:

<div id="hook">
<div id="loader">
<div class="spinner"></div>
</div>
<span id="hook-text">Reloading...</span>
</div>

Y listo, tras guardar el archivo header.php ya sólo nos queda acceder a nuestro blog en el navegador y comprobar que funciona (es posible que debas refrescar la cache).

Descarga: Hook.js