Tutoriales de WordPress de Confianza, cuando más los necesitas.
Guía para Principiantes de WordPress
Copa WPB
25 Millones+
Sitios web que usan nuestros plugins
16+
Años de experiencia en WordPress
3000+
Tutoriales de WordPress de expertos

Cómo agregar encabezado, pie de página o barra lateral personalizados para cada categoría

¿Alguna vez has querido que partes de tu sitio de WordPress se vean diferentes para cada categoría? Es una excelente manera de hacer que tu sitio web sea más fácil de usar y mostrar contenido que se ajuste mejor a cada tema.

¡Nosotros también hacemos esto en WPBeginner! Puede que no lo notes de inmediato, pero nuestras barras laterales cambian dependiendo de la página en la que te encuentres.

Al cambiar tus encabezados, pies de página o barras laterales para diferentes categorías, puedes hacer que tu sitio sea más interesante para los visitantes. Podrías mostrar anuncios que se ajusten al tema, resaltar recursos útiles o simplemente hacer que las cosas se vean diferentes para que coincidan con el contenido.

En esta guía, te mostraremos tres formas de agregar encabezados, pies de página o barras laterales personalizados para cada categoría en WordPress.

Cómo agregar encabezado, pie de página o barra lateral personalizados para cada categoría

¿Por qué agregar un encabezado, pie de página o barra lateral personalizada para cada categoría?

Personalizar el diseño de tu sitio de WordPress para diferentes categorías puede mejorar realmente la experiencia de tus visitantes. Al adaptar encabezados, pies de página o barras laterales a temas específicos, puedes proporcionar información más relevante a tus lectores.

Las barras laterales personalizadas también pueden facilitar la navegación al ofrecer enlaces y recursos específicos de la categoría. Aparte de eso, es posible que desees mostrar anuncios dirigidos, fuentes de redes sociales relevantes o publicaciones relacionadas sobre ese tema.

Estas personalizaciones pueden aumentar la participación y mantener a los visitantes en tu sitio por más tiempo.

En WPBeginner, nuestras barras laterales se ven diferentes dependiendo de la página o publicación en la que te encuentres. La barra lateral en nuestra página de inicio es mucho más simple, con solo nuestros enlaces sociales y guías gratuitas.

Barra lateral de la página de inicio de WPBeginner

Pero si visitas nuestras publicaciones de blog, también verás un plugin destacado, una barra de búsqueda, nuestras últimas publicaciones, ofertas y cupones, y más.

El plugin destacado que ves también diferirá según la publicación en la que te encuentres.

Barra lateral de las publicaciones del blog de WPBeginner

Dicho esto, veamos cómo agregar fácilmente una cabecera, pie de página o barra lateral personalizada para cada categoría en tu blog de WordPress.

Cubriremos tres métodos, y puedes usar los enlaces rápidos a continuación para navegar a uno específico si te interesa más que los otros:

Método 1: Crear un tema personalizado con una cabecera, pie de página o barra lateral personalizada (Recomendado)

Nuestro método más recomendado para agregar una cabecera, pie de página o barra lateral personalizada para cada categoría es crear un tema personalizado con un constructor de temas de WordPress. Este enfoque ofrece la mayor flexibilidad y control sobre el diseño de tu sitio.

Además, muchos temas, especialmente los clásicos, no ofrecen la función de agregar elementos personalizados por defecto. Esta limitación a menudo obliga a los usuarios a editar los archivos del tema directamente, lo que puede ser arriesgado y complejo para los principiantes. Te mostraremos cómo hacerlo en el método 3.

Dicho esto, este método no se recomienda si estás contento con tu tema actual y no quieres cambiarlo. Esto se debe a que seguir este método requerirá que cambies tu tema.

Para este propósito, recomendamos usar SeedProd. Es uno de los mejores constructores de páginas de destino y temas que hemos probado.

Lo usamos con frecuencia para nuestras propias páginas personalizadas y sitios web de socios. Además, SeedProd viene con más de 350 plantillas, lo que facilita la creación rápida de diseños de aspecto profesional.

Puedes aprender más sobre el plugin en nuestra reseña de SeedProd.

Para usar la función de creador de temas de SeedProd, necesitarás la versión premium. Sin embargo, siéntete libre de comenzar con la versión gratuita para familiarizarte con el plugin.

Paso 1: Instalar y configurar SeedProd

Para empezar, instala el plugin SeedProd en tu sitio de WordPress. Si necesitas ayuda, consulta nuestra guía sobre cómo instalar un plugin de WordPress.

