Cómo añadir compatibilidad con formatos de entrada a tu tema

Descripción

¿Qué son los Formatos de las entradas, cómo puedes usarlos y cómo desarrollarlos? Esta guía paso a paso te permitirá comprender qué son los Formatos de las entradas y cómo crear los tuyos propios.

Habilidades necesarias

• Conocimientos básicos de HTML/CSS/PHP
• Conocimientos básicos sobre la instalación y activación de temas de WordPress
• Comprensión de cómo están estructuradas las carpetas y los archivos
• Capacidad para editar archivos con un editor de texto

Objetivos

• Los estudiantes crearán cada formato de entrada utilizando un tema predeterminado de WordPress
• Los estudiantes habilitarán la compatibilidad con Formatos de las entradas en un tema que aún no los tenga habilitados
• Los estudiantes darán estilo a cada tipo de Formato de las entradas

Recursos

• WordPress instalado localmente
• Tema Twenty Thirteen instalado (todos los formatos de entrada completados y con estilo)
• Tema Twenty Twelve instalado (para demostrar cómo habilitar y dar estilo a los Formatos de las entradas cuando el tema seleccionado aún no los admite)
• Tema hijo para habilitar los formatos de las entradas
• Contenido de relleno de los datos de prueba de la unidad de temas

Preguntas de evaluación

• ¿Estás familiarizado con la instalación y activación de temas mediante el escritorio de WordPress?
• ¿Tienes al menos conocimientos básicos de HTML/CSS/PHP?
• ¿Te sientes cómodo utilizando un editor de texto para editar código?
• ¿Dispondrás de un sitio de WordPress de prueba alojado local o remotamente para utilizar durante la clase?

Notas para el docente

• Realizar una demostración en vivo mientras se enseñan los pasos para crear un tema hijo es crucial para que los estudiantes comprendan el material.
• Lo más fácil es que los estudiantes trabajen con una copia de WordPress instalada localmente. Reserva algo de tiempo antes de la clase para ayudar a los estudiantes a instalar WordPress localmente si lo necesitan. Para obtener más información sobre cómo instalar WordPress localmente, visita Instalación en un servidor local.
• Las respuestas preferidas a las preguntas de evaluación son “sí”. Los participantes que respondan “no” a las 4 preguntas quizá no estén preparados para esta lección.

Guía práctica

Introducción: ¿Qué son los Formatos de las entradas?

Los Formatos de las entradas existen en WordPress desde la versión 3.1. Sin embargo, pocos temas los admiten de forma nativa y aún menos usuarios los implementan. Un Formato de entrada es un fragmento de metainformación que un tema puede utilizar para personalizar la presentación de una entrada. La función Formatos de las entradas proporciona una lista estandarizada de formatos disponibles para todos los temas que admiten la función. Los temas no están obligados a admitir todos los formatos de la lista. Los temas, e incluso los plugins, no pueden introducir formatos nuevos. La estandarización de esta lista proporciona compatibilidad entre numerosos temas y una vía para que las herramientas externas de blogs accedan a esta función de manera coherente. En resumen, con un tema compatible con los Formatos de las entradas, un bloguero puede cambiar el aspecto de cada entrada seleccionando un Formato de entrada en una lista de botones de opción. Los tipos de Formatos de las entradas incluyen:

Minientrada – Normalmente se muestra sin título. Es similar a una actualización de nota de Facebook.

Galería – Una galería de imágenes. La entrada probablemente contendrá un shortcode de galería y tendrá archivos adjuntos de imágenes.

Enlace – Un enlace a otro sitio. Los temas pueden utilizar la primera etiqueta del contenido de la entrada como enlace externo de esa entrada. Otra posibilidad sería que, si la entrada consta únicamente de una URL, esta sea la URL y el título (post_title) sea el nombre asociado al ancla correspondiente.

Imagen – Una sola imagen, con o sin leyenda. La primera etiqueta de la entrada podría considerarse la imagen. Como alternativa, si la entrada consta únicamente de una URL, esta será la URL de la imagen y el título de la entrada (post_title) será el atributo de título de la imagen.

