Tutorial Jetpack: temas para móviles

votaraddthis

Ya estamos llegando al final del mega tutorial sobre Jetpack. Los más de 30 módulos que posee el plugin están dando mucho jugo. Este instrumento de los creadores de WordPress pretende que sólo empleemos herramientas suyas.  Hemos visto que podemos crear formularios, difundir automáticamente nuestros posts al publicarlos, corrección de ortografía hasta insertar fórmulas matemáticas. Hoy vamos a ver cómo mejorar nuestra web para dispositivos móviles si nuestra plantilla no es responsive. Así facilitaremos la navegabilidad por nuestra web. Si no sabemos cómo cambiar los estilos y estrucutra de la web, nos viene muy bien para ahorrarnos tiempo y dinero.

tutorialJetpackmoviles

Configuración de theme mobile

Para activar este módulo sólo tenemos que ir a configuración dentro de Jetpack. Si nuestra plantilla ya viene preparada para ser responsive, es perder el tiempo. Esta aplicación sólo es efctivo si no tenemos versión para móvil. El diseño está basado en unos de los temas por defecto de WordPress, Twenty Eleven. Tiene las mismas opciones que su hermano mayor permitiendo una imagen de cabecera, una imagen de fondo y el color. Es una manera sencilla y elmental de tener una web para móviles con tu WordPress.

Las opciones que tiene son las siguientes:

Mostrar el extracto o el contenido completeo en la página de inicio y en las páginas de archivo. Enseñar o no las imágenes destacadas en cada post. Presentar o no su publicidad para las aplicaciones móviles de WordPress en el pie de página del tema para móviles. Además, disponen de aplicaciones para iOS (iPhone, iPad, iPod Touch), Android, BlackBerry y más dispositivos.

Aspectos a tener en cuenta con theme mobile

No es lo mismo que el 5% de nuestros visitantes procedan de dispositivos móviles que sea un 50% Existe un salto cuantitativo. Por tanto, conviene saber si necesitamos invertir tiempo y recursos para mejorar nuestra web para ser epsonsive.

El tema móvil de Jetpack esta preparado para funcionar en pantallas pequeñas. El módulo utiliza la imagen cabazera, el fondo y los widgets de nuestro tema para una apariencia personalizada. Soporta el formato de las entradas, las imágenes y galerías.

Los visitantes que utilizan iPhone, Android, Windows Phone y otros dispositivos móviles verán automáticamente el tema móvil, con la opción de ver el sitio completo.

Personalizar menú

El módulo busca entre los menús activados de nuestro sitio y el menú asignado a la posición primaria. Si no tenemos menús personalizados asignados, será por defecto el menú de la página estándar. Si deseamos utilizar un menú específico, y no el asignado a la posición primaria, se puede utilizar el `jetpack_mobile_theme_menu` para forzar r un menú que especifíco. Para ello, tenemos que ir al menú que deseamos poner en la versión móvil y editarlo. En la url nos saldrá algo similar a lo siguiente:

www.nuestroditio.com/wp-admin/nav-menus.php?action=edit&menu=6

Siendo 6 la ID del menú. Una vez obtenido vamos al archivo functions.php de nuestro tema  y hacemos una copia de seguridad. Después añadimos el siguiente código:

function jetpackme_mobile_theme_menu() {
return 6;
}
add_filter( ‘jetpack_mobile_theme_menu’, ‘jetpackme_mobile_theme_menu’);

Siendo 6 la ID nuestro menú.

Personalizar cabecera y fondo

Permite los siguinetes ajustes en esta sección:

Imagen de cabecera personalizada.
Imagen de fondo personalizada o color.
Imagen de fondo mediante repetición y de posición.
Mostrar o no el título del sitio y la descripción en la cabecera.
Color del texto del título del sitio.

En la versión móvil utiliza un diseño de una sola columna como suele ser la tónica habitual para una mejor experiencia de usuario. Es un sistema sencillo y eficaz para visualizar nuestra página. Tras el contenido principal, el sidebar se visualiza debajo como otra columna debajo. Para evitar problemas, el plugin recomienda que la id de la barra lateral sea “sidebar-1”. En este enlace al codex de WordPress existe más información. Si tenemos varias barras laterales, sólo podemos seleccionar una para su visualización en móvil.

Si desaparece el sidebar en la versión móvil, podemos intentar añadir el siguiente registro de nuestro archivo functions.php dentro de la plantilla previa copia de seguridad para solucionarlos.

register_sidebar( array(
‘id’ => ‘sidebar-1’,
‘name’ => __( ‘Right Sidebar’, ‘theme-text-domain’ ),
‘description’ => __( ‘This sidebar is located in the right column’, ‘theme-text-domain’ ),
) );

Versión de escritorio

Los visitantes tienen la opción de cambiar a la versión de escritorio de la web pulsando en el enlace correspondiente en la parte inferior de cada página.

Más trucos

Si queremos  excluir alguna categoría de la versión móvil, Jetpack ofrece más información y, también, para eliminarlos botones de compartir en la redes sociales.

Últimas palabras

Jetpack es un plugin que aglutina más de 30 módulos consigo. Ahora hemos aprendido cómo adaptar nuestra web para la versión móvil. Útil si nuestro trema no es responsive o no sabemos programar.

Ahora bien, ¿Jetpack es para todos los blogs? La respuesta es no. No todos tenemos las misma necesidades ni cubrimos las necesidades de los más de 30 miniplugin que tiene. Activar todos, es un gasto en el servidor considerable. Otro hecho a tener en cuenta es la necesidad de poseer una cuenta en WordPress.com, a lo mejor no todos quieren.

 

Deseo que tras la duodécima entrega en esta saga interminable, sepamos un poquito más sobre este megaplugin y tengamos las ideas más claras sobre su potencia. No es sencillo asumir tanta información, puede llegar a ser un supertocho. Sobretodo si ha sido interesante para ti y te ha gustado el tutorial.

Ahora toca escribir vuestros comentarios y experiencias sobre Jetpack. ¡Os espero!