Después de la instalación, ingresa tu clave de licencia de SeedProd y haz clic en ‘Verificar clave’ para activar el plugin.

Ingresar la clave de licencia de SeedProd

A continuación, navega a SeedProd » Theme Builder en tu panel de WordPress.

Haz clic en el botón ‘Kits de plantillas de tema’ para explorar los diseños disponibles.

Accediendo a los Kits de Plantillas de Temas de SeedProd

Aquí verás una variedad de kits de plantillas de tema.

Siéntete libre de previsualizar cualquier kit al pasar el cursor sobre él y hacer clic en el icono de la lupa.

Previsualizar un kit de inicio de sitio web usando SeedProd

Si planeas crear una barra lateral personalizada diferente para cada categoría, te recomendamos elegir un kit de tema con una plantilla de página de barra lateral.

Además, te recomendamos elegir un kit de tema que incluya páginas que se ajusten a las necesidades de tu sitio web. Por ejemplo, el Tema de Servicios de Lavandería Tidelove viene con una página de Servicios, lo que lo hace perfecto para negocios basados en servicios.

El kit de temas de SeedProd para servicios de lavandería

Una vez que hayas decidido un kit, simplemente pasa el cursor sobre él.

Luego, haz clic en el icono de la marca de verificación naranja cuando aparezca.

Instalación de un kit de temas de SeedProd

Ahora, espera unos momentos a que SeedProd configure tu tema.

Una vez que eso esté hecho, deberías ser redirigido a la página de configuración de ‘Theme Builder’ nuevamente, donde verás que SeedProd ha creado varias plantillas de tema para tu sitio web de WordPress.

La página de plantillas de temas en SeedProd

Paso 2: Duplica tu plantilla de Archivos de Categoría existente y tu plantilla de Encabezado/Pie de página/Barra lateral

Ahora puedes empezar a editar las plantillas de tu tema.

Primero, tendrás que duplicar tu plantilla de ‘Archivos, Resultados de Búsqueda’, que se utiliza para las páginas de categorías de publicaciones de blog. Necesitarás crear una copia de esta y luego configurar las condiciones para que la página solo se muestre cuando el visitante esté viendo una página de categoría de publicación de blog específica.

Para hacer esto, pasa el cursor sobre tu plantilla de ‘Archivos, Resultados de Búsqueda’ y haz clic en ‘Duplicar’.

Duplicar la plantilla de archivos en SeedProd

Ahora deberías ver una nueva plantilla de ‘Archivos, Resultados de Búsqueda - Copia’.

Haz clic en ‘Editar Condiciones’.

Editar las condiciones de la plantilla de archivos en SeedProd

Ahora aparecerá una ventana emergente. Primero, reemplaza el nombre para que sea más fácil identificarlo más tarde. Recomendamos incluir el nombre de la categoría de publicación de blog para la que se utilizará esta plantilla.

Esto puede ser algo como ‘Archivos de Categoría – [nombre de la categoría]’. Nuestra página de categoría se llama ‘Tema’, así que nombraremos la nuestra ‘Archivos de Categoría – Tema’.

Renombrar la plantilla de archivos personalizada en SeedProd

Para las ‘Condiciones’, asegúrate de eliminar las opciones actuales haciendo clic en el botón ‘X’ junto a ambas.

Luego, haz clic en ‘Agregar Condición’.

Eliminar las condiciones de plantilla existentes en SeedProd

Ahora, asegúrate de elegir ‘Incluir’ y ‘Archivos de Categoría de Publicación’ para la nueva condición.

Luego, ingresa el slug de la categoría, que puedes encontrar yendo a Publicaciones » Categorías.

Añadir la plantilla solo a las páginas de archivo de categorías de publicaciones en SeedProd

Puedes leer nuestra publicación de glosario sobre categorías de WordPress si necesitas alguna indicación.

Una vez hecho, simplemente haz clic en 'Guardar'.

Ahora, creemos una plantilla personalizada de encabezado, pie de página o barra lateral para tu nueva página de categoría de publicación de blog.

Para demostrar, crearemos un encabezado personalizado. Puedes hacer esto buscando tu parte de plantilla de ‘Encabezado’, pasando el cursor sobre ella y haciendo clic en ‘Duplicar’.

Duplicar la plantilla de encabezado en SeedProd

Ahora deberías ver ‘Encabezado - Copia’ en tu lista de plantillas.