Cita – Una cita. Probablemente contendrá un blockquote con el contenido de la cita. Como alternativa, la cita puede ser simplemente el contenido y la fuente o el autor puede ser el título.

Vídeo – Un solo vídeo o una lista de reproducción de vídeos.

¿Por qué utilizar Formatos de las entradas?

Al utilizar Formatos de las entradas, los visitantes de tu blog sabrán exactamente qué tipo de contenido están viendo.  Los diferentes estilos para cada Formato de entrada harán que tu blog sea visualmente más interesante. Anteriormente, los desarrolladores intentaban conseguir estos estilos únicos para el contenido modificando categorías o utilizando tipos de contenido personalizados.  Estos tipos personalizados estaban destinados a ser algo distinto del contenido del blog. El uso de Formatos de las entradas mantendrá todo tu contenido dentro de la sección del blog de tu sitio y, una vez configurado, solo tendrás que seleccionar qué formato estás utilizando. Los Formatos de las entradas aparecerán en tu feed RSS y se podrán editar desde la sección Entradas de tu sitio.

Cómo funcionan los Formatos de las entradas

Cuando edites una entrada individual, verás un módulo de Formato:

Una vez que hayas asignado entradas a un Formato de entrada concreto, verás iconos en el escritorio que indican qué formato tiene cada entrada.  Ve a Entradas > Todas las entradas:

Al ver tu blog, el contenido tendrá un aspecto único para cada formato.

Añadir compatibilidad con el tema

Los temas deben utilizar add_theme_support() en el archivo functions.php para indicar a WordPress qué formatos de entrada admiten, pasando una matriz de formatos como la siguiente:

add_theme_support( 'post-formats', array( 'aside', 'quote', 'status', 'image', 'gallery', 'chat', 'link', 'audio', 'video' ) );

Añadir compatibilidad con tipos de contenido

Si quieres utilizar estilos de Formatos de las entradas en páginas o tipos de contenido personalizados, es posible. Los tipos de contenido deben utilizar add_post_type_support() en el archivo functions.php para indicar a WordPress qué formatos de entrada admiten:

// add post-formats to post_type 'page'
add_post_type_support( 'page', 'post-formats' );

// add post-formats to post_type 'my_custom_post_type'
add_post_type_support( 'my_custom_post_type', 'post-formats' );

Utilizar Formatos de las entradas

En el tema, utiliza get_post_format() para comprobar el formato de una entrada y cambiar su presentación en consecuencia. Ten en cuenta que las entradas con el formato predeterminado devolverán un valor FALSE. También puedes utilizar la etiqueta condicional has_post_format():

if ( has_post_format( 'video' )) {
  echo 'this is the video format';
}

Una forma alternativa de utilizar los formatos es mediante reglas de estilo. Los temas deben utilizar la función post_class() en el código contenedor que rodea la entrada para añadir clases de estilo dinámicas. Los formatos de entrada harán que se añadan clases adicionales de esta manera, utilizando el nombre “format-foo”. Por ejemplo, se podrían ocultar los títulos de las entradas con formato de estado incluyendo esto en la hoja de estilos del tema:

.format-status .post-title {
display:none;
}

Dar estilo a los Formatos de las entradas

