En las últimas publicaciones y videos vengo mostrándote cómo crear con Divi diferentes tipos de encabezados para tu sitio web.
Hoy voy a mostrarte cómo crear con El Theme Builder de Divi un encabezado vertical con un menú rotado que aparezca en el lado izquierdo de las páginas y entradas.
El color de fondo del encabezado es completamente transparente, lo que permite mostrar el contenido de la entrada, ya que el encabezado permanece siempre fijo en el costado izquierdo de la página.
Veamos cómo se hace.
Usaremos la primera sección del layout para contener al encabezado vertical, por eso la configuramos de la siguiente manera.
Fondo:
Tamaño:
Separación:
Sombra de la caja:
Visibilidad:
Puesto:
Insertamos una fila con estructura de 1 sola columna para colocar los módulos que componen el encabezado vertical y nos aseguramos simplemente de que ocupe el ancho total de la sección.
Tamaño:
El primer módulo que vamos a añadir será un módulo Imagen de Divi para colocar el logo del sitio web y lo configuramos así.
Tamaño:
Transformar:
El segundo módulo será un módulo Menú de Divi para contener el menú rotado que vamos a mostrar en este encabezado vertical con Divi.
Lo configuramos de la siguiente manera.
Fondo:
Diseño:
Texto del Menú:
Separación:
Transformar:
Y por último insertamos un módulo Seguir en Medios Sociales de Divi para mostrar unos íconos de redes sociales.
Íconos a incluir:
Hacer clic derecho sobre cada ícono y luego clic en Restablecer las funciones de artículo.
Alineación:
Para terminar añadir una nueva sección para crear un encabezado totalmente independiente para dispositivos Tablet y Teléfono, con el contenido y diseño de tu preferencia.
Visibilidad:
Espero que te hayan gustado. Dejame debajo un comentario contándome que te parecieron estas características y posibilidades de Divi.
Ayudame compartiéndolo para que más personas puedan aprender todo lo que se puede hacer con Divi.
Al momento de activar el constructor Divi se crea una nueva opción en el menú…
Divi es un constructor para WordPress que se instala como un si fuera un tema…
En esta guía te muestro paso a paso cómo crear una caja con información del…
En esta guía te muestro cómo cambiar el encabezado de la página home para que…
En esta guía vamos a ver cómo asignar con Divi un diseño diferente a entradas…
En esta guía te muestro paso a paso cómo crear un CV digital con WordPress…