En esta etapa, puedes pasar el cursor sobre ella y hacer clic en ‘Editar Condiciones’.

Editar las condiciones de la plantilla de encabezado en SeedProd

Ahora, asegúrate de renombrar esta plantilla de encabezado para que sea más fácil de identificar.

Nuevamente, recomendamos agregar el nombre de la categoría de tu publicación de blog aquí para que puedas diferenciarla fácilmente de otros encabezados para otras páginas de categoría.

Renombrar la parte de la plantilla de encabezado en SeedProd

Además, asegúrate de que el 'Tipo' sea 'Encabezado' y elimina todas las condiciones existentes haciendo clic en el botón 'X' junto a ellas.

Una vez que hayas terminado, haz clic en 'Guardar'.

Configurar las condiciones de la plantilla de encabezado en SeedProd

Paso 3: Personaliza tu encabezado/pie de página/barra lateral personalizados

Con los pasos anteriores completados, estás listo para comenzar a personalizar tu sección de encabezado, pie de página o barra lateral.

Dado que creamos un encabezado anteriormente, lo editaremos de inmediato. Todo lo que necesitas hacer es pasar el cursor sobre la plantilla de encabezado, pie de página o barra lateral y hacer clic en 'Editar diseño'.

Editar el diseño de la plantilla de encabezado en SeedProd

Ahora deberías estar en el editor de arrastrar y soltar de SeedProd.

Como puedes ver, hay una vista previa en vivo de tu plantilla y un menú en el lado izquierdo. Puedes agregar bloques o secciones prediseñadas y personalizarlas.

Interfaz de edición de SeedProd para la plantilla de encabezado

Puedes hacer muchas cosas geniales aquí.

Por ejemplo, puedes buscar el bloque 'Formulario de búsqueda' y agregarlo junto a tu menú de navegación en el encabezado.

Añadir un formulario de búsqueda al encabezado en SeedProd

También puedes agregar un divisor de forma personalizado a tu encabezado para añadir un elemento divertido y transicional desde la parte superior de tu sitio al resto del contenido.

Siéntete libre de leer nuestro tutorial sobre cómo agregar un divisor de forma personalizado en WordPress para aprender más sobre esto.

Añadir un divisor de forma personalizado a la plantilla de encabezado en SeedProd

Aquí tienes otros tutoriales que puedes consultar para obtener algunas ideas sobre qué hacer con tu encabezado, pie de página o barra lateral:

Una vez que estés satisfecho con el aspecto del encabezado, pie de página o barra lateral, simplemente haz clic en la flecha hacia abajo junto al botón ‘Guardar’. Luego, selecciona ‘Publicar’.

Publicar una parte de plantilla de SeedProd

Paso 4: Agrega tu encabezado/pie de página/barra lateral personalizado a la plantilla de archivos de categorías de tu blog

Para el siguiente paso, regresa a tu administrador de WordPress y navega a SeedProd » Theme Builder. Luego, pasa el cursor sobre la plantilla de categoría de blog que duplicaste anteriormente y haz clic en ‘Editar diseño’.

Editar la plantilla de archivo de categoría en SeedProd

Ahora deberías estar en el editor de arrastrar y soltar de SeedProd. Como puedes ver, esta plantilla todavía usa el mismo encabezado, pie de página o barra lateral que el resto de tu sitio web.

Para reemplazarlo, pasa el cursor sobre el encabezado, pie de página o barra lateral y haz clic en él. Sabrás que vas por buen camino si el panel lateral izquierdo cambia a ‘Editando: Partes de plantilla’.

Seleccionando la parte de plantilla del encabezado en la página de archivo en SeedProd

Ahora, en el menú desplegable ‘Parte de plantilla’, elige la plantilla de encabezado, pie de página o barra lateral que duplicaste y personalizaste anteriormente.

Así:

Cambiar la parte de la plantilla de encabezado en SeedProd

Si tu encabezado, pie de página o barra lateral no se ve bien, no te preocupes. Simplemente haz clic en ‘Editar esta parte de plantilla’ y se abrirá una nueva pestaña, donde podrás hacer cambios en el editor de SeedProd.

Dado que la fuente de nuestro encabezado es demasiado oscura, decidimos cambiar el color de la fuente y eliminar el divisor de forma para que los enlaces sean más legibles.

Editar la parte de la plantilla en SeedProd

Y eso es todo. Siéntete libre de seguir personalizando tu página de archivos de categorías a tu gusto.

