El uso de imágenes destacadas en archivos de entrada es una característica habitual de los temas, pero a veces es posible que desees utilizar imágenes destacadas de forma un poco diferente. Ocasionalmente he trabajado en sitios donde las imágenes que se mostrarán están relacionadas con la categoría en la que se encuentra una entrada y no con la entrada en sí. En lugar de añadir la misma imagen destacada a cada entrada en cada categoría, sería mucho más sencillo si pudiera asignar la categoría a cada una de mis imágenes, y luego mostrar la imagen destacada de la categoría en la entrada.
Estos serían algunos ejemplos de situaciones en las que posiblemente desees hacer esto:
- Cuando cada entrada está asociada a una marca y deseas mostrar el logotipo correspondiente
- Cuando cada entrada está asociada a uno de un número de ubicaciones y deseas mostrar una imagen (o mapa) de ese lugar
- Cuando cada entrada está relacionada con un tema determinado (por ejemplo, en un sitio de aprendizaje) y deseas mostrar un icono que represente esa temática
- Cuando las entradas forman parte de una serie (como sucede a veces en este sitio) y deseas utilizar una imagen que identifique cada serie
En este tutorial voy a utilizar algunas de las técnicas que ya he demostrado en dos tutoriales anteriores:
- Aplicar categorías a archivos adjuntos: tendremos que hacer esto para que cada categoría tenga sus propios archivos adjuntos.
- Crear una ‘imagen destacada’ para una categoría: en este tutorial mostré cómo crear ‘imágenes destacadas’ para categorías y cómo mostrarlas posteriormente en el archivo de categorías. Este tutorial es ligeramente diferente, ya que mostraré las imágenes de categoría en la página principal del blog.
Este tutorial trabajará a través de estos pasos:
- Registrar la taxonomía de categoría para los adjuntos
- Configurar categorías y añadirles imágenes
- En el bucle, identificar en qué categoría se encuentra una entrada y, a continuación, ejecutar una consulta para generar los datos adjuntos de esa categoría
Nota: Para cada entrada solo se identificará una categoría, y para cada categoría solo será mostrada una imagen (la más reciente).
También veré cómo puedes adaptar esta técnica a otras páginas de archivo, como a los archivos de tipo de entradas personalizadas.
Lo que necesitarás
Para seguir este tutorial necesitarás lo siguiente:
- Una instalación de desarrollo de WordPress
- Un tema que puedas editar (crearé un tema hijo para Twenty Fourteen)
- Acceso FTP (o MAMP o similar si está trabajando localmente)
- Un editor de código
Configuración de los archivos de tu tema
Para seguir este tutorial, deberás crear o editar un tema. Voy a crear un tema hijo del tema Twenty Fourteen.
Aquí está mi hoja de estilo:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
/* Theme Name: Automatic Featured Image Based On Category Theme URI: https://code.tutsplus.com/tutorials/add-an-automatic-featured-image-to-blog-posts-based-on-category--cms-22664 Version: 1.0.0 Description: heme to accompany tutorial on adding category featured images to an archive page for tutsplus, at http://bit.ly/14cm0ya Author: Rachel McCollin Author URI: http://rachelmccollin.co.uk License: GPL-3.0+ License URI: http://www.gnu.org/licenses/gpl-3.0.html Domain Path: /lang Text Domain: tutsplus Template: twentyfourteen */ @import url('../twentyfourteen/style.css'); |
Esto configura el tema como un tema hijo de Twenty Fourteen. Si necesitas saber más acerca de la creación de temas hijos, echa un vistazo a la correspondiente página del Codex.
A medida que trabajes a través de este tutorial también crearás un archivo functions.php para tu tema (o editarás el existente si ya tienes uno en él), y también crearás un archivo index.php.
Registro de categorías para archivos adjuntos
Por defecto WordPress no te permite asignar categorías a archivos adjuntos, pero esto puede cambiarse fácilmente.
Si tu tema aún no tiene un archivo de funciones, crea un archivo llamado functions.php y añade lo siguiente en él:
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<?php /** * Add featured image to category. */ function tutsplus_add_attachments_to_categories() { register_taxonomy_for_object_type( 'category', 'attachment' ); } add_action( 'init' , 'tutsplus_add_attachments_to_categories' ); |
Guarda tu archivo y dirígete a la pantalla Medios de tu sitio. Verás se ha añadido un nuevo elemento categorías al submenú de medios:
Nota: Para obtener más información sobre esto, consulta este tutorial.
Añadir imágenes de categoría
Ahora necesito subir una serie de imágenes y asignar a cada una de ellas una categoría. Las imágenes que subas dependerán de las necesidades de tu sitio: para mis categorías yo he usado distintos colores, así que he encontrado algunas imágenes con cada uno de estos. He asignado las categorías relevantes, así que así es como se ve mi Biblioteca de medios:
Ahora añadiré algunas entradas y les asignaré categorías:
Lo que te queda por leer:
Crear el archivo index.php
- Configurar el archivo
- Identificar la categoría de la entrada actual
- Crear argumentos para la consulta
Deja una respuesta