Cómo editar la cabecera en WordPress

Recientemente, uno de nuestros lectores nos pidió instrucciones paso a paso sobre cómo editar la cabecera en WordPress, ya que no encontraba nada que le guiara desde cero.

Aunque esto es algo muy básico, pensamos que era una excelente oportunidad para ayudar a quienes se inician en su andadura con WordPress.

Así que, sin más preámbulos, vamos a ver cómo puedes editar el encabezado de tu sitio WordPress y darle estilo para que luzca más atractivo.

Cómo editar la cabecera en WordPress

Con la última versión de WordPress, puedes usar el Editor del Sitio interactivo y fácil de usar para personalizar y dar marca a tu sitio web y crear un encabezado personalizado fácilmente.

Dado que la mayoría de las nuevas instalaciones de WP vienen con el Tema Twenty Twenty-Four, el editor del sitio es bastante útil para varias personalizaciones del encabezado:

• Fuentes
• Colores
• Estilo del Botón
• Y más

Paso 1: Accede al Editor del Sitio

Desde tu Panel de WordPress, simplemente navega a Apariencia y luego haz clic en la opción Editor del menú.

Esto te redirigirá al Editor del Sitio, donde puedes personalizar la apariencia de tu sitio web usando el editor de bloques. Abre las opciones en Patrones.

Ahora, todo lo que tienes que hacer es desplazarte hacia abajo hasta que veas la sección Partes de Plantilla y luego hacer clic en Encabezado para abrir sus opciones.

En el lado derecho de la pantalla, haz clic en la imagen del Encabezado para abrir las opciones de personalización disponibles en el Editor del Sitio y haz clic en el icono de Editar.

Ahora serás redirigido al Editor de Bloques de WordPress, donde puedes empezar añadiendo tu logo, navegación, iconos sociales e incluso un botón de llamada a la acción (si es necesario).

Paso 2: Añade el Logo de tu Sitio

Una vez que estés en el Editor de Bloques para el Encabezado de tu sitio web, haz clic en el icono de Vista de Lista para que sea fácil saber qué elementos están incluidos en el encabezado de WordPress.

Expande todos los Bloques incluidos en la Vista de Lista, haz clic en el primer elemento de Fila y establece la Alineación a Ancho Completo para empezar a personalizar la plantilla del encabezado.

Ahora, todo lo que tienes que hacer es hacer clic en la opción Logo del Sitio en la Vista de Lista y hacer clic en el icono de Subir en la sección de vista previa del encabezado.

Puedes elegir subir tu logo a través de la pestaña Subir Archivos, o simplemente seleccionar el archivo de tu Biblioteca de Medios existente.

Si es necesario, puedes usar los Puntos de Redimensionamiento para cambiar las dimensiones y el tamaño del logo del sitio, según tus necesidades o requisitos específicos.

¡Buen trabajo! Eso es todo lo que necesitas hacer para subir el Logo de tu Sitio al encabezado. ¡Ahora, pasemos al siguiente paso de añadir el Título de tu Sitio!

Paso 3: Añade el Título del Sitio

Añadir el Título del Sitio en el encabezado de tu sitio web es igual de simple que subir el Logo de tu Sitio en el tema de WordPress. Simplemente haz clic en Título del Sitio desde la Vista de Lista.

Luego, de forma similar a como cambiamos el logo del sitio anteriormente, haz clic en el bloque que dice "Escribe el título del sitio..." y añade tu Título del Sitio dentro de él.

Como puedes ver, el encabezado de tu tema está empezando a tomar forma lentamente. Para el siguiente paso, vamos a añadir algunos elementos de navegación a tu encabezado.

Paso 4: Añade las Navegaciones de Página

Para añadir tus páginas al encabezado, simplemente haz clic en Navegación desde la Vista de lista, y luego haz clic en la opción Editar de su bloque.

Esto te llevará a la página dedicada del editor de bloques para el elemento Navegación, donde puedes añadir nuevas páginas y sus enlaces a través del icono Más.

Esto completará el aspecto de tu encabezado, pero como puedes ver, ¡parece demasiado simple y hay mucho margen de mejora!

Añadamos ahora un poco de estilo a tu encabezado para que tenga un aspecto más atractivo y coincida con los tonos de color de tu sitio web.

Paso 5: Cambia el Color de Fondo

Una de las modificaciones más básicas que puedes hacer en el encabezado es cambiar su color de fondo. Para ello, haz clic en la primera Fila y abre su Configuración.

Ahora podrás ver las opciones de Bloque para la Fila seleccionada. Todo lo que tienes que hacer ahora es hacer clic en el icono Estilos junto al icono del engranaje (configuración).

Esto abrirá numerosas opciones para la Fila seleccionada, donde puedes modificar el Color, la Imagen de fondo, la Tipografía y las Dimensiones.

Puedes explorar estas opciones para que tu encabezado tenga un aspecto más atractivo. Como solo necesitábamos cambiar el color, seleccionamos blanco para el Texto y negro para el Fondo.

Como puedes ver, el encabezado en el front-end se ve mucho mejor ahora y le da al sitio web un aspecto más completo.