Por ejemplo, puedes agregar una imagen grande en la parte superior, insertar cuadros de características con iconos para promocionar tus productos o servicios, agregar un fondo animado y más.

Una vez hecho, solo haz clic en la flecha hacia abajo junto al botón ‘Guardar’ nuevamente y selecciona ‘Publicar’.

Publicar la plantilla de archivo de categoría personalizada en SeedProd

Siéntete libre de repetir los pasos 2 a 4 para crear diferentes encabezados, pies de página o barras laterales para cada página de categoría de blog.

Luego, regresa a SeedProd » Theme Builder y activa el botón ‘Enable SeedProd Theme’ hasta que diga ‘YES’. Hacer esto desactivará tu tema anterior y activará el de SeedProd.

Activando el tema SeedProd

¡Y eso es todo!

Aquí se ve nuestro encabezado personalizado al final:

Ejemplo de un encabezado personalizado hecho con SeedProd

Nota: ¿No eres fan de SeedProd? También recomendamos usar Thrive Architect, otro constructor de páginas potente pero fácil de usar. Puedes aprender más sobre la herramienta en nuestra reseña de Thrive Architect.

Si estás usando un tema de bloques como Twenty Twenty-Four o Hestia, puedes crear barras laterales, encabezados o pies de página personalizados usando el editor de sitio completo. Este método funciona de la misma manera para todos los temas de bloques, lo que facilita la adición de elementos personalizados a páginas de categorías de publicaciones de blog específicas.

Paso 1: Crea una parte de plantilla de encabezado, pie de página o barra lateral personalizada

Para empezar, ve a Apariencia » Editor en tu panel de WordPress.

Seleccionar el Editor de Sitio Completo desde el panel de administración de WordPress

Verás varias opciones para personalizar tu tema de bloques.

Haz clic en 'Patrones' en el menú de la izquierda para comenzar.

Abrir el menú Patrones en el editor de sitio completo

Aquí es donde puedes ver todas las partes de plantilla reutilizables de tus páginas, como encabezados, pies de página, barras laterales, etc.

Para este tutorial, te daremos un ejemplo de cómo crear un pie de página personalizado con el editor de sitio completo. Pero ten en cuenta que este método funcionará para cualquier parte de plantilla, incluidos encabezados y barras laterales.

Primero, haz clic en 'Todas las partes de plantilla'. Luego, busca la parte 'Pie de página' y haz clic en el menú de tres puntos. Selecciona 'Duplicar' para copiar la parte de plantilla.

Duplicando la parte de plantilla del pie de página en FSE

Aparecerá una nueva ventana emergente. Aquí, renombra 'Pie de página (Copia)' a algo más que facilite la identificación de la parte de plantilla.

Recomendamos incluir el nombre de la categoría donde aparecerá este pie de página más adelante, así que algo como 'Pie de página – [nombre de la categoría]'.

Además, asegúrate de que 'Pie de página' esté seleccionado en la sección 'Área'. Luego, haz clic en 'Duplicar'.

Creando una nueva parte de plantilla del pie de página en FSE

Tu nuevo pie de página ahora debería estar en la lista de partes de plantilla.

Continúa y haz clic en él para empezar a editarlo.

Editando la parte de plantilla del pie de página en FSE

Ahora, en el editor de sitio completo, puedes empezar a personalizar tu encabezado, pie de página o barra lateral como quieras.

En nuestra opinión, la plantilla de pie de página regular ya tiene todo lo que necesitas en un pie de página típico. Pero para diferenciarlo de otras páginas de categorías, vamos a agregar un botón de llamada a la acción que invita a los visitantes a descargar una guía gratuita de blogs.

Agregaremos la llamada a la acción justo encima de la sección del pie de página regular para evitar desordenar los elementos del pie de página normal.

Para personalizar tu pie de página de manera similar, haz clic en el botón 'Vista de lista' en la esquina superior izquierda y selecciona el 'Grupo' que agrupa todos los elementos del pie de página. Luego, haz clic en el menú de tres puntos y selecciona 'Agregar antes'.

Agregando un bloque antes de la plantilla predeterminada del pie de página con FSE

Ahora, haz clic en el botón negro '+' para agregar un bloque o un patrón.

Hemos decidido navegar a la pestaña 'Patrones' aquí y seleccionar 'Llamada a la acción centrada' para acelerar el proceso.

Ahora, todo lo que tienes que hacer es reemplazar el encabezado, el texto y el botón que están en el patrón para adaptarlos a tus necesidades. Puedes editar todo como lo harías normalmente en el editor de Gutenberg.