Aunque puedes aplicar estilo y diseñar tus formatos para que se muestren de la manera que consideres adecuada, cada formato se presta a cierto tipo de “estilo”, según el uso moderno. Conviene tener presente el uso previsto de cada formato, ya que esto ayudará a que los lectores los reconozcan visualmente con facilidad como un tipo específico de contenido. Por ejemplo, los formatos minientrada, enlace y estado normalmente se muestran sin información del título ni del autor. Son simples, breves y secundarios. La minientrada podría contener uno o dos párrafos, mientras que el enlace probablemente sería solo una frase con un enlace a alguna URL. Tanto el enlace como la minientrada podrían tener un enlace a la página de la entrada individual (utilizando the_permalink()), lo que permitiría los comentarios, pero es muy probable que el formato de estado no tuviera un enlace de ese tipo. Por otro lado, una entrada de imagen normalmente contendría solo una imagen, con o sin una leyenda o texto que la acompañe. Una entrada de audio o vídeo sería igual, pero con audio o vídeo añadido. Cualquiera de estos tres formatos podría utilizar plugins o incrustaciones estándar para mostrar su contenido. Es posible que tampoco se muestren los títulos ni la autoría, ya que el contenido podría explicarse por sí mismo. El formato de cita es especialmente adecuado para publicar una cita sencilla de una persona sin información adicional. Si incluyeras la cita únicamente en el contenido de la entrada y pusieras el nombre de la persona citada en el título de la entrada, podrías diseñar la entrada para mostrar the_content() por sí solo, pero rediseñado con formato de blockquote, y utilizar the_title() para mostrar el nombre de la persona citada como firma. Un chat, en particular, probablemente tienda a mostrarse con un tipo de letra monoespaciado. Con algo de estilo en .format-chat, puedes hacer que muestre el contenido de la entrada utilizando una fuente monoespaciada, quizá dentro de un div con fondo gris o algo similar, diferenciándolo visualmente como una sesión de chat. Consulta Formatos de las entradas: Chat para obtener más información sobre los estilos.

Formatos en un tema hijo

Los temas hijo heredan los formatos de entrada definidos por el tema padre. La llamada a add_theme_support() para los formatos de entrada en un tema hijo debe realizarse con una prioridad posterior a la del tema padre y sobrescribirá la lista existente, en lugar de añadir elementos a ella.

add_action( 'after_setup_theme', 'childtheme_formats', 11 );
function childtheme_formats(){
     add_theme_support( 'post-formats', array('aside', 'quote', 'status', 'image', 'gallery', 'chat', 'link', 'audio', 'video') ); }

La llamada a remove_theme_support('post-formats') lo eliminará por completo.

Ejercicios en grupo

1. Utilizando el tema Twenty Thirteen, crea una entrada con cada opción de formato de entrada.
2. Utilizando Underscores:
   1. Crea cada Formato de entrada

1. content-aside.php
2. content-audio.php
3. content-chat.php
4. content-gallery.php
5. content-image.php
6. content-link.php
7. content-quote.php
8. content-status.php
9. content-video.php
10. content-none.php

Da estilo a los Formatos de las entradas (toma como modelo la línea 1380 de Style.css de Twenty Thirteen)

Cuestionario

1. ¿Qué son los Formatos de las entradas? Los Formatos de las entradas son utilizados por un tema para personalizar la presentación de una entrada. La función Formatos de las entradas proporciona una lista estandarizada de formatos disponible para todos los temas que admiten la función.
2. ¿Cuáles son varias opciones de Formatos de las entradas? Minientrada, audio, chat, galería, imagen, enlace, cita, estado y vídeo
3. ¿Son los Formatos de las entradas lo mismo que los tipos de contenido personalizados? ¿Cuándo elegirías un tipo de contenido personalizado en lugar de un Formato de entrada? No, los tipos de contenido personalizados aparecen como otra opción en el escritorio de administración, junto a las entradas y las páginas.  Los tipos de contenido personalizados son útiles cuando no quieres que el contenido aparezca en /blog, como en un calendario de eventos o listados inmobiliarios.
4. ¿Dónde habilitas los Formatos de las entradas para tu tema? En Functions.php, específicamente en el archivo functions.php de un tema hijo
5. ¿Qué debes hacer al escribir una entrada que debe utilizar un Formato de entrada? Seleccionar qué formato de entrada utilizar
6. ¿Dónde personalizas el aspecto de los Formatos de las entradas? En Style.css o, específicamente, en el archivo style.css del tema hijo
7. ¿Todos los temas admiten Formatos de las entradas? No
8. ¿Qué temas predeterminados de WordPress admiten Formatos de las entradas? Twenty Thirteen y Twenty Fifteen
9. ¿Puedes añadir compatibilidad con Formatos de las entradas a tu tema o tema hijo? Sí