• Saltar a la navegación principal
  • Saltar al contenido principal
Código Genesis

Código Genesis

Tutoriales de WordPress y Genesis Framework

  • Empieza aquí
  • Cuenta
    • Suscripción
    • Perfil
    • Actualizar tarjeta
    • Favoritos
    • Salir
  • Suscribirse
  • Acceder

Conseguir una cabecera de ancho completo en Agentpress Pro

Descubre cómo hacer una cabecera que ocupe todo el ancho de página en el child theme de Genesis Agentpress Pro mediante código.

¿Te gusta el estilo boxed del tema hijo Agentpress Pro pero prefieres que la cabecera sea de ancho completo?

Para conseguirlo solo necesitas realizar algunas modificaciones de CSS. 

Código para obtener una cabecera que ocupe todo el ancho en Agentpress Pro

Si deseas el mismo resultado que ves en la imagen, usa el área de widgets de la cabecera para colocar el menú principal.

Ahora, sustituye este snippet en el apartado Site Header:

Para ver este código y los otros 1805 snippets de esta web,
identifícate o suscríbete aquí.

Con esto obtienes una cabecera que ocupa todo el ancho de la página e igualas el color del título.

Por último, si quieres que quede perfecto, puedes eliminar las líneas laterales de los items del menú.

Para ello, comenta la línea 1326 del apartado Site Header Navigation de forma que quede así:

Para ver este código y los otros 1805 snippets de esta web,
identifícate o suscríbete aquí.

¡Ya está!

Conclusiones

Puedes conseguir una cabecera de ancho completo en Agentpress Pro ajustando estos parámetros de CSS.

Si te interesa que, además de ocupar todo el ancho, el header permanezca fija en la parte superior, solo tienes que decírmelo en los comentarios para que prepare un tutorial que lo incluya.

Ventajas de ser suscriptor.😉

Agentpress Pro Cabecera CSS

Nahuai Badiola

Desarrollador web especializado en WordPress y Genesis Framework. CEO de Código Genesis y cofundador de OsomPress (temas y plugins para WordPress).

Para dejar dudas o preguntas sobre este código, puedes login o suscribirte.

  • Empieza aquí
  • Sobre Código Genesis
  • Preguntas frecuentes
  • Contacto

Aviso legal · Política de privacidad · Política de cookies · Condiciones de contratación
Copyright © 2023 · Código Genesis

¿Has olvidado tu contraseña?