Si necesitas ayuda, puedes leer nuestra guía para principiantes sobre la edición de sitios completos en WordPress.

Una vez que hayas terminado, simplemente haz clic en 'Guardar'.

Guardando la nueva plantilla de pie de página hecha con FSE

En esta etapa, puedes continuar y repetir este paso para crear múltiples encabezados, pies de página o barras laterales para cada una de tus páginas de categoría.

Paso 2: Crear plantillas personalizadas para todas las páginas de categoría

Ahora, crearemos una plantilla personalizada para cada página de categoría de blog. Esto es necesario porque, actualmente, todas tus categorías probablemente usan la misma plantilla de archivos. Al crear plantillas individuales, podemos agregar diferentes encabezados, pies de página o barras laterales a diferentes categorías.

Para comenzar, regresa al menú principal del editor de sitio completo y haz clic en 'Plantillas'.

Elegir el menú Plantillas en FSE

La plantilla predeterminada para las páginas de archivo de categorías generalmente se llama ‘Todos los archivos’. Esta plantilla se utiliza para varios tipos de archivos, incluidas categorías, etiquetas, taxonomías personalizadas y tipos de publicaciones personalizadas.

Para crear una nueva plantilla para una página de archivo de categorías, haz clic en ‘Agregar nueva plantilla’ en la esquina superior derecha.

Agregar una nueva plantilla en FSE

Aparecerá una ventana emergente.

Aquí, selecciona ‘Archivos de categorías’.

Elegir un tipo de archivo para crear una plantilla en FSE

A continuación, elige si deseas crear una plantilla personalizada para todas las categorías o una específica.

Dado que queremos crear encabezados, pies de página o barras laterales personalizados para cada página de categoría, seleccionaremos 'Categoría para un elemento específico'.

Elegir una categoría específica para crear una plantilla en FSE

Ahora, elige la categoría para la que deseas crear una plantilla.

En este ejemplo, seleccionaremos la categoría 'Blogging'.

Elegir un nombre de categoría para crear una plantilla en FSE

A continuación, se abrirá el editor de sitio completo y aparecerá una ventana emergente pidiéndote que elijas un patrón de bloques para la página de archivo de la categoría.

Puedes seleccionar un patrón o saltarte este paso para empezar desde cero. Si prefieres empezar de cero, nuestra guía sobre cómo dar estilo a categorías individuales en WordPress proporciona instrucciones detalladas.

Elegir un patrón de bloque para la plantilla de categoría en FSE

Continúa personalizando tu página de categoría hasta que estés satisfecho con su apariencia.

Paso 3: Agrega tu encabezado/pie de página/barra lateral personalizada a la plantilla de tu página de categoría

Una vez que hayas terminado de personalizar la apariencia de tu página de categoría, deberás agregar tu encabezado, pie de página o barra lateral personalizados.

Para hacer esto, puedes hacer clic en el botón 'Vista de lista' en la esquina superior izquierda.

Luego, selecciona la parte de la plantilla del encabezado, pie de página o barra lateral, haz clic en el menú de tres puntos y elige 'Reemplazar'.

Reemplazando la parte de plantilla del pie de página en FSE

Ahora deberías ver la parte de plantilla personalizada que acabas de crear.

Simplemente haz clic en ella para usarla.

Eligiendo una nueva parte de plantilla del pie de página en FSE

Una vez hecho todo esto, simplemente presiona el botón 'Guardar' en la parte superior.

Así se ve nuestro pie de página personalizado para la página de la categoría de blog:

Ejemplo de un pie de página personalizado hecho con FSE

Luego puedes repetir estos pasos para crear diferentes páginas para todas las categorías de tus publicaciones de blog.

Este método es el más avanzado y solo está destinado a personas que usan temas clásicos.

Es más difícil crear encabezados, pies de página o barras laterales personalizados para páginas de categorías en temas clásicos en comparación con los temas de bloques, ya que cada tema clásico funciona de manera diferente.

Así que, antes de proceder con este método, te recomendamos contactar al desarrollador de tu tema de WordPress. Es posible que tengan una forma más sencilla y sin código para crear elementos personalizados para tu tema específico.

También necesitarás crear un tema hijo de WordPress antes de hacer cualquier cambio. Un tema hijo te permite modificar la apariencia de tu sitio mientras conservas la capacidad de actualizar el tema padre de forma segura.

