4 métodos fáciles (3 sin código)

El encabezado es el primer elemento de su sitio web que ven la mayoría de los visitantes. Por lo general, aquí es donde se colocan el logotipo y el menú de su sitio, y es parte integral de cada página. Si no sabe cómo editar el encabezado de WordPress, tendrá dificultades para causar una buena primera impresión.

WordPress le permite editar el encabezado de su sitio de varias maneras. Casi todos los temas vienen con un diseño de encabezado único, que puede personalizar manualmente. Alternativamente, puede usar una variedad de herramientas proporcionadas por la comunidad más grande de WordPress.

En este artículo, le mostraremos cuatro formas de editar el encabezado de WordPress , con y sin complementos. ¡Pongámonos a trabajar!

Tabla de contenido:

1. Edite el encabezado usando el Personalizador
2. Use la edición completa del sitio (y un tema compatible)
3. Edite el encabezado usando un generador de páginas de WordPress
4. Agregue código personalizado al encabezado usando un complemento

1. Edite el encabezado usando el Personalizador

El Personalizador de WordPress es una herramienta integrada que le permite editar elementos globales de su sitio web. Puede usar el Personalizador para editar el encabezado, el pie de página, la tipografía, los menús y otros aspectos clave de su sitio.

Para acceder al Personalizador, vaya a su tablero y haga clic en Apariencia > Personalizar . El Personalizador mostrará un menú de opciones a la izquierda y una vista previa de su sitio web a la derecha:

Tenga en cuenta que si no ve la opción Personalizador de WordPress en su tablero, es posible que esté usando un tema habilitado para bloqueo. Para editar el encabezado de este tipo de tema, debe usar la Edición completa del sitio, que trataremos en la siguiente sección.

En el Personalizador, debería ver una opción relacionada con su encabezado. A veces, esto puede ser visible de inmediato, como en el ejemplo anterior. Otras veces, es posible que deba ir a un submenú. Por ejemplo, algunos temas colocan las opciones de encabezado en las opciones de diseño o algo similar.

Una vez que haya encontrado las opciones de encabezado de su tema, las opciones que verá ahora dependerán del tema que esté utilizando. Por ejemplo, nuestro tema Neve incluye opciones para cambiar su logotipo, el color del encabezado y qué menú se muestra en esta sección:

Neve también ofrece una selección de elementos que puede agregar al encabezado mediante la funcionalidad de arrastrar y soltar. Seleccione cualquiera de los elementos en Componentes disponibles y arrástrelos a las filas de encabezado en la parte inferior del Personalizador. Neve le permite agregar hasta tres filas de elementos para un encabezado y colocar elementos en cualquier posición que desee:

Cuando esté satisfecho con la configuración de su encabezado, guarde los cambios en su tema haciendo clic en el botón Publicar en la parte superior del Personalizador.

Tenga en cuenta que cualquier cambio que realice con el Personalizador solo se aplicará a su tema activo. Si cambia de tema, deberá editar el encabezado de WordPress nuevamente.

2. Use la edición completa del sitio (y un tema compatible)

La edición completa del sitio es una característica más nueva que le permite editar plantillas de temas usando el Editor de bloques. Esto solo funciona para temas habilitados para bloqueo, por lo que puede o no estar disponible en su sitio.

Para ver si su tema es compatible con la edición completa del sitio, abra el menú Apariencia y busque la opción Editor :

Selecciona eso y se abrirá el Editor de bloques. Sin embargo, editará sus plantillas de temas en lugar de sus páginas o publicaciones individuales.

De forma predeterminada, el editor se abrirá en la plantilla de la página de inicio, que debe incluir un elemento de encabezado :

Tenga en cuenta que algunos bloques solo aparecerán como marcadores de posición cuando utilice la edición completa del sitio. Eso es porque esta herramienta no es para editar bloques individuales, sino diseños completos.

Al editar el encabezado, obtienes control total sobre qué bloques y elementos incluir. Si abre la herramienta Vista de lista , puede ver un desglose de los bloques que contiene actualmente el encabezado:

En esta etapa, puede optar por agregar o eliminar bloques del encabezado. Para eliminar o editar un bloque existente, selecciónelo y use el menú contextual que aparece en la pantalla cuando lo hace:

Cuando selecciona un bloque, también puede editarlo usando el Bloque menú de configuración en el lado derecho de la pantalla. Este menú normalmente contiene opciones de estilo, y varían según el bloque que estés editando:

Para agregar un nuevo bloque, seleccione el elemento Encabezado y busque el icono del signo más . Ese botón abrirá un menú que le permitirá seleccionar qué bloque agregar:

