Los widgets son una de las mejores maneras de agregar contenido o funcionalidad adicional en la parte superior de tu sitio web de WordPress. Estos prácticos bloques de contenido te permiten insertar fácilmente cosas como feeds de redes sociales, formularios de suscripción por correo electrónico o incluso publicaciones recientes en áreas designadas de tu tema.
Pero nos hemos encontrado con bastantes temas de WordPress que no incluyen un área de widgets integrada para la cabecera. Algunos de nuestros lectores nos han preguntado sobre la mejor manera de manejar esto.
En este artículo, te mostraremos cómo agregar fácilmente un widget de WordPress a la cabecera de tu sitio web, convirtiéndola en una parte valiosa y atractiva de tu presencia en línea.
¿Por qué agregar un widget a la cabecera de tu sitio de WordPress?
La cabecera de tu sitio web es una de las primeras cosas que verán tus visitantes al acceder a tu sitio web de WordPress. Al agregar un widget de WordPress a tu cabecera, puedes optimizar esta área para captar la atención del lector.
La mayoría de las cabeceras de sitios web incluirán un logotipo personalizado y un menú de navegación para ayudar a los visitantes a moverse por tu sitio.
También puedes agregar un widget en la cabecera, encima o debajo de esta área, para mostrar contenido útil, anuncios publicitarios, ofertas por tiempo limitado, formularios de una sola línea y más.
Aquí en WPBeginner, tenemos un encabezado llamada a la acción justo debajo del menú de navegación.
La mayoría de los temas de WordPress tienen áreas listas para widgets en la barra lateral y en las áreas del pie de página del sitio, pero no todos los temas agregan áreas listas para widgets en el encabezado.
Nota del editor: Si tu tema no tiene un área de encabezado lista para widgets, ahora puedes crear temas de WordPress completamente personalizados desde cero (sin necesidad de codificar).
Pero primero, veamos paso a paso cómo agregar un widget de WordPress a tu encabezado de sitio web en tu tema existente. Simplemente usa los enlaces rápidos a continuación para saltar directamente al método que deseas usar:
- Agregar un widget de WordPress al encabezado de tu sitio web en la configuración del tema de WordPress
- Agregar un widget de WordPress al encabezado de tu sitio web agregando código a WordPress
Método 1: Agregar un widget de WordPress al encabezado de tu sitio web en la configuración del tema de WordPress
Muchos de los mejores temas de WordPress incluyen un área de widget en el encabezado que puedes personalizar a tu gusto.
Primero, querrás ver si tu tema actual de WordPress admite un área de widget de WordPress en el encabezado.
Puedes encontrar esto yendo al personalizador de temas de WordPress o al área de widgets de tu panel de administración de WordPress. Para hacer esto, navega a Apariencia » Personalizar y verifica si hay una opción para editar el encabezado.
Nota: Si estás usando un tema de bloques, entonces no verás esta opción en la barra lateral de tu administrador. En su lugar, deberías ver nuestra guía sobre cómo personalizar tu encabezado usando el Editor de Sitio Completo de WordPress.
En este ejemplo, el tema gratuito Astra tiene una opción llamada 'Constructor de Encabezado'. Te mostraremos cómo usar esta función en Astra, pero ten en cuenta que esto se verá diferente dependiendo del tema que estés usando.
Si haces clic aquí, te llevará a una pantalla para editar tu encabezado y agregar widgets.
En la parte inferior de la pantalla, puedes personalizar completamente el encabezado, junto con las áreas encima y debajo del encabezado. Simplemente pasa el cursor sobre una de las áreas vacías y haz clic en el ícono de ‘Más’.
Esto abre un menú emergente donde puedes seleccionar ‘Widget 1’.
Hay opciones adicionales para elegir, pero necesitarás seleccionar una de las opciones de ‘Widget’ para que el encabezado esté listo para widgets.
Para agregar un área de widget a tu encabezado, haz clic en el cuadro ‘Widget 1’ que se encuentra en la sección de personalización del encabezado.
Esto abre la opción para agregar un widget.
A continuación, haz clic en el ícono de ‘Más’ para agregar un bloque en el menú de la izquierda.
Esto abre una ventana emergente donde puedes seleccionar un widget para agregar a tu encabezado.
Puedes continuar personalizando tu encabezado y agregar tantos widgets como desees.
Una vez que hayas terminado, asegúrate de hacer clic en el botón ‘Publicar’ para guardar tus cambios.
Ahora, puedes ver tu área de encabezado con el widget o widgets que agregaste.
Aquí tienes una captura de pantalla de cómo aparece en nuestro sitio de demostración.
¿No usas Astra?
Otra forma de ver si tu tema ya tiene un widget de encabezado de WordPress es navegando a Apariencia » Widgets en tu panel de administración de WordPress.
Luego, verifica si hay una sección de widget etiquetada como ‘Encabezado’ o algo similar.
Si la hay, simplemente haz clic en el ícono de ‘Más’ para agregar un bloque y abrir el menú de widgets.
Luego, puedes agregar el widget que desees haciendo clic en él.
Asegúrate de hacer clic en el botón ‘Actualizar’ para guardar tus cambios en el área del widget del encabezado.
Método 2: Agregar un Widget de WordPress al Encabezado de tu Sitio Web Agregando Código a WordPress
Si tu tema de WordPress no tiene un área de widget de WordPress en el encabezado, entonces necesitarás agregarla manualmente agregando código a WordPress.
Si no has hecho esto antes, consulta nuestra guía sobre cómo copiar y pegar código en WordPress.
Luego, puedes agregar el siguiente fragmento de código a tu archivo functions.php o usando un plugin de fragmentos de código como WPCode (recomendado):
function wpb_widgets_init() {
register_sidebar( array(
'name' => 'Custom Header Widget Area',
'id' => 'custom-header-widget',
'before_widget' => '<div class="chw-widget">',
'after_widget' => '</div>',
'before_title' => '<h2 class="chw-title">',
'after_title' => '</h2>',
) );
}
add_action( 'widgets_init', 'wpb_widgets_init' );
Para más detalles, puedes ver nuestra guía sobre cómo agregar código personalizado en WordPress sin romper tu sitio.
Te guiará a través del método WPCode.
Este código registra una nueva barra lateral o un área lista para widgets para tu tema.
Si vas a Apariencia » Widgets, verás una nueva área de widgets etiquetada como 'Área de Widgets de Encabezado Personalizado'.
Ahora, puedes agregar tus widgets a esta nueva área. Para más detalles, consulta nuestra guía sobre cómo agregar y usar widgets en WordPress.
Sin embargo, tu widget de encabezado aún no se mostrará en vivo en tu sitio web. Te mostraremos cómo hacerlo a continuación.
Mostrar tu widget de encabezado personalizado en WordPress
Ahora que has creado el área de widgets del encabezado, necesitas indicarle a WordPress dónde mostrarlo en tu sitio web.
Para hacer esto, necesitas editar el archivo header.php de tu tema. Luego, necesitas agregar el siguiente código donde quieras que se muestre el widget:
<?php
if ( is_active_sidebar( 'custom-header-widget' ) ) : ?>
<div id="header-widget-area" class="chw-widget-area widget-area" role="complementary">
<?php dynamic_sidebar( 'custom-header-widget' ); ?>
</div>
<?php endif; ?>
Este código agregará el área de widget personalizada que creaste anteriormente al área del encabezado de tu sitio web.
Ahora, puedes visitar tu blog de WordPress para ver tu área de widget de encabezado en vivo.
Estiliza tu área de widget de encabezado de WordPress usando CSS
Dependiendo de tu tema, es posible que también necesites agregar CSS a WordPress para controlar cómo se muestran el área de widget del encabezado y cada widget dentro de ella. Esto se puede hacer de varias maneras:
- Si estás utilizando un tema antiguo, puedes usar el Personalizador de Temas visitando Apariencia » Personalizar en tu panel de WordPress.
- Si estás utilizando un tema de bloques, entonces puedes solucionar la falta del personalizador de temas en el administrador de WordPress.
- Si estás utilizando un tema de bloques, entonces puedes agregar CSS adicional usando el Editor de Sitio Completo visitando Apariencia » Editor en tu panel.
- Puedes agregar CSS personalizado usando el plugin WPCode (recomendado).
- Si no sabes CSS, puedes usar un plugin como CSS Hero en su lugar.
Para obtener más información, consulta nuestra guía sobre cómo agregar fácilmente CSS personalizado a tu sitio de WordPress.
Para este artículo, echaremos un vistazo rápido a cómo agregar CSS personalizado usando el plugin WPCode y el Personalizador de Temas de WordPress.
En el Método 2 anterior, te mostramos cómo usar WPCode para agregar un fragmento de código a tu archivo functions.php. También puedes usar este plugin para agregar CSS personalizado.
Cuando crees un nuevo fragmento en WPCode, asegúrate de seleccionar el tipo de código 'Fragmento CSS' del menú desplegable a la derecha y que la opción 'Inserción automática' esté seleccionada.
En la sección de vista previa del código, necesitas agregar el CSS para estilizar tu widget de encabezado.
Aquí tienes un código CSS de ejemplo para ayudarte a empezar:
div#header-widget-area {
width: 100%;
background-color: #f7f7f7;
border-bottom:1px solid #eeeeee;
text-align: center;
padding: 20px;
}
h2.chw-title {
margin-top: 0px;
text-align: left;
text-transform: uppercase;
font-size: small;
background-color: #feffce;
width: 130px;
padding: 5px;
}
Después de eso, debes asegurarte de que la configuración 'Activo' esté activada y luego hacer clic en el botón 'Guardar fragmento' en la parte superior derecha de la pantalla.
Para usar el Personalizador de Temas en su lugar, debes navegar a Apariencia » Personalizar en tu panel de administración de WordPress. Esto abre el panel del personalizador de temas de WordPress. Debes hacer clic en la pestaña 'CSS adicional'.
Esto te permite agregar CSS adicional directamente a tu tema y ver los cambios en tiempo real.
Simplemente agrega el código CSS que te mostramos anteriormente al cuadro 'CSS adicional'.
Una vez que hayas terminado de agregar tu CSS, asegúrate de hacer clic en el botón 'Publicar' para guardar tus cambios.
Así es como se ve el widget de encabezado personalizado con los cambios de CSS en vivo.
Esperamos que este artículo te haya ayudado a aprender cómo agregar un widget de WordPress al encabezado de tu sitio web. También puedes consultar nuestra guía sobre cómo agregar código de encabezado y pie de página en WordPress y nuestras selecciones expertas de las mejores herramientas de desarrollo 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.
Curtis
¿Qué opción de widget seleccionaste para hacer un “banner” como el morado del ejemplo (es decir, Demo Inc)? Quiero hacer un “banner” simple (si ese es el término correcto) que tenga un botón que enlace a nuestro sitio web hermano que vende productos.
Soporte de WPBeginner
El banner en el ejemplo es una imagen única enlazada a una URL específica. La mayoría de los banners son actualmente una imagen creada para ese propósito y la imagen se crea con una herramienta de edición de imágenes.
Administrador
Rob Hartman
Este tutorial fue PERFECTO y he creado con éxito el widget de encabezado, súper ligero y sin impacto en la velocidad de la página. Esperaba poder usar el mismo enfoque para agregar un área de widget a mi pie de página y reemplazar todas las referencias relacionadas con el encabezado tanto en Functions como en footer.php, pero en este caso el área de widget no se registró.
¿Este enfoque aplica SOLAMENTE al área del encabezado?
De todos modos, gracias por un tutorial súper conciso.
Soporte de WPBeginner
El código debería funcionar incluso en un pie de página, pero es posible que tu tema no muestre el pie de página en todas las páginas como razón común.
Administrador
Sjoerd
¡Hola! Gracias por el tutorial. ¿Qué pasa si quiero mostrar el área de widgets encima del menú principal en lugar de justo debajo?
Soporte de WPBeginner
Entonces colocarías el código encima del menú en lugar de debajo.
Administrador
Gaston
Thank you!!! I was looking for this
Soporte de WPBeginner
Glad our guide was helpful
Administrador
Ranjit
Gracias por el tutorial, tengo una pregunta: ¿cómo agrego columnas (2 o 3) en el widget del encabezado?
Soporte de WPBeginner
Eso dependería de tu tema específico; primero te recomendamos contactar al soporte de tu tema específico para ver si tienen un método incorporado para lo que deseas hacer o si tienen configuraciones recomendadas.
Administrador
Muhammad Kashif
Hola, agregué el widget de encabezado personalizado con éxito, pero después de actualizar el tema, ¿mi widget de encabezado personalizado no funciona? ¡Por favor, dime la solución! Espero tu respuesta. Gracias.
Soporte de WPBeginner
Cuando actualizaste tu tema, probablemente eliminaste el código de header.php. Para evitar eso en el futuro, puedes considerar crear un tema hijo siguiendo nuestra guía a continuación:
https://www.wpbeginner.com/wp-themes/how-to-create-a-wordpress-child-theme-video/
Administrador
Sophia
¡Muchas gracias! Esto era exactamente lo que estaba buscando. Funciona perfectamente.
Soporte de WPBeginner
You’re welcome
Administrador
Inayatali
¡Muchas gracias por esta publicación increíble, este código funciona perfectamente como quería.
Soporte de WPBeginner
You’re welcome, glad our article was helpful
Administrador
Jim Rolt
Excelentes fragmentos de código que pude adaptar y estilizar para hacer los trabajos que quería. Muchas gracias por esto
Soporte de WPBeginner
Glad our guide could be helpful
Administrador
Vildan
Hola WP Beginner,
¿Cómo consigo el área de widgets en la cabecera, en el lado derecho del menú? Quiero añadir el icono AGREGAR AL CARRITO ahí.
Soporte de WPBeginner
Para la ubicación, dependería del tema específico que estés usando. Si consultas con el soporte de tu tema, deberían poder indicarte en qué parte de tu archivo header.php agregar el código o si tienen un método incorporado para hacerlo.
Administrador
Bathri Vijay
Gracias, equipo editorial de WPBeginner, por dar un blog perfecto a los principiantes y programadores de nivel medio. Es una gran plataforma para aprender y ejecutar WordPress. Fueron una gran razón para el éxito de muchos bloggers y dueños de negocios.
Soporte de WPBeginner
You’re welcome, glad you’ve been finding our content helpful
Administrador
zambol
Gracias por el tutorial. Funciona, pero el problema que tengo es que no es responsable para dispositivos móviles. ¿Es posible hacer que la barra lateral sea responsable?
Soporte de WPBeginner
Creo que te refieres a responsive (adaptable), en cuyo caso, lamentablemente, no tenemos un método recomendado para hacer que este widget sea responsive en este momento.
Administrador
Gen
Gracias,
funciona. Ahora puedo agregar algún widget o anuncios sin agregar complementos.
Soporte de WPBeginner
You’re welcome
Administrador
anju
cómo mostrar una cabecera personalizada antes de la cabecera creada
Soporte de WPBeginner
Dependiendo de tu tema específico, si hay contenido antes del contenido de header.php, deberías contactar al soporte del tema
Administrador
dav
Hola,
Me gustaría hacer un encabezado como el de la primera imagen en la parte superior de esta página (el sitio web de la lista 25).
¿Cómo puedo hacerlo?
¡Por favor, ayúdame!
Soporte de WPBeginner
Dependería de lo que quieras decir, puedes agregar íconos de imagen a los elementos de tu menú usando: https://www.wpbeginner.com/plugins/how-to-add-image-icons-with-navigation-menus-in-wordpress/
Administrador
dav
En realidad, me refiero a agregar widgets de cabecera central y cabecera derecha
Soporte de WPBeginner
Eso dependería mucho de tu tema, quizás quieras investigar un plugin de constructor de páginas para crear fácilmente algo como lo que deseas.
Tehreem
Bueno, no puedo acceder a mi header.php. ¿Hay alguna otra forma de mostrar mi cabecera? ¿como desde CSS?
Soporte de WPBeginner
CSS te permitiría estilizar el área una vez agregada, pero necesitarías editar el archivo php para agregar el código para colocar la sección o podrías usar un plugin de constructor de páginas como otra opción: https://www.wpbeginner.com/beginners-guide/best-drag-and-drop-page-builders-for-wordpress/
Administrador
GoosePT
¡Hola!
Tutorial perfecto.
Lo estoy usando para crear una barra superior, pero estoy teniendo un problema, los widgets (en mi caso 2) están uno debajo del otro.
¿Cómo puedo hacer que se muestren uno al lado del otro?
Lori
Gran tutorial, funciona perfectamente. Me encantaría escuchar la respuesta a esta también, la estoy usando para una configuración similar y me gustaría mostrar widgets uno al lado del otro.
PD: gran sitio por cierto, cada vez que necesito agregar funcionalidad adicional o tengo un problema con algo, empiezo con wpbeginner.
Soporte de WPBeginner
Sadly, for a question like that it would require theme specific CSS modifications with how the widgets are added. You would likely need to use inspect element to find the CSS option that needs to be changed: https://www.wpbeginner.com/wp-tutorials/basics-of-inspect-element-with-your-wordpress-site/
Administrador
J M Das
This tutorial is very useful.
How to remove the white space above this widget area in Posts? Thanks for any help
Mikhail Koval
What would I have to put in the header.php to ONLY show on the home page but not show on other pages?
Soporte de WPBeginner
Hola Mikhail,
Puedes usar etiquetas condicionales como `is_home` o `is_front_page` para mostrar cosas en páginas específicas en WordPress. Por ejemplo:
If ( is_front_page() ) { // code you want to display on the homepage }1-click Use in WordPress
Administrador
Anna
Hola, esto es realmente lo que estoy buscando y ¡sería genial si pudiera hacerlo funcionar! Crear el área del widget funciona bien, mostrarlo lamentablemente no.. También me gustaría mostrarlo solo en la página de inicio.
No estoy seguro
1) dónde en el archivo de encabezado poner el código de visualización
2) dónde poner este código de "solo en la página de inicio" y qué código va en la línea 2
Entiendo si mis preguntas son demasiado básicas para molestarme, pero estaría muy agradecido si alguien tuviera tiempo y paciencia para ello de todos modos..:-) ¡¡Gracias de antemano!!
Soporte de WPBeginner
Hola Anna,
Estas son preguntas perfectamente razonables.
1. Necesitas colocar el código de visualización basándote en dónde quieres mostrar el widget del encabezado. Por ejemplo, el archivo `header.php` de tu tema puede tener una sección para mostrar el título del sitio, el logo, la descripción y los menús de navegación. Probablemente estarán envueltos en etiquetas `div`. Colocarás tu código del widget del encabezado antes o después de estas áreas. Si no estás seguro, puedes colocar el código al final del archivo `header.php`.
2. Si solo quieres mostrar el área del widget en la página de inicio de tu sitio web, entonces puedes usar etiquetas condicionales como esta:
if ( is_front_page() ) { // your widget display code goes here }1-click Use in WordPress
Anna
OK, hice trampa y puse el código del widget en `front-page.php` en su lugar, ¡funcionó! ¡Gracias :-)!
Anna
Hola de nuevo, ¡se hizo visible en la página de inicio con posicionamiento CSS!
Ahora solo queda la pregunta de cómo juntar el código "solo-en-la-página-de-inicio" con el código de visibilidad...
Gracias de nuevo por tu amabilidad y paciencia..)
Bruce Pratt
¡Gran tutorial! Esto me ayudó a lograr exactamente lo que quería. ¡Fantástico!
Paul Johnson
Gran tutorial, gracias. Estoy intentando implementar el JetPack Cookie Consent Widget y a pesar de seguir tus instrucciones, la barra de consentimiento de cookies todavía aparece en la parte inferior de la página.
¿Es posible que el widget esté sobrescribiendo el código?
Keu
¿Esto todavía funciona para Twentyseventeen? La parte de functions.php funciona bien, pero la parte de header.php no.
thomas evans
Hola
¿alguien aquí me puede ayudar a cómo hacer esto adaptable en cualquier dispositivo móvil?
Quiero insertar un código de Google AdSense aquí para anuncios de tamaño banner de 728 x 90, pero cada vez que lo hago, se muestra perfectamente en computadoras de escritorio, pero en dispositivos móviles se ve raro.
Gracias
Anubhav Bhatt
He creado con éxito un widget de encabezado y fue muy fácil, gracias a todos ustedes. Pero en realidad lo quería en las PUBLICACIONES, no en la página de inicio porque estoy usando el tema Nikko Portfolio y se ve horrible.
Por favor, ayúdenme.
Soren
¡Vaya, en realidad pude hacer esto...?! ¡Muchas gracias por una guía increíble!
Jeffrey
Coloqué el código en mi archivo functions.php y agregué mi código de widget en el archivo header.php y agregué mi texto de widget y guardé.
Cuando paso a editar páginas, al hacer clic en Actualizar, obtengo una pantalla en blanco y no puedo ver mi página.
Luego tengo que volver a /wp-admin para ver el panel. No hay errores en la consola cuando hago clic en actualizar, solo una pantalla en blanco.
Jeffrey
Después de solucionar problemas, tengo sintaxis incorrecta en el archivo functions.php.
¡Gracias!
Derek
Esto es genial para esa cosa del anuncio en el encabezado, pero lo que quiero hacer es agregar un botón de donación de PayPal a mi encabezado. (Lado derecho) No puedo creer que no haya tutoriales en video sobre cómo crear un espacio de encabezado con widgets para arrastrar tu widget de PayPal y que aparezca en el lado derecho de tu encabezado. Me imagino que hay mucha gente que podría beneficiarse de una instrucción sobre esto.
Stephen Crawford
Este es un gran tutorial, pero me gustaría crear un área de widgets que se pueda colocar encima del área del encabezado, ¿sería eso también posible?
Joey
Acabo de actualizar todo y está funcionando muy bien en mi escritorio. Ahora, si pudieras decirme cómo hacer que el widget se muestre en mi dispositivo móvil, ¡sería genial! ¿Metí la pata en algo en el camino?
Kushal
¡Muchas gracias por esta publicación! Resolvió lo que estaba buscando.
Mark
Hola, muchas gracias por escribir esto, me ha ayudado enormemente. Sin embargo, con mi sitio web: ¿cómo hago para que el widget aparezca en el extremo derecho? Cuando uso la opción para mostrar el campo de búsqueda en el encabezado, ¿ahí es donde quiero que vaya?
Thanks in advance!
Linda Holiner
Estoy confundido. No entiendo cómo poner una imagen en el widget y permitir que el usuario cambie la imagen. No veo de dónde viene tu imagen.
Thomas
¿Sería posible hacer un tutorial sobre cómo crear una TopBar con secciones (iconos de redes sociales, aviso, búsqueda, carrito de Woocommerce)?
Ningún plugin hace realmente eso bien
Gracias
Liam
¿Cómo hacer que el widget se muestre solo en dispositivos de escritorio?
Tim
Si quiero agregar múltiples áreas de widget personalizadas, ¿necesito agregar una nueva función a functions.php para cada una? ¿o simplemente agregarlas en el área que quiero?
fahad
Logré usar el widget en la barra de navegación en lugar del área del encabezado, ya que quería agregar una opción de cambio de idioma en esta sección. Tengo un pequeño problema donde no puedo mover las dos banderas del idioma a ninguna ubicación horizontal. Intenté agregar margin-right: 100px; a la sección CSS avanzada, pero no cambió. Podría ser algo más que centre todo el contenido de la navegación, pero quiero asegurarme de si se puede solucionar con el widget.
Courtney
¿Hola, cómo editaste el código para ponerlo en la barra de navegación? Actualmente estoy intentando hacer lo mismo sin éxito.
Leanore
Cuando intento agregar más de un área de widget personalizada, recibo un Error 500 en mi sitio web. ¿Hay alguna razón para esto? ¿Es posible crear más de un área de widget personalizada para un tema?
Soporte de WPBeginner
Hola Leanore,
Sí, puedes crear múltiples áreas de widget personalizadas para tu tema.
Administrador
Antonis
Hola,
¿Es posible describir brevemente cómo crear múltiples? Intenté copiar la función y renombrar los elementos, pero no funciona...
P.D. ¡Código muy útil, gracias!
nina
¡Hola! Cuando intento actualizar el archivo function.php, aparece este error fatal:
Error fatal: No se puede redeclarar wpb_widgets_init()
No estoy seguro si hice una edición incorrecta. ¿Podrías ayudarme?
Soporte de WPBeginner
Hola Nina,
Esto significa que la función wpb_widgets_init ya existe en tu archivo functions.php. Tendrás que reemplazarla como wpb2_widgets_init para hacerla única o eliminar el código anterior que agregaste.
Administrador
Sam
Hola,
Muchas gracias por esto, es realmente útil.
Un problema que estoy teniendo: Mi widget es solo un menú de un par de enlaces de texto a páginas. Aquí está mi sitio:
¿Ve cómo el texto está completamente pegado al lado derecho del área del encabezado? Me gustaría usar un margen derecho para alinearlo debajo de “Contacto” sin que el área del margen se ponga blanca.
Also, would love to make the text black.
¡Muchas gracias si puedes ayudar con estos ajustes!
Sam
Tommy
Tu blog es de gran ayuda. Gracias por ayudarnos a hacer modificaciones a Twenty Seventeen. Gente como tú hace que usar un nuevo tema de WordPress como Twenty-seventeen sea mucho más fácil.
Soy relativamente nuevo en WordPress y me gustaría probar algunas modificaciones adicionales a Twenty Seventeen.
Me gustaría crear un nuevo widget para páginas de WP. Estoy tratando de averiguar cómo puedo tomar la información de tu blog sobre cómo hacer un nuevo widget para la cabecera y aplicarla a una página de WP en el tema Twenty Seventeen. Me estoy atorando.
¿Podrías mostrarnos cómo crear un nuevo widget para una página? Eso sería genial.
Gracias
Tommy
Soporte de WPBeginner
Hola Tommy,
Por favor, consulta cómo crear un widget personalizado de WordPress.
Administrador
Tom
en el tema Twenty Twelve, lo puso debajo de mi menú y no en el área de la cabecera.
liz
lo mismo para mí – ¿encontraste una solución, Tom?
Bobby_qw
Muchas gracias, Sr. Administrador. Nos está enseñando 'cómo hacer nuestro propio sitio web'. Siempre sigo sus publicaciones y hago mi propio sitio web. Muchas gracias.
Shane Cunningham
Usé esto y aunque funcionó para agregar un área de widget personalizada en la parte superior de mi página, no pude lograr que se alineara con los otros elementos en el encabezado (logotipo de la empresa y menú de navegación) en Cherry. No importa dónde lo pusiera en header.php, aparecía arriba o abajo de los otros elementos. Quería usarlo para crear un bloque de número de teléfono entre el logotipo y el menú de navegación. Aunque pude centrarlo horizontalmente en el lugar correcto, no pude lograr que apareciera entre ellos. Para darte una mejor idea de lo que necesito, imagina que en el encabezado de esta misma página, quisieras mover el menú de navegación justificado a la derecha y poner tu número 800 entre él y el logotipo de "wpbeginner". ¿Cómo podría usar este código (o una variación del mismo) para hacer eso?
Kristin
¡Muchas gracias por esto (y por todos) tus tutoriales detallados! ¿Podrías decirme cómo implementar un widget de encabezado, excluyendo la página de inicio?
Massimo
En el código que agregaste a header.php, cambia la primera línea:
if ( is_active_sidebar( 'custom-header-widget' ) ) : ? >por esta:
if ( is_active_sidebar( 'custom-header-widget' ) && ! is_front_page ) : ?Massimo
¡Perdón, se me pasó algo!
La línea que tienes que agregar es:
if ( is_active_sidebar( 'custom-header-widget' ) && ! is_front_page() ) : ?>Kristin
¡Muchas gracias!
reus
thank men, more power
Nirmal Kumar
Gracias por este tutorial ☺ Usé este código para crear la cabecera de mi sitio web.
Soporte de WPBeginner
You are welcome
Administrador
Mihaita Vulpe
Vaya, y yo pensaba que solo podía agregar widgets en la barra lateral, gracias por los consejos.
Mihaita,
Yukio
Vaya, esto realmente parece interesante y muy útil; voy a intentarlo y espero que funcione.