Si no tienes confianza en tus habilidades de codificación, considera mover tu sitio de WordPress en vivo a un entorno local primero o usar un sitio de staging. Esto te permite probar los cambios sin afectar tu sitio en vivo.

Los pasos básicos para este método son:

  1. Duplica el archivo header.php, footer.php o sidebar.php de tu tema para cada página de categoría.
  2. Renombra estos archivos a header-nombrecategoría.php, footer-nombrecategoría.php o sidebar-nombrecategoría.php para indicar a qué categoría pertenecen.
  3. Edita los archivos recién duplicados para diferenciarlos del encabezado, pie de página o barra lateral predeterminados.
  4. Modifica el código en la plantilla archives.php (generalmente utilizada para archivos de categoría) para llamar a tus nuevos archivos cuando sea apropiado. De lo contrario, usará los archivos estándar por defecto.

Recorramos un ejemplo de cómo crear una barra lateral personalizada para el tema Twenty Sixteen, específicamente para la categoría de blog ‘WordPress Core’.

Primero, abre los archivos de tu sitio web vía FTP o el administrador de archivos de tu proveedor de hosting. Para este tutorial, usaremos el administrador de archivos de Bluehost, pero los pasos deberían ser similares independientemente de tu host.

Si eres usuario de Bluehost, puedes ir a tu panel de control y navegar a la pestaña ‘Sitios web’. Luego, busca el sitio en el que estás trabajando y haz clic en ‘Configuración’.

Configuración del sitio de Bluehost

Ahora verás una serie de configuraciones para personalizar tu sitio web.

Encuentra la sección ‘Enlaces rápidos’ y selecciona ‘Administrador de archivos’.

Botón Administrador de archivos de Bluehost

Una vez que estés en el administrador de archivos, ve a la carpeta public_html de tu sitio. Luego, ve a wp-content » themes y localiza la carpeta de tu tema principal.

Después de eso, selecciona ambos archivos archive.php y sidebar.php. Tus archivos seleccionados deben estar claramente resaltados (los nuestros se muestran en azul a continuación). A continuación, haz clic derecho sobre ellos y elige ‘Copiar’.

Duplicando las plantillas archive.php y sidebar.php a un tema hijo usando el administrador de archivos de Bluehost

Luego, ingresa la ruta del archivo a la que deseas copiar estos archivos.

En este caso, es la carpeta de tu tema hijo, así que para nosotros, la ruta del archivo termina con ‘/wp-content/themes/twentysixteen-child’.

Copiando archivos a una carpeta de tema hijo en el administrador de archivos de Bluehost

Ahora, abre la carpeta de tu tema hijo.

Cuando estés allí, haz clic derecho en el archivo sidebar.php y haz clic en ‘Renombrar’.

Renombrando el archivo sidebar.php en el administrador de archivos de Bluehost

Ahora, renombra ‘sidebar.php‘ a ‘sidebar-categoryname.php‘.

Reemplaza ‘categoryname’ con el título de la categoría de tu publicación de blog. Luego, haz clic en ‘Renombrar archivo’.

Dando un nuevo nombre al archivo sidebar.php en el administrador de archivos de Bluehost

Una vez hecho esto, haz clic derecho en el archivo ‘sidebar-categoryname.php‘.

Luego, elige ‘Editar’.

Editando la nueva plantilla sidebar.php en el administrador de archivos de Bluehost

Ahora, puedes proceder a personalizar el código en este archivo.

Aquí se ve el código original en este momento:

<?php
/**
 * The template for the sidebar containing the main widget area
 *
 * @package WordPress
 * @subpackage Twenty_Sixteen
 * @since Twenty Sixteen 1.0
 */
?>

<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
	<aside id="secondary" class="sidebar widget-area">
		<?php dynamic_sidebar( 'sidebar-1' ); ?>
	</aside><!-- .sidebar .widget-area -->
<?php endif; ?>

Aquí tienes un ejemplo de fragmento de código que puedes usar para reemplazar el archivo actual:

<?php
/**
 * The template for the sidebar containing the main widget area
 *
 * @package WordPress
 * @subpackage Twenty_Sixteen
 * @since Twenty Sixteen 1.0
 */
?>

<aside id="secondary" class="sidebar widget-area">
    <div id="author-bio" class="widget">
        <h2 class="widget-title">Meet the Blogger</h2>
        <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam.</p>
        <img src="https://picsum.photos/200" alt="Blogger Image" style="width: 100%; max-width: 200px; height: auto;" />
    </div><!-- #author-bio -->

    <?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
        <?php dynamic_sidebar( 'sidebar-1' ); ?>
    <?php endif; ?>