Otra característica útil del Full Site Editor es que puede editar los menús visualmente. Para hacerlo, simplemente seleccione un menú usando el bloque de navegación . Verá la opción para agregar nuevos enlaces, crear un nuevo menú y cambiar entre los existentes:

Cuando esté satisfecho con los cambios en su encabezado, haga clic en Guardar . Esto guardará los cambios en la plantilla de encabezado del tema y se reflejarán en su sitio web automáticamente.

3. Edite el encabezado usando un generador de páginas de WordPress

Algunos complementos de creación de páginas de WordPress ofrecen opciones para editar el encabezado de WordPress. Por ejemplo, Elementor Pro incluye una herramienta Theme Builder a la que puede acceder con una licencia premium.

Si no tiene acceso a Elementor Pro, puede usar una extensión gratuita de terceros, como el complemento Elementor Header & Footer Builder en WordPress.org.

Sin embargo, le mostraremos cómo hacerlo usando Elementor Pro y su función Theme Builder.

En la práctica, Elementor Theme Builder funciona de manera similar a la edición completa del sitio.

Para acceder al Generador de temas, vaya a Plantillas > Generador de temas . Seleccione las opciones de encabezado en PARTES DEL SITIO y busque las plantillas existentes a la derecha. Solo debe haber una plantilla de encabezado, y puede hacer clic en el botón Editar junto a ella:

Esto iniciará el editor de Elementor. Desde aquí, puede elegir construir el encabezado utilizando bloques de Elementor o importar plantillas listas para usar. Si hace clic en el icono de la carpeta dentro del cuerpo del editor, puede ver a qué plantillas de encabezado tiene acceso:

Si está utilizando Elementor, le recomendamos que aproveche estas plantillas. Esto le permite experimentar con múltiples estilos de encabezado, que puede editar agregando o personalizando módulos:

Si no está familiarizado con el uso de Elementor, este creador de páginas le permite seleccionar módulos usando el menú de la izquierda. Puede arrastrar estos módulos a su página, que aparece en una vista previa en el lado derecho de la pantalla.

Cuando usa Theme Builder, solo está editando una plantilla de tema específica. Sin embargo, aún puede utilizar la gama completa de módulos y opciones de configuración que ofrece Elementor.

Una vez que haya terminado de editar la plantilla de encabezado, guárdela con el botón Publicar . Luego, Elementor le pedirá que elija en qué páginas debe mostrarse la plantilla:

A menos que ya esté pagando por una licencia premium de Elementor, es posible que la herramienta Theme Builder no justifique la compra por sí sola. Hace exactamente lo que hace la edición completa del sitio, pero a un costo superior. La principal diferencia es que puede usar la gama más amplia de módulos de Elementor, y si ya está usando Elementor, será más fácil asegurarse de que el diseño de su encabezado sea consistente con el resto de su sitio.

4. Agregue un código personalizado al encabezado usando un complemento

Por lo general, usar complementos es la forma más fácil de implementar personalizaciones en WordPress. Sin embargo, ese no suele ser el caso con los encabezados. Si desea un complemento que le permita editar encabezados visualmente, deberá usar un creador de páginas. La mayoría de los creadores de páginas que ofrecen esta funcionalidad son premium, como discutimos en la sección anterior.

Los complementos gratuitos que le permiten personalizar el encabezado generalmente solo ofrecen una forma más fácil de agregarle un código personalizado. La alternativa es editar sus archivos de tema manualmente usando un tema secundario, lo que puede ser intimidante (y arriesgado) a menos que tenga experiencia en desarrollo web.

Un ejemplo fantástico de un complemento de este tipo es Header Footer Code Manager. Esta herramienta le permite agregar fragmentos de HTML, CSS y JavaScript al encabezado y/o pie de página, y elegir en qué páginas se cargarán estos fragmentos:

Una vez que el complemento esté activo, vaya a la página HFCM > Agregar nuevos fragmentos en el tablero. Aquí puede seleccionar qué tipo de fragmento desea agregar, dónde debe mostrarse y si desea agregarlo al encabezado o al pie de página:

Si planea agregar nuevos elementos al encabezado, deberá usar HTML. Para cambiar el estilo del encabezado y los elementos que contiene, querrá usar fragmentos de CSS.

El principal inconveniente de este enfoque es que debe verificar el código del encabezado para ver qué clases e ID usa, para agregarles CSS. Este puede ser un proceso lento ya que agrega nuevos fragmentos de código, verifica si los cambios funcionan y ajusta el código hasta que esté satisfecho con los resultados.

Personaliza el encabezado de WordPress hoy

¿Tienes alguna duda sobre cómo editar tu cabecera en WordPress? ¡Hablemos de ellos en la sección de comentarios a continuación!