¿Quieres hacer más modificaciones en el encabezado, como insertar algunos iconos de redes sociales y un botón de llamada a la acción? ¡Bueno, el proceso es simple!

Paso 6: Añade Iconos Sociales y Botón de Llamada a la Acción (CTA)

Para añadir iconos de redes sociales y un botón de llamada a la acción, necesitarás añadir una nueva Fila. Haz clic en el icono Más (+) y selecciona el bloque Fila.

A continuación, arrastra el bloque Fila recién añadido por encima de la fila existente para que puedas personalizarlo libremente sin afectar al encabezado existente.

Después de eso, haz clic en el botón (+) dentro de la nueva Fila y busca y selecciona el bloque Iconos de redes sociales.

De forma similar a como añadimos páginas en la Navegación, haz clic en el botón (+) para insertar Widgets de redes sociales para las plataformas que prefieras.

Una vez hecho esto, selecciona de nuevo la Fila desde la Vista de lista y haz clic de nuevo en el botón (+) para añadir un bloque Botón a tu encabezado.

Todo lo que tienes que hacer ahora es ponerle a tu botón un texto como "¡Reserva ahora!" y actualizar su Enlace para configurar una redirección para los visitantes del sitio web.

Para que todo encaje, selecciona de nuevo la Fila y establece la Alineación en Ancho completo como hicimos con la primera fila.

Luego, para darle a esta sección un aspecto más atractivo, utiliza el menú Cambiar justificación de elementos y selecciona la opción Justificar elementos a la derecha.

¡Y ahí lo tienes! Tu encabezado ahora está completo y se ve perfecto. Simplemente haz clic en el botón Guardar en la parte superior para evitar perder cualquier cambio.

Paso 7: Añade Logo a las Plantillas de Correo Electrónico (Opcional)

Considera agregar tu logo a una plantilla de correo electrónico para añadir una marca consistente que también se traslade a los correos electrónicos que se envían desde tu sitio web de WordPress.

Es fácil cambiar cómo funcionan las Notificaciones por Correo Electrónico en WPForms. Primero, ve a WPForms » Ajustes y haz clic en la pestaña Correo Electrónico.

Elige cualquier estilo que mejor se adapte a tu marca en la sección Plantilla y pulsa el botón Elegir para aplicarlo.

Después de eso, para agregar el logo de tu sitio a los correos electrónicos, navega a la sección Imagen del Encabezado y haz clic en el botón Subir Imagen.

Una vez que hayas subido tu imagen, selecciona el tamaño deseado para la imagen que se utilizará en tus notificaciones por correo electrónico desde un menú desplegable.

A continuación, simplemente haz clic en el enlace Vista previa de la plantilla de correo electrónico ubicado debajo del menú desplegable de Tipografía.

¡Se abrirá una nueva pestaña en tu navegador donde podrás ver una vista previa de tu plantilla de correo electrónico de notificación con el logo de tu sitio!

Preguntas frecuentes sobre la edición del encabezado en WordPress

Aprender a editar el encabezado en WordPress es un tema popular entre nuestros lectores. Aquí tienes respuestas a algunas preguntas comunes al respecto.

¿Cómo personalizo mi encabezado en WordPress?

Para personalizar tu encabezado en WordPress, navega a tu panel de control y ve a Apariencia > Personalizar. Aquí encontrarás la sección Encabezado. Haz clic en ella para explorar varias opciones, como cambiar el logo, ajustar el diseño del encabezado, colores y otros elementos. Algunos temas ofrecen opciones adicionales de encabezado para ajustar y que coincidan con tu estilo.

¿Cómo edito los botones del encabezado en WordPress?

La edición de los botones del encabezado en WordPress generalmente implica acceder al Personalizador a través de Apariencia > Personalizar. Una vez allí, busca la configuración de Encabezado o Menú. Puedes editar los botones cambiando su texto, enlaces y estilos o agregando nuevos elementos si tu tema lo admite. Si es necesario, también puedes agregar código personalizado para editar los botones del encabezado.

¿Cómo restablezco mi encabezado y pie de página en WordPress?

Para restablecer tu encabezado y pie de página en WordPress, puedes comenzar yendo a Apariencia > Personalizar y seleccionando la sección Encabezado o Pie de página. Busca una opción de restablecimiento dentro de estas configuraciones. Si no hay una, es posible que necesites deshacer manualmente los cambios o usar un plugin que ofrezca funcionalidades de restablecimiento.

A continuación, aprende cómo crear un formulario de varios pasos en Elementor

¿Alguna vez te has preguntado cómo aumentar la participación de los usuarios y la generación de leads en tu sitio web con un formulario de varios pasos de Elementor? Estos formularios guían a los usuarios a través del proceso paso a paso, haciéndolo menos abrumador y más fácil de usar.

Crea tu formulario de WordPress ahora

¿Listo para crear tu formulario? Empieza hoy mismo con el plugin constructor de formularios de WordPress más fácil. WPForms Pro incluye muchas plantillas gratuitas y ofrece una garantía de devolución de dinero de 14 días.

Si este artículo te ha sido útil, síguenos en Facebook y Twitter para obtener más tutoriales y guías gratuitas de WordPress.