</aside><!-- .sidebar .widget-area -->

Este código simplemente mostrará una sección de perfil de autor justo encima de la visualización habitual de los widgets de la barra lateral. Siéntete libre de editar el texto ‘Conoce al Blogger’, el marcador de posición de texto ‘lorem ipsum’ y la URL de la imagen según tus necesidades.

Si eres nuevo en la codificación con WordPress, te recomendamos usar un asistente de IA como OpenAI para que te ayude. Puedes copiar el código dentro del archivo y usar una indicación como 'Por favor, edita este fragmento de código y agrega un nuevo elemento que muestre las publicaciones publicadas más recientes de este blog'.

Una vez que hayas editado el archivo, simplemente haz clic en 'Guardar cambios'.

Guardando los cambios realizados en el archivo sidebar.php en el administrador de archivos de Bluehost

A continuación, regresa a la carpeta de tu tema hijo en el administrador de archivos y haz clic derecho en tu archivo 'archive.php'.

Luego, elige ‘Editar’.

Editando el archivo archive.php en el administrador de archivos de Bluehost

Aquí, necesitamos hacer que el archivo archive.php use el nuevo archivo de barra lateral que acabamos de duplicar y editar.

Para hacer esto, busca la línea que dice <?php get_sidebar(); ?>:

Buscando la función que llama a la barra lateral en el archivo archive.php en el administrador de archivos de Bluehost

Una vez que la hayas encontrado, reemplaza esa línea con el siguiente fragmento de código:

<?php
// Conditionally load the sidebar based on the category
if ( is_category( 'WordPress Core' ) ) {
    get_sidebar( 'wordpresscore' );
} else {
    get_sidebar();
}
?>

Este código cargará esencialmente el archivo sidebar-wordpresscore.php si el visitante está viendo la página de categoría del blog de WordPress Core. De lo contrario, simplemente mostrará el archivo de barra lateral predeterminado.

Si has creado varios archivos sidebar-categoryname.php, entonces tu código se verá así:

<?php
// Conditionally load the sidebar based on the category
if ( is_category( 'WordPress Core' ) ) {
    get_sidebar( 'wordpresscore' );
} elseif ( is_category( 'Blogging' ) ) {
    get_sidebar( 'blogging' );
} elseif ( is_category( 'Theme' ) ) {
    get_sidebar( 'theme' );
} else {
    get_sidebar();
}
?>

Independientemente del código que uses, asegúrate de reemplazar los nombres de las categorías correspondientemente.

Una vez que hayas terminado, simplemente haz clic en 'Guardar cambios'.

Reemplazando algunas líneas de código en el archivo archive.php en el administrador de archivos de Bluehost

Ahora, procede a ver la página de categoría que editaste para ver si los cambios se han implementado.

Así es como se ve la barra lateral en nuestro sitio web de demostración:

Ejemplo de una barra lateral personalizada hecha con código y el administrador de archivos de Bluehost

Esperamos que este tutorial te haya ayudado a aprender cómo agregar fácilmente una cabecera, pie de página o barra lateral personalizada para cada categoría en WordPress. También te puede interesar consultar nuestras selecciones expertas de las mejores alternativas a Canva para crear gráficos de sitios web y nuestra guía sobre cómo rediseñar un sitio web de WordPress.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para obtener tutoriales en video de WordPress. También puedes encontrarnos en Twitter y Facebook.

Descargo de responsabilidad: Nuestro contenido es compatible con el lector. Esto significa que si haces clic en algunos de nuestros enlaces, podemos ganar una comisión. Consulta cómo se financia WPBeginner, por qué es importante y cómo puedes apoyarnos. Aquí está nuestro proceso editorial.

El Kit de herramientas definitivo para WordPress

Obtén acceso GRATUITO a nuestro kit de herramientas: ¡una colección de productos y recursos relacionados con WordPress que todo profesional debería tener!

Interacciones del lector

26 CommentsLeave a Reply

  1. Mostrar diferentes barras laterales para diferentes categorías es una muy buena idea en términos de crear una buena experiencia de usuario.
    Uso SeedProd para esto y tener la capacidad de utilizar condiciones e incluir la categoría basándome en esa condición es una característica muy útil.
    Esto da control total sobre cómo se verá el sitio web y qué cosas podemos incluir en las barras laterales para hacerlo más atractivo y estético.

  2. Gracias por esta guía, ¿hay alguna forma de eliminar el encabezado “Categoría” en la página de archivo de categoría de Wordpress? ¿Eliminarlo o reemplazarlo con otra palabra personalizada?

    • Parece que tienes un plugin que está agregando migas de pan o tu tema tiene las migas de pan habilitadas en su configuración, que es la razón más común por la que ves eso. Dependiendo de cuál, deberías tener una opción para deshabilitarlo para tus páginas de archivo.

      Administrador

  3. He intentado implementar un pie de página diferente en la página de inicio estática con el siguiente código, pero no funciona...
    ¿Me pueden ayudar por favor?

    }

  4. Hola a todos,

    Este es un gran truco, pero uno de mis clientes preguntó si podemos adaptar esto a WooCommerce.
    Lo intenté pero no tuve éxito...

    ¿Puedes decirme cómo implementarías esto en la plantilla archive-product.php de WooCommerce?

  5. Hola, ¿qué puedo hacer si quiero tener encabezados, barras laterales y pies de página personalizados para que se guarden en subcarpetas, como:
    sidebar-cars en la carpeta sidebars/sidebar-cars.php

  6. Hello and thanks for this great article. What about each category linking to an external url and not just the homepage? For example: Dog training category’s header linked to an external site. Thanks in advanced ;)

  7. ¡Debes haber estado leyendo mi mente! Acabo de hablar con un cliente que quiere un pie de página diferente en una página específica y esto parece que va a funcionar perfectamente. Gracias por la excelente información.

  8. ¡Gracias! Utilizo categorías para mi sitio de negocios para denotar las principales "categorías de servicio" de producción de video que ofrezco a mis clientes. Esto me permitirá tener una introducción que describa el tipo de video y su función; marketing, testimonio, etc.

  9. ¿y si solo quiero una barra lateral diferente a la de la página de inicio, en otras palabras, todas las categorías tendrían la misma barra lateral pero la página de inicio tendría una barra lateral diferente, además, ¿cómo podría editar las diferentes barras laterales en el panel de widgets?

    gracias por esta publicación, por cierto, la más fácil que he encontrado hasta ahora.

    • Si solo quieres una barra lateral diferente en la página de inicio, usa la etiqueta condicional if is_home o is_frontpage (dependiendo de cómo estés creando una página de inicio personalizada), y luego incluye un archivo de barra lateral diferente.

      Administrador

  10. En una nota relacionada, puedes crear una barra lateral personalizada para cada página o publicación individual usando el Plugin Graceful Sidebar. Para usar esto, simplemente edita tu publicación como de costumbre y especifica el título y el contenido del widget de la barra lateral en los campos de edición personalizados proporcionados por este plugin.

  11. ¡WPBeginner lo vuelve a hacer! Busqué durante mucho tiempo una solución para agregar una barra lateral diferente a diferentes categorías, y esto funcionó de maravilla. Gracias

      • De hecho, una plantilla de página personalizada es un excelente lugar para implementar esta solución. ¿Una función integrada de WP para indicarle que use una cabecera, barra lateral o pie de página personalizado? Me apunto.

        Dado que estás usando etiquetas condicionales para esta solución (is_category), deberías poder usar las de las páginas (http://codex.wordpress.org/Conditional_Tags#A_PAGE_Page) en una plantilla de página personalizada. Estoy planeando una página de inicio personalizada asignada a través de la sección de administración, así que la probaré con is_front_page en lugar de is_category.

        Genial

  12. Hola, gracias por un gran tutorial, esto es justo lo que estaba buscando. Ahora tengo una barra lateral personalizada para una de mis categorías, y como mantuve el código de barra lateral dinámica, pensé que podría agregarle widgets. Sin embargo, no aparece en el editor de widgets. ¿Cómo hago para poder agregar widgets a mi barra lateral específica de categoría?

  13. Muchas gracias por esta publicación. Esto realmente me sacó de un gran apuro. Busqué complementos para hacer este trabajo por mí, pero no pude encontrar ninguno. Me alegré mucho de encontrar la solución en esta publicación.
    Ahora puedo crear diferentes encabezados para diferentes categorías.
    Gracias de nuevo y sigan con el buen trabajo.

Deja una respuesta

Gracias por elegir dejar un comentario. Ten en cuenta que todos los comentarios son moderados de acuerdo con nuestra política de comentarios, y tu dirección de correo electrónico NO será publicada. Por favor, NO uses palabras clave en el campo del nombre. Tengamos una conversación personal y significativa.