Versión móvil de Blogger para plantillas antiguas

Hace dos días, Pizcos avisaba de una nueva funcionalidad de Blogger: versión móvil de nuestros blogs. Y explicaba la manera de activar dicha funcionalidad desde Blogger in Draft. En su post lo podéis leer con más detalle.

Yo os voy a explicar cómo hacer una versión móvil para vuestro blog en Blogger, de manera muy fácil. Y sólo vamos a utilizar un poco de Javascript en la plantilla. Y es totalmente independiente de lo que explica Pizcos.

Este método lo he ideado a raíz de que los pasos a realizar en Blogger in Draft, explicados por Pizcos, a mi no me han dado resultado, y para no modificar excesivamente mi plantilla actual. Si es tu caso también, sigue leyendo.

Para empezar, necesitamos saber la URL de nuestro blog en versión móvil. Es muy fácil, sólo hay que añadir ?m=1 a la dirección de la página principal. Por ejemplo:

http://nombre_blog.blogspot.com/?m=1

En mi caso tengo dominio propio, y desde hace muy poco, pero se hace exactamente igual:

http://www.josegdf.net/?m=1

Una vez tenemos este dato, recurrimos a este pequeño script para forzar la redirección en el caso de que se abra la página en pantallas de menos de 400 píxeles de ancho:

<script type='text/javascript'>
//<![CDATA[
if(screen.width < 400){
location.replace('http://nombre_blog.blogspot.com?m=1')
}
//]]>
</script>

Cuanto más arriba en la plantilla, mejor, para que tarde menos en cargar. Yo lo he puesto justo a continuación de </b:skin>.

Por supuesto, hay que sustituir nombre_blog o nombre_blog.blogspot.com por tu dirección.

En cuanto al valor a poner en screen.width, con el valor de 400 he conseguido que se vea la versión móvil en un Nokia 5800 XpressMusic, pero se puede poner cualquier otro, pero si nos pasamos en el valor, en algunos mini portátiles se vería también la versión móvil directamente.

Otra buena alternativa, que descubrí visitando Blogtecnia con mi móvil, es BloggerTouch.

Script aprendido en Foros del Web (Raulmmmm) - Idea inspirada en el post de Pizcos citado más arriba.

Actualización del post y mejora del script

Me he dado cuenta de que, desde el móvil, al acceder a un post cualquiera desde un enlace directo, desde Twitter por ejemplo, el script redirige siempre a la página principal, así que he hecho un pequeño cambio para que siempre llegue la visita al destino correcto del link en el que hizo clic:

<script type='text/javascript'>
//<![CDATA[
if(screen.width < 400){
location.replace('?m=1')
}
//]]>
</script>