Funciones indispensables de Jetpack para desarrolladores de temas

Jetpack ofrece numerosas funciones para desarrolladores de temas que te ayudan a reducir tanto el tiempo de desarrollo como los tiempos de carga. La mayoría están listas para usar, pero también puedes profundizar en ellas y aplicar ajustes y personalizaciones que lleven tu tema al siguiente nivel.

En este artículo descubrirás:

  1. Acelerar tu tema con Photon
  2. Destacar entradas con Contenido destacado
  3. Cargar entradas automáticamente con Infinite Scroll
  4. Aplicar al instante un tema para móviles
  5. Personalizar CSS
  6. Añadir la función Compartir al tema
  7. Integrar enlaces sociales
  8. Mostrar contenido similar con Entradas relacionadas
  9. Recursos adicionales

 

1. Acelerar tu tema con Photon

Jetpack para desarrolladoresPhoton es una CDN gratuita para imágenes que ofrece Jetpack. En cuanto activas Photon, sirve automáticamente las imágenes de las entradas y páginas desde los veloces servidores de WordPress.com repartidos por todo el mundo.

Pero ¿sabías que también puedes usarlo para ahorrar ancho de banda y acelerar la carga de las imágenes de tu tema? Para enlazar a una versión optimizada con Photon, puedes llamar a jetpack_photon_url(). Es muy sencillo; además, hemos preparado unas instrucciones paso a paso para que resulte aún más fácil.

 

2. Destacar entradas con Contenido destacado

Ajustes de Contenido destacadoContenido destacado es una de las funciones menos conocidas de Jetpack. Sin embargo, resulta muy potente para desarrollar temas, ya que puedes usarla para crear un área completamente personalizada donde los usuarios puedan destacar entradas. Como autor del tema, tú decides por completo su apariencia y ubicación.

A continuación, tus usuarios pueden especificar qué entradas mostrar en esa área simplemente seleccionando la etiqueta que prefieran. Incluso hay una opción para ocultar la etiqueta de los metadatos de las entradas y de las nubes de etiquetas.

Tanto si estás creando un carrusel de imágenes en tu página de inicio como si quieres permitir que los usuarios destaquen entradas concretas, usar Contenido destacado es más sencillo que desarrollar una función personalizada. Puedes ver aquí varios ejemplos de la función en acción.

 

3. Cargar entradas automáticamente con Infinite Scroll

Con Infinite Scroll activo, los usuarios ya no tienen que hacer clic en un enlace para acceder al siguiente grupo de entradas en las páginas de archivo. En su lugar, tu tema carga automáticamente más entradas cuando el lector se acerca al final de la página. Probablemente hayas visto una función similar en otros sitios y, gracias a Jetpack, añadirla a tu tema es muy sencillo.

 

4. Aplicar al instante un tema para móviles

Página de inicio móvil de JetpackEl uso de Internet móvil crece exponencialmente y cualquier tema que se precie debería funcionar en dispositivos móviles. Por eso te alegrará saber que Jetpack incluye un tema para móviles completo y listo para usar.

Solo tienes que usar .mobile-theme en tu CSS para aplicar estilos al tema para móviles o ir un paso más allá y usar jetpack_is_mobile para dirigirte a los visitantes desde dispositivos móviles.

De este modo puedes crear la mejor experiencia de usuario para tu tema, independientemente del dispositivo que utilicen los visitantes.

Consulta este artículo sobre cómo personalizar el tema móvil de Jetpack para obtener más información.

 

5. Personalizar CSS

Si alguna vez has publicado un tema, lo más probable es que sepas que los usuarios suelen querer personalizar su apariencia. Los usuarios expertos podrían crear un tema hijo, pero lo más habitual es que simplemente editen directamente los archivos de tu tema.

lista de revisionesEsto puede volverse problemático cuando publicas una actualización del tema que sobrescribe las modificaciones de los usuarios. Pero, gracias a Jetpack, existe una alternativa mucho más cómoda mediante CSS personalizado, una función que también incluye un historial de revisiones.

Después de activar la función, se añade un enlace «CSS personalizado» al menú Apariencia del escritorio. Desde allí, los usuarios pueden añadir su propio CSS personalizado sin tocar los archivos del tema. Incluso pueden usar su preprocesador CSS favorito, ya que la compatibilidad con SASS y LESS está integrada de forma nativa.

 

6. Añadir la función Compartir al tema

Con la función Compartir puedes añadir al tema botones para compartir en redes sociales. Incluye varias opciones de visualización y también puedes usar tus propios estilos personalizados.

De este modo puedes integrar botones para compartir en redes sociales en tu tema y mantener un control total sobre su apariencia. Incluso puedes modificar la función con un poco de magia de jQuery. Nuestros amigos de ThemeShaper tienen un excelente artículo con más información al respecto.

 

7. Integrar enlaces sociales

Jetpack también facilita incluir enlaces sociales en tu tema. Cuando un usuario conecta sus cuentas de redes sociales mediante Publicize, puedes incorporar automáticamente enlaces a ellas en el tema. Puedes añadir compatibilidad con add_theme_support() y usar después la API de modificaciones del tema para obtener los datos.

 

8. Mostrar contenido similar con Entradas relacionadas

Entradas relacionadas en un modo visualmente impactanteEntradas relacionadas es una de las funciones más recientes de Jetpack. Al activarla, añade una sección a las entradas individuales que incluye enlaces generados automáticamente a contenido similar.

De forma predeterminada, la sección aparece al final del contenido, pero también puedes moverla a la parte superior con un filtro. Además, los usuarios pueden añadir un shortcode donde quieran que aparezca la sección.

Esto significa que puedes incluir estilos para la sección Entradas relacionadas en tu tema y permitir que los usuarios inserten, donde quieran, una sección personalizada que encaje con el resto del sitio.

 

9. Recursos adicionales

Por último, nos encantaría ver lo que has hecho por tu cuenta y lo que piensas de Jetpack. Si tienes preguntas, comentarios o tus propios consejos, ¡déjanos un comentario! Además, siempre estamos abiertos a sugerencias, así que no dudes en ponerte en contacto. ¡Gracias por volar con Jetpack!

Explora las ventajas de Jetpack

Descubre cómo Jetpack puede ayudarte a proteger, acelerar y hacer crecer tu sitio de WordPress.

Explorar planes

¿Tienes alguna pregunta?

La sección de comentarios está cerrada para este artículo, pero seguimos aquí para ayudarte. ¡Visita el foro de soporte y estaremos encantados de responder a tus preguntas!

Ver foro de soporte