Diseño Web

Ξ 14 comentarios

Cómo implementar una versión móvil de tu blog en WordPress

por Xabadu
Cómo implementar una versión móvil de tu blog en WordPress

Hoy en día la cantidad de gente que navega a través de dispositivos móviles va en aumento de forma exponencial, por lo que existe una alta probabilidad que un porcentaje de nuestros visitantes provengan de dichos dispositivos. Como tal, es bueno estar preparados y ofrecerles un contenido que pueda ser visualizado de forma más cómoda dependiendo su método de acceso.

Pues bien, en este sencillo y rápido tutorial de CLH, les enseñaremos a implementar versiones móviles de su blog en WordPress, ya sea para las nuevas generaciones de Smartphones (como el iPhone), como para los equipos más antiguos y otros dispositivos (como la PSP).

El detalle, como siempre, después del salto.

Como siempre, lo primero. (aunque hoy hay un nuevo primero):

Detalles del tutorial

  • Tiempo aproximado de implementación: 15 minutos.
  • Dificultad: Sencillo.
  • Conocimientos requeridos: Instalación de plugins en WordPress.

toolsImplementos necesarios:

  • Un blog en WordPress (instalación propia).
  • Los plugins MobilePress y/o WPTouch (el primero es para dispositivos móviles más antiguos y el segundo para más modernos).
  • Opcionalmente un cliente FTP para subir los plugins para su posterior instalación.

Nota: En el caso de los plugins, dejamos incluídos ambos para que puedan seleccionar según quieran. En el caso de CLH, inicialmente utilizabamos MobilePress para dar soporte a cualquier tipo de dispositivo móvil. Desde esta semana, contamos adicionalmente con WPTouch para dispositivos más nuevos, con lo que se despliegan distintos resultados gráficos dependiendo del equipo con el que se accede (incluiremos capturas más adelante).

Con eso claro, vamos, manos a la obra:

processProcedimiento:

1.- Lo primero que debemos hacer es proceder con la instalación de los plugins, ya sea de forma manual o bien de forma automática para versiones de WordPress desde la 2.7.1 en adelante:

Procedimiento manual

  1. Descargamos los plugins desde los enlaces provistos en la sección implementos necesarios de este tutorial.
  2. Los descomprimos en nuestro equipo.
  3. Los subimos vía FTP al hosting donde tenemos alojado nuestro blog, en el directorio correspondiente a los plugins (por lo general dentro del directorio wp-content/plugins).
  4. Los activamos mediante la opción Plugins de nuestro tablero de WordPress.

Procedimiento automático

  1. Realizamos la búsqueda de los plugins en la opción Añadir de la pestaña Plugins en nustro tablero, mediante los parámetros: MobilePress y WPTouch.
  2. Hacemos click en el enlace Instalar ubicado al extremo derecho del plugin.
  3. Hacemos click en el enlace Activar una vez que el plugin haya sido instalado.

2.- Y luego seguimos con las configuraciones correspondientes a cada uno:

MobilePress

En el caso de MobilePress, hay 3 secciones principales que podemos personalizar: Opciones generales, Plantillas y Publicidad/Estadísticas:

a) Opciones generales

En esta parte podemos configurar los siguientes parámetros:

  • Título del blog: Si dejamos en blanco, toma el título por defecto del blog.
  • Descripción del blog: Lo mismo que arriba.
  • Directorio de plantillas: Donde se almacenarán las plantillas para el diseño móvil.
  • Forzar sitio móvil: Debemos activar si queremos que todos los usuarios que entren, independiente que equipo usan, vean este diseño.

b) Plantillas: Nos permite configurar el aspecto visual de la versión móvil:

Aquí podemos seleccionar la plantilla que queramos y activarla para que sea vista por los usuarios que ingresan al sitio.

c) Publicidad/Estadísticas: MobilePress ofrece, mediante una integración con el servicio Aduity la posibilidad de insertar publicidad en la versión móvil del sitio y hacer un seguimiento con estadísticas.

Para esto nos solicita 2 parámetros, que con la clave pública y la clave secreta de la cuenta. Ambos datos pueden ser obtenidos al registrarse en el servicio.

WPTouch

Este plugin, si bien no permite la instalación de plantillas, es mucho más flexible en cuanto su configuración y permite hacer algunos ajustes desde el punto de vista gráfico, así como la personalización de casi todos los aspectos en términos de información que se desplegarán al usuario, como exclusión de categorías, mostrar o no los comentarios y mucho más.

Las pantallas de configuración:

Opciones generales y noticias de los desarrolladores

Opciones avanzadas

Opciones de estilo y color

Iconos por defecto y personalizados (es posible subir imágenes propias para el logo y detalles de los artículos)

Arriba: Publicidad, estadísticas y código personalizado. Abajo: Compatibilidad con otros plugins.

Las opciones son bastante autoexplicativas, por lo que no entraremos en detalles, solo remarcar que la cantidad de ítems que pueden ser personalizados es bastante alta, por lo que es bueno analizarlas todas a fondo e ir probando hasta encontrar el resultado que más nos acomode.

La razón de porque no entraremos en detalle en las opciones es para enfocarnos en algo más importante. Este plugin presenta una incompatibilidad importante con otro muy utilizado, como es el caso de WP Super Cache, pero que puede ser solucionado mediante una pequeña configuración que ahora pasaremos a ver.

Solucionando incompatibilidad de WP Touch y WP Super Cache

1.- Si revisamos la configuración de WPTouch, veremos que en la sección de opciones avanzadas, hay algunos agentes definidos. Debemos copiar esta lista que aparece:

2.- Luego, vamos a la configuración de WP Super Cache (por lo general bajo Opciones en nuestro tablero de WordPress) y ajustamos algunos parámetros, partiendo primero por el estado de WP Super Cache, el cual por defecto aparece como Activado y debemos cambiarlo a A Medias. Lo que hará esto será desactivar Super Cache y dejar solamente WP Cache corriendo, lo cual es más que suficiente para la mayoría de sitios y además permitirá tener WP Touch activado. Luego de cambiar actualizamos el estado con el botón de la misma sección.

3.- Luego, debemos ir a la sección Agentes de usuario rechazados en la misma configuración de WP Super Cache, y añadir todos los que copiamos de la configuración de WP Touch (en el paso 1 de esta sección). Ojo al momento de añadir eso si, que si bien los originales que copiamos estaban separados por comas, aquí debemos ingresarlos uno por línea y sin comas, y luego grabar los cambios. Esto hará que todos esos agentes móviles sean rechazados por las versiones de nuestras páginas que se han creado en el caché, y por ende les desplegarán la versión móvil correspondiente:

4.- Y finalmente, debemos limpiar el caché para que se cree nuevamente:

Y de esa forma quienes ingresen con alguno de esos agentes móviles podrán ver la versión correspondiente. Adicionalmente, en el pie de página les aparecerá una opción para visualizar la versión normal del sitio.

Y ahora, lo más importante:

acceptResultado final

Quienes vean la versión de MobilePress, verán algo como lo que sigue:

Kenerd – Un blog de.. ehm.. hartas cosas

Y quienes vean la versión de WP Touch, verán algo como esto:

Cómo Lo Hago – Un blog de… ehm… hartas otras cosas

Y así de simple tenemos nuestra versión móvil del blog para presentar a los usuarios.

Antes de terminar, como siempre les recordamos que este tutorial ha sido:

Cualquier comentario o duda que puedan tener, los invitamos a dejarnos unas líneas en el área habilitada  a continuación.

Esperamos que este tutorial haya sido de utilidad para Uds.

Muchas gracias por leer y será hasta una próxima oportunidad.

Comparte este tutorial

El culpable de todo esto

Las tardes gloriosas de domingo y las grandes ovaciones a estadio lleno, no son algo extraño para Xabadu. Luego de ser descubierto a los 4 años en un partido de barrio por los ojeadores del gran Aviación F.C., sacudió el mercado nacional al ser traspasado en $500 pesos chilenos (1 USD) y 3 coca colas al renombrado Estrella Blanca de Lolol. Luego de una impresionante carrera por equipos como Lozapenco, Santa Cruz, Deportivo Lago Chungará y una incursión en la 3a división del futbol de Kazajstan, su record imbatible hasta la fecha de 1257 goles en 20 partidos lo llevo a ser elegido como uno de los arqueros más recordados en la historia pelotera nacional. Una lesión en el colmillo superior derecho lo llevó al retiro el año 2003, pero está de vuelta y sin duda que su jerarquía y experiencia internacional será un gran aporte.

En los barrios marginales se le conoce como: Xabadu

Comentarios en Facebook

14 Comentarios

1 2

Responder a Tweets that mention Cómo implementar una versión móvil de tu blog en Wordpress- Como Lo Hago -- Topsy.com Cancelar respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Gente linda que nos quiere

Donde mas estamos