En este post vamos a ver los diferentes diseños de header (encabezamiento, parte superior de la página web) disposición de logo y elementos de menú que podemos realizar con WordPress y la plantilla Divi. Para poder utilizar todas las funcionalidades que voy a comentar debemos tener por lo menos la versión 2.6 de la plantilla Divi para WordPress.
El diseño del encabezamiento o header será igual en todas las páginas del sitio web.
Ahora 20% de descuento Plantilla DIVI
->PLAN YEARLY ACCESS: El plan Yearly Access incluye la plantilla Divi + Plantilla Extra +3 plugins.
Este es un plan de renovación anual. Es decir, para seguir disfrutando de las novedades de Elegant Themes debes renovar el plan de año en año. La licencia te permite usar cualquier plantilla o plugin de Elegant Themes en todas las páginas web que quieras. El precio de este plan es de 89$ + IVA, pero con el descuento del 20% se te quedará en 70 $ + IVA
NOTA: Si al final de un año no renuevas el plan Yearly Access, podrás seguir utilizando perfectamente tu plantilla en las webs que la hayas instalado. Pero, no podrás actualizarlas.
Nota: Si compras desde América (México, Colombia, Argentina, etc) no se te aplicará IVA. Es decir, el precio final será de $70 con el descuento ya aplicado.
DESCUENTO 20% PLAN YEARLY ACCESS
->PLAN LIFE TIME ACCESS: El plan Yearly Access incluye la plantilla Divi + Plantilla Extra + 3 plugins.
Este plan se paga una única vez. Es decir, NO hay que renovarlo de manera anual. Podrás disfrutar de los recursos de Elegant Themes de por vida. La licencia te permite usar cualquier plantilla o plugin de Elegant Themes en todas las páginas web que quieras. El precio de este plan es de 249$ + IVA, pero con el descuento del 20% se te quedará en 199$ + IVA
NOTA: Si contratas el plan Life Time Access, en 3 años habrías amortizado el coste de renovaciones del plan Yearly Access
Nota: Si compras desde América (México, Colombia, Argentina, etc) no se te aplicará IVA. Es decir, el precio final será de $199 con el descuento ya aplicado.
DESCUENTO 20% PLAN LIFE TIME ACCESS
DISFRUTA DE TODOS MIS CURSOS PREMIUM POR SOLO 10€/MES
ÍNDICE DEL POST
2.- Diseño de menú NO Sticky con logo centrado y de grandes dimensiones con Divi
3.- Diseño de menú con logo situado a la izquierda, de la manera tradicional
4.- Diseño de menú con logo centrado situado encima del menú con Divi y WordPress
5.- Diseño de menú con logo en la línea de los elementos del menú con WordPress y Divi
6.- Diseño de menú tipo Hamburguer (Hamburguesa) deslizante con WordPress y la plantilla Divi
8.- Ocultar navegación hasta que haya desplazamiento
1.- DISEÑO DE MENÚ FLOTANTE, FIJO O STICKY (PEGAJOSO) VS DISEÑO MENÚ TRADICIONAL CON WORDPRESS Y DIVI
La plantilla Divi para WordPress nos permite dos grandes tipos de header o encabezamiento para una página web y/o blog:
1.1.- Diseño de header Flotante, fijo o sticky (Pegajoso):
En este tipo de encabezamiento de página web, el menú queda fijo cuando hacemos scroll hacia abajo.
Es decir, aunque bajemos con la rueda del ratón o con las barras de scroll del navegador, el menú no desaparecerá. El menú y el logo siempre permanecerán visibles.
Este tipo de header está bastante de moda, pues mejora la usabilidad del usuario, ya que éste siempre tiene a mano el menú de navegación de la web, que es “el plano” del sitio a través del cual el usuario se guía para dirigirse a las zonas fundamentales de la web.
El inconveniente que tiene este tipo de header es que disminuye el espacio de visión disponible para la web. Además hoy en día todos tenemos barras, favoritos y otros elementos en el navegador que reducen aún más el espacio de visión disponible para el usuario. Por este motivo es fundamental que la altura que ocupa el sticky menú sea lo menor posible. Luego veremos que la plantilla Divi nos permite incluso eliminar el logo cuando se produce el scroll de sobre la página, disminuyendo de esta manera la altura del sticky menú.
En la plantilla DIVI para WordPress por defecto está activada la opción de menú sticky o menú pegajoso.
En el siguiente apartado veremos cómo podemos desactivar esta opción.
1.2.- Diseño de header con menú tradicional (no sticky):
En este tipo de menú cuando el usuario hace scroll sobre cualquiera de las páginas del sitio web, el menú desaparece de la vista de éste. Para poder acceder al menú será necesario volver a hacer scroll, pero esta vez hacia arriba. Al llegar a la parte superior de la página el usuario volverá a ver el menú de navegación del sitio web.
SUPER DESCUENTO DIVI
Desactivar el menú sticky (Pegajoso) en Divi:
Como antes he dicho, por defecto en la plantilla Divi de WordPress viene activado el menú flotante, fijo o sticky (pegajoso).
Para desactivarlo debemos ir a: “Panel de administración > Divi > Opciones del tema”.
En la pestaña “General” tenemos una opción denominada: “Barra de navegación fija”. Aquí debemos poner el selector en “Desactivar”.
A continuación bajaremos a la parte inferior de la página y pulsaremos el botón de “guardar cambios”
Configurar la opción de menú pagajoso (sticky) con WordPress y Divi
2.- DISEÑO MENÚ NO STICKY CON LOGO CENTRADO Y DE GRANDES DIMENSIONES CON DIVI
En determinados tipos de páginas web a los diseñadores les gusta poner un logo de grandes dimensiones en la cabecera o header de las páginas del sitio web.
Para establecer el logo en la parte superior debemos subir un logo de grandes dimensiones. Dependiendo de la proporción puede ser de diferentes dimensiones. Con las proporciones de mi logo las máximas dimensiones posibles son aprox. de 870×261 px.
Logo de grandes dimensiones centrado
Subir logo
Para subir el logo debes ir a: “panel de administración > Divi > Opciones del tema”. Ahora en la pestaña general haremos clic en “Subir” en el apartado “Logo”. A continuación pulsaremos el botón de “Guardar cambios”.
Poner logo centrado
Para poner el logo centrado encima de los elementos del menú iremos a: “panel de administración > Divi > Opciones del tema”.
Ahora iremos a: “Cabecera y navegación > Formato de cabecera”. Aquí elegiremos la opción: “Estilo de cabecera -> Centrado”. A continuación pulsaremos el botón de “Guardar y publicar” de la parte superior.
Poner logo centrado en el header
Poner el logo a máxima dimensión:
Para poner el logo al tamaño más grande en Divi iremos a: “panel de administración > Divi > Personalizador de temas”.
Ahora iremos a: “Cabecera y navegación > Barra de menú principal”.
En el apartado: “Menú altura” seleccionaremos el máximo y en “Logo max altura” también seleccionaremos el máximo. A continuación pulsaremos el botón de “Guardar y publicar”.
Nota: si queremos aumentar un poco el margen entre el logo y los ítems de menú tendremos que recudir un poco el tamaño del logo con la opción “Logo max altura”.
Máximo tamaño para el logo
Como este tipo de logos ocupan mucha altura y disminuyen mucho el área de visión de la web tenemos dos opciones:
i.- Menú NO Sticky: sería necesario utilizar un menú del tipo NO sticky o pegajoso para que al hacer scroll el encabezamiento desaparezca y el campo de visión sea total. En el punto 1.2 puedes ver el proceso para configurar el menú como no pegajoso.
ii.- Menú sticky sin logo: si queremos poner el menú fijo, flotante o sticky (pegajoso) debemos establecer que el logo desaparezca cuando se comience a hacer scroll. De esta manera el menú quedará fijo, pero sin el logo que es lo que ocupa más espacio.
Para establecer que el logo desaparezca cuando se hace scroll debemos ir a: “panel de administración > Divi > Personalizador de temas”.
Ahora iremos a: “Ajustes de navegación fija” y marcaremos el check box: “Ocultar imagen de logotipo”.
Ahora pulsaremos el botón “Guardar y publicar” situado en la parte superior.
Ocultar logo en el menú flotante o pegajoso
3.- DISEÑO DE MENÚ CON LOGO SITUADO A LA IZQUIERDA DE LA MANERA TRADICIONAL
El tipo de header o encabezamiento que viene configurado por defecto en la plantilla Divi para WordPress es con el logo a la izquierda y los elementos del menú a la derecha.
Este diseño de encabezamiento puede ser flotante o no flotante.
En el apartado 1.2- hemos visto donde están las opciones para configurar un menú flotante o fijo, también denominado sticky (pegajoso)
Seleccionar el diseño de header tradicional con WordPress y Divi
Para seleccionar este tipo de diseño de header debemos ir a: “panel de administración > Divi > Personalizador de temas”
A continuación iremos a “cabecera y navegación > Formato de cabecera”. Aquí seleccionaremos: “Por defecto”.
A continuación pulsa el botón de “Guardar y publicar”
Nota: si no se ve el header correctamente ve a “Cabecera y navegación > Barra de menú principal” y modifica los parámetros de Menú altura y Logo Max altura.
Menú con logo a la izquierda e items de menú a la derecha
DESCUENTO DIVI
4.- DISEÑO DE MENÚ CON LOGO CENTRADO SITUADO ENCIMA DEL MENÚ CON DIVI Y WORDPRESS.
En el apartado 2.- hemos visto como configurar un encabezamiento con el logo centrado y situado por encima de los elementos del menú.
Además en dicho apartado hemos visto cómo poner un logo de grandes dimensiones con la plantilla Divi.
Para la parte que nos ocupa en este punto que es solo poner el logo centrado por encima de los elementos del menú en la plantilla WordPress Divi tendremos que:
Ir a: “panel de administración > Divi > Opciones del tema”.
Después iremos a “Cabecera y navegación > Formato de cabecera”. Aquí elegiremos la opción: “Estilo de cabecera -> Centrado”. Ahora haremos clic sobre el botón de “Guardar y publicar” situado en la parte superior.
Logo centrado en la cabecera de la web por encima del menú
5.- DISEÑO DE MENÚ CON LOGO EN LA LÍNEA DE LOS ELEMENTOS DEL MENÚ CON WORDPRESS.
Otra posible cabecera o header en Divi es poner el logo centrado en encabezamiento pero en línea con los elementos del menú. Es decir, el logo aparecerá en el centro del menú con elementos a la izquierda y derecha.
Logo en línea con los elementos del menú y centrado
Para configurar este tipo de cabecera debes ir a: “panel de administración > Divi > Personalizador de temas > Cabecera y navegación > Formato de cabecera “. Ahora, en “Estilo de cabecera” debes elegir: “Logotipo centrado en línea”
Si quieres hacer el menú tipo sticky (pegajoso) puedes combinarlo haciendo que el logo desaparezca cuando se comience a hacer scroll. Para ello deberás ir a: “panel de administración > Divi > Personalizador de temas > Cabecera y navegación > Ajustes de navegación fija”. Si marcas la opción: “Ocultar imagen del logotipo” esta desaparecerá cuando se comience a hacer scroll.
6.- DISEÑO DE MENÚ TIPO HAMBURGUER (HAMBURGUESA) DESLIZANTE CON WORDPRESS Y DIVI (SLIDE –IN HEADER)
Los menús tipo hamburguesa se pusieron de moda con la aparición de los smartphones. Seguro que has visto el típico botón formado por tres líneas horizontales. Eso es un menú tipo hamburguer – hamburguesa.
Menú hamburguesa o hamburguer
Los menús tipo hamburguesa se hicieron necesarios en las versiones móviles de los sitios web, ya que no era posible incluir todos los ítems de un menú de la manera tradicional y que se pudiera leer adecuadamente en el móvil. Al accionar el botón tipo hamburguer se desplegaba un menú vertical que si era fácil de visualizar en dispositivos móviles.
Poco a poco hemos ido relacionando el icono del botón tipo Hamburguer con un botón desplegable de menú.
Lo que ha ocurrido estos últimos años es que el hamburguer menú está tomando terreno también en las web visualizadas en ordenadores. El menú hamburguesa está de moda en diseño web.
Las principal ventaja del menú hamburguesa es que ofrece un diseño más limpio de la cabecera o hader de la web, y que su diseño vale para móviles y escritorio. El inconveniente es que puede haber personas que aún no sepan que al accionar ese tipo de botón aparecerá el menú de la web. Eso sí, cada vez son menos pues este tipo de menú está muy extendido en móviles, y hoy en día pocos no usan un Smartphone.
La plantilla Divi para WordPress (a partir de Divi 2.6) nos ofrece dos diseños de menú diferentes tipo hamburguesa. Vamos a ver en este punto el tipo deslizante y en el siguiente punto veremos el tipo pantalla completa.
Configurar menú hamburguesa deslizante (slide – in header)
En este tipo de menú, cunando accionamos el botón tipo hamburguer aparece deslizándose de derecha a izquierda un sidebar con los elementos del menú.
Para seleccionar este tipo de menú iremos a: “panel de administración > Divi > Personalizador de temas > Cabecera y navegación > Formato de cabecera”.
En “estilo de cabecera” seleccionaremos “Deslizar” y pulsaremos “Guardar y publicar”.
Diseño del menú slide – in header
Para personalizar el diseño del menú deslizante deberás acceder a “panel de administración > Divi > Personalizador de temas > Cabecera y navegación > Deslizar y Ajustes de título en pantalla completa” (este último apartado se crea nuevo al seleccionar este tipo de menú).
Personalizar el menú hamburguer deslizante Divi
7.- DISEÑO DE MENÚ HAMBURGUER (HAMBURGUESA) A PANTALLA COMPLETA CON WORDPRESS Y DIVI (FULL SCREEN HEADER)
Con WordPress y más concretamente con la plantilla Divi podemos crear otro tipo diferente de menú tipo hamburguer. En este tipo de menú cuando hacemos clic sobre el botón nos aparece el menú a pantalla completa.
DESCUENTO DIVI + REGALO CURSO
Configurar menú hamburguesa a pantalla completa o Full Screen Header
Para seleccionar este tipo de menú iremos a: “panel de administración > Divi > Personalizador de temas > Cabecera y navegación > Formato de cabecera”.
En “estilo de cabecera” seleccionaremos “Pantalla completa” y pulsaremos “Guardar y publicar”.
Diseño del menú hamburguer full screen header
Para personalizar el diseño del menú hamburguesa full screen header (pantalla completa) iremos a “panel de administración > Divi > Personalizador de temas > Cabecera y navegación > Deslizar y Ajustes de título en pantalla completa”.
8.- OCULTAR NAVEGACIÓN HASTA QUE HAYA DESPLAZAMIENTO
Otra opción que incorpora la plantilla WordPress Divi es la opción de ocultar el menú de cabecera hasta que el usuario haga scroll.
¿Qué sentido tiene esta opción? Esta opción puede ser adecuada cunado queremos poner una imagen grande como portada de la web y no queremos que esta pierda importancia al aparecer la cabecera del menú. Si ocultamos el menú en primera instancia conseguiremos dar a dicha imagen una relevancia absoluta. Cuando el usuario hace scroll para ver más allá de dicha imagen entonces aparece el menú.
Esta opción se puede combinar con cada uno de los tipos de header o encabezamientos de menú.
Configurar opción
Para configurar esta opción iremos a: “panel de administración > Divi > Personalizador de temas > Cabecera y navegación > Formato de cabecera”.
Para activar esta opción debemos marcar el check box: “Ocultar navegación hasta que haya desplazamiento”.
DESCUENTO DIVI + REGALO CURSO
9.- MENÚ VERTICAL
Aunque ya no son demasiado usados, también podemos usar un menú vertical con Divi. Para activarlo iremos a: “panel de administración > Divi > Personalizador de temas > Cabecera y navegación > Formato de cabecera”.
Ahora debemos marcar el check box: “Habilitar navegación vertical” y pulsar el botón de “guardar y publicar”.
Al marcar la opción de “habilitar navegación vertical” te aparecerá un nuevo check box denominado: “Orientación del menú vertical”. Con esta opción podrás elegir que el menú vertical aparezca en la derecha o izquierda de la web.
Cuando este menú se ve en formato móvil desaparece el sidebar y aparece un botón desplegable tipo hamburguesa.
Menú vertical con WordPress y Divi
Soy Blogger y formador profesional. Me gustaría que este blog te sirviera para conocer más de cerca el mundo del diseño web y de WordPress. Mi proyecto online es una plataforma de formación online tipo membership site, denominada cursotiendaonline.com donde podrás acceder a todos los cursos por solo 10 €/mes
Hola Joaquín!
Muchas gracias por todos tus consejos!
Quería preguntar si es factible separar un poco la lupa del menú (tengo activado el botón de búsqueda en el menú secundario) o incluso ponerlo en la izquierda. Supongo que con CSS pero no encuentro ningún código! No sé por qué queda a menos distancia que las propias palabras del menú… puedes ayudarme?
Por liarla más… si pudiese personalizar la cajita que se despliega cuando le doy a la lupa… ya sería la leche! jejeje
Mil gracias!
Hola Victoria,
Prueba a crear un código CSS con el identificador #et_top_search y a ponerle un padding a la izquierda (padding-left:) a ver que tal.
Me gustaría también invitarte a que eches un vistazo a mi plataforma de formación https://cursotiendaonline.com/ desde donde puedes Acceder a TODOS mis cursos online por solo 10 €/mes (Incluye ¡¡SOPORTE!!). En la plataforma tienes cursos sobre WordPress, Curso diseñador web Freelance, Cursos sobre Divi, Curso Woocommerce, Curso como crear una tienda online de éxito, Astra Pro, Elementor, Curso sobre idexación web y alta en google, Flatsome, Cursos sobre SEO, sobre Mailchimp, blog WordPress, etc. etc.
Hola. Necesito tu ayuda se oculto la opcion de Cabeceras y header en el menú de divi. Como puedo mostrarlas nuevamente? Porque pasa esto? Como dato no veo el menú en ninguna de las paginas.
Hola.
Imagino que te refieres a que no se muestran las opciones de personalización de la cabecera situadas en: «Divi > Personalizador de temas» de la plantilla Divi.
Es probable que te haya ocurrido esto porque hayas establecido un header, con el Theme builder, para la plantilla por defecto del sitio. Es decir, se aplicaría a todas las páginas de la web y por tanto ya no se mostrarían las opciones de personalización por defecto de cabecera de «Divi > personalizador de temas»
un saludo
Hola Joaquín, quisiera poder personalizar la cabecera con DIVI para que se muestre un segundo logotipo a la derecha, es decir, se tendría que mostrar logotipo principal + menú principal centrado + logotipo secundario.
¿Sabes cómo se puede hacer esto, he intentado hacerlo añadiendo en mi function el add_filter de et_html_logo_container para añadir los dos logotipos pero no consigo que el segundo me salga alineado a la derecha sin que se rompa el diseño.
Muchas gracias
Buenas.
Por el momento no es posible personalizar a ese nivel la cabecera de Divi. Pero, en breve divi va a sacar una nueva actualización en la que será posible diseñar un header con el page builder y luego añadirla al header de la web
Aquí tienes más info sobre el Divi theme builder:
Hola, muchas gracias por todos los artículos que entregas, son buenísimos!
Tengo una consulta, resulta que diseñe un sitio web, con menú personalizado letras en negrita y botón de llamado a la acción en el mismo. Resulta que cuando ingreso a la sección de BLOG y abro algún artículo de los que se encuentran en este, se desconfigura el menú personalizado, quedando como normal.
Cómo puedo solucionar este tema? Alguna sugerencia que me puedas entregar?
Quedo atenta,
Saludos!!
Hola Nicole.
Imagino que estás trabajando con Divi ¿verdad?
Cuando hablas de un menú personalizado, ¿te refieres a que los has personalizado desde Divi>Personalizador de temas? ¿ o te refieres a otra cosa?
Hola!! Primero muchas gracias por compartir, tu blog le tengo de referencia para consultar dudas de Divi, y me ha surgido una que no encuentro: Para una landing que no tiene menú ya que sólo es una página, ¿cómo puedo hacer para en el menú principal sólo aparezca el logo centrado? si dejo el menú principal vacio por defecto se me agregan las páginas home y política de privacidad y no sé como hacer para quitarlas. Y por otro lado si hay opción de que se monte encima el logo de la imagen de cabecera a pantalla completa que he puesto, es decir que en vez de estar el logo en la fila del menú se monte en la imagen de una imagen si se puede.
Muchas gracias!
Buenas,
En este post tienes más info sobre cómo crear una landing page
Hola! No consigo que se vea el menú en mi sitio web, he re-establecido la configuración de divi, desde luego tengo un menú primario, antes en esta plantilla aparecía el menú, pero desde que se instalo el certificado de seguridad, no se si tenga que ver o fue coincidencia, no aparece la barra de menú. Alguna sugerencia?
Hola Héctor,
En principio no tendría nada que ver con el certificado SSL.
Parece más, algún tipo de imcompatibilidad de algún plugin, o problemas con las versiones de wordpress y Divi.
hola paisano y tocayo, gracias por todo lo que aportas para que podamos aprender. Tengo una duda o una inquietud, y es como hacer que la siguiente sección al header se desplace hacia abajo, en modo Tablet o móvil, para que el menú no salga encima de esa sección cuando pulsar el icono del menú hamburguesa.
Uso DIVI
Gracias
Buenas tacayo.
Yo crearía una sección justo bajo el header, esta sección solo incluiría un módulo separador transparente para darle la altura necesaria. Finalmente configuraría esta sección para que solo se mostrara en móviles y tablet (en escritorio no se mostraría)
un saludo
Hola Joaquin, muy interesante tu post, pero a mi me gustaría No tener ese menú en Divi y crear otro en otra ubicación. He mirado por todos lados pero creo que no hay opción para desabilitarlo, o yo ya estoy tan perdido que no la encuentro. Se que por código se puede hacer pero no se como. Hay alguna otra opción? Gracias.
Buenas.
No, no hay ninguna opción en Divi para deshabilitar el menú principal.
Podrías, en cada una de las páginas no utilizar ni el header ni el footer (blank page)
hola. ¿Como podría hacer el menú top con la plantilla divi? Es esa fila delgada de menú en la parte superior de la web ( donde se pueden poner iconos de rrss , telefono, etc…)? Gracias.
Hola Jose,
lo puedes ver aquí: Crear menú con WordPress y Divi
Hola Joaquín. ¿Sabes cómo se hace un menú deslizable en móvil? Me refiero al menú que tiene Xataka por ejemplo (entrar en versión móvil): https://www.xataka.com/
¿Hay algún plugin o forma fácil de hacerlo? Me parece un menú genial porque puedes mostrar muchos enlaces con solo deslizar.
Gracias.
Buenas,
Con la plantilla Divi si puedes poner un menú tipo deslizante (horizontal), pero solo en versión escritorio. En la versión móvil, se abrirá de la forma habitual, que es deslizante hacia abajo.
No se si podrás hacerlo con algún tipo de plugin, echa un vistazo al plugin que se comenta en este post sobre mega menús en divi y haz una consulta en su soporte, a ver si es posible esa opción.
Hola Joaquin, como puedo hacer que el menú tipo hamburguesa se despliegue sin que se mueva toda mi página a un lado? de antemano gracias.
Hola Samuel.
Me imagino que te refieres al menú tipo slide-in, donde se despliega un menú lateral cuando se hace clic en el icono tipo hamburguesa ¿no?.
Cuando se despliega el menú, la web se desplaza, eso es inevitable.
Hola Joaquin, le he puesto color de fondo a mi barra de navegación pero cuando hago scroll (pegajoso) el color fondo vuelve a ser blanco, no siendo posible se vea el menu ya que elegí colores claros para el texto, puedo solucionarlo de algun modo?, agradezco la ayuda queme puedan brindar ya que no soy informática.
gracias
Hola Yisel,
La personalización del header en el momento de hacer scroll se realiza en: «Divi > Personalizacdor de temas > Cabecera y Navegación > Ajustes de Navegación fija«
Hola necesito ayuda con la cabecera que escogí la de deslizar pero como hago para agregar la lupa de buscar del lado derecho y un link.
Buenas,
Veo que ya tienes la barra de búsqueda en el menú tipo deslizar. Para poner un enlace, pues debes usar un «Enlace personalizado» del menú.
Info Menú WordPress
Buenas a todos, tengo una duda sobre un problema que no sé a que se debe.
A parte de los anuncios automáticos de adsense, he puesto tres bloques de anuncios para probar, dos de enlaces y uno grade display.
Mi problema es que en lo que he puesto manualmente, se ha puesto un fondo azul que ni sé como quitar. En el estilo de anuncio dentro de adsense para conseguir el código, tienen el fondo de color blanco e incluso he probado a poner fondos de diferentes colore pero sigue en azul en los tres anuncios.
Os dejo abajo mi web, son los bloques que he colocado en el lateral, el de enlaces debajo del las estrellas y el de texto en medio de la página. Los demás son automáticos.
Muchas gracias.
Buenas,
Utilizando mi navegador, No veo en tu web lo que comentas de los fondos azules. Además, eso podría deberse a algo relacionado con la plantilla que estás utilizando.
Buenas Joaquín.
Estoy armando mi nuevo sitio en DIVI y me gustaría tener un menu vertical, con submenu que se desplacen también verticalmente (desplegable). Al intentarlo veo que mi submenu aparecen de manera horizontal por defecto. Como puedo solucionarlo?
Desde ya muchas gracias.-
Buenas,
Veo en tu web que ya has encontrado la opción de Divi para crear un menú vertical. También te dejo estos post por si te son de ayuda:
Menú movil Divi
Mega menú Divi
Crear menú wordpress
Muy buenas Joaquin, me gustaría saber si se puede hacer el menú secundario pegajoso. Me gusta mucho que el header lo sea, y en éste caso necesito tener un menú secundario.
Gracias de antemano y gracias por tu trabajo.
Un saludo
Hola David,
Cuando el header o cabecera se hace pegajoso o sticky, el menú primario y secundario incluidos en dicha cabecera o header también permanecen flotantes.
Por lo que no entiendo bien a que te refieres
Aquí tienes más info sobre las zonas de ubicación de los Menú con wordpress (Divi)
hola, una pregunta creo no esta en tus menús un menú que usas en este blog, el menú donde esta de los tipos de menús, el menú te desliza sin cambiar de pagina, que tipo de menú es ese, y como se aplica en wordpress
Hola Diego,
No se muy bien a qué diseño de menú te refieres. ¿Me estás hablando del menú tipo slide-in que se comenta en el post, en el apartado 6?
Que tal, alguna manera de hacer menú vertical pero en sidebar pero que funcione el dropdown para subcategorias de woocommerce por ejemplo. Ya que con widget no funciona si lo implemento como menú. Y el cliente tampoco quiere que el menú vertical ocupe toda la pantalla de arriba a abajo.
te dejo el link de la web http://puntitobabyoutlet.cl
Hola Fabián,
La única opción de menú vertical en Divi la tienes en: «Divi > Personalizador de temas > Cabecera y Navegación > Formato de Cabecera» y luego el checkbox:
«Habilitar navegación vertical».
Te dejo también un post que te puede interesar sobre mega menús con Divi y otro sobre opciones de menú en móviles con Divi:
1.- Mega menú divi
2.- Menú movil con Divi
Buenas
Tengo una consulta tengo un sitio, donde hago el menu principal por default y además hago un menú secundario. El problema que tengo es q en el menú principal (hamburguesa en móvil)aparecen las páginas del menú secundario además de las del principal.¿ Cómo podría hacer para que no aparezca las pgs del secundario?. Mil Gracias !!
Buenas,
No hay ninguna opción en Divi, por defecto, para quitar los elementos del menú secundario del menú desplegable en móviles.
1.- Con el plugin Divi Booster si se puede hacer-> Plugin Divi Booster parte 3 (Mira el apartado 3.5)
2.- Tambíen te dejo este post sobre Divi y dispositivos móviles por si te puede interesar: Opciones de Divi para móviles
3.- También te paso este post sobre mega menús, ya que se puede personalizar para móviles-> Mega menús wordpress y Divi
Hola Joaquín! Cómo hago para añadir el teléfono y el email de la empresa en la parte superior de la cabecera? Gracias!
Hola Ángela,
Esa opción la tienes en: «Divi > Personalizador de temas > Cabecera y Navegación > Elementos de cabecera»
PD: Perdón por el retraso en constestar, estaba de vacaciones
Hola que tal el menú en responsive se ve muy largo dado que tengo muchas secciones habrá alguna forma de hacerlo mas simple como hacer un menú tipo acordeon?? Muchas gracias
Buenas,
Aquí tienes una guía de como hacer el menú movil colapsable.
Existen también plugins de pago, pero siguiendo esta guía te será suficiente:
Crear menú móvil colapsable con Divi
Hola Joaquin
Muy bueno el post, tengo una duda: he creado un menú sticky y me aparece en la página de inicio, hasta aquí bien. Ahora voy a crear la siguiente página , por ejemplo de contacto, ¿cómo lo hago para que me aparezca el mismo menú fijo en esta página también?
Gracias, saludos
Buenas Pedro,
Cuando haces el menú sticky o flotante, lo configuras para toda la web, sea cual sea la página del sitio. Por lo que no tienes que hacer nada para que este menú aparezca flotante en cada página.
Hola de nuevo, tengo otra duda.
He creado dos secciones de contacto diferentes dependiendo del dispositivo, es decir una para ordenador y otra para movil pero claro, si en el menú sólo tengo un botón de contacto cómo hago para que ese botón me lleve al contacto adaptado al ordenador y cuando estoy en el movil me lleve al contacto adaptado al móvil?
GRACIAS
Hola Irene,
Así no es posible hacerlo.
Tienes que tener una sola página de contacto que combine elementos de visualización para escritorio y movil (desactivando selectivamente las visualizaciones).
En los elementos del constructor Divi siempre hay opciones para desactivar la visualización del elemento en Escritorio, movil y/o tablet.
Por lo que deberás tener una sola página de contacto con elementos o bloques que se muestren en móvil y otros elementos que se muestren en dispostivos tipo escritorio (todos en la misma página). El navegador cuando esté ne móvil solo mostrará los elementos que no hayas desactivado para móvil y lo mismo con los elementos del divi builder para escritorio o tablet.
Buenas noches, creo que me estoy volviendo loca pero no sé cómo hacerlo. He leído que no se puede pero confío en tí 😀
Me gustaría poder cambiar el color del menú hamburguesa ya que solo me sale en azul y no puedo ponerlo en otro color. ¿Tiene solución?, ¿algún plugin que me recomiendes para personalizar el menú hamburguesa?
GRACIAS
Buenas Irene,
ve a: «Divi > Personalizador de temas > Ajustes Generales > Ajustes de formato». Ve al selector «Énfasis del tema», que aparece abajo del todo, y cambia el color.
Guarda los cambios, visualiza tu web
Hola Joaquin, gracias por todos tus aportes, han sido de gran ayuda, quisiera que por favor me ayudaras con algo, ¿Como coloco la barra de busqueda completa, con la frase «¿Que buscas?» y que este al lado del logo? ademas de un botón en la izquierda como esta web:
https://www.olx.com.co/Se que esto no se puede hacer desde las opciones de Divi, pero si desde css, sin embargo no se como hacerlo.
Te agradeceria enormemente que pudieras ayudarme
Buenas,
ese tema sigue sin estar resuelto en Divi.
Aquí te dejo una serie de enlaces a ver si te pueden ser de ayuda:
1.- How to Add a Search Field to Divi’s Secondary Menu
2.- Top Header Search Form & Custom Social Icons
Hola!
Queria preguntar si hay la opción de que un submenú de la cabecera sea ancho completo, del estilo de la cabecera y no un desplegable cómo sale.
Gracias
Buenas Anna,
No hay ninguna opción en el panel de adminitración para establecer la anchura del submenú (tendrías que hacerlo vía CSS).
En cualquier caso echa un vistazo a este post sobre mega menú con Divi. Además, en breve crearé un post con un plugin fremium para mega menú Divi, que es posible que tenga opcions como las que buscas.
Hola Joaquín,
Hace tiempo que conozco esta web, tienes muchos trabajos y de gran calidad.
El problema que tengo está en el menú secundario. Se trata de que el campo del telefono cree un enlace del tipo:
123456789. Del mimo modo que lo hace con el mailto…Lo podría hacer de forma manual añadiendo un enlace personalizado, con position absolute y left 0px pero no conseguiría el mismo nivel estético y la integración que conseguiría con divi, al mismo tiempo que tampoco tendría el icono ese tan bonito. Por lo que veo en esta web no está implementado, pero eso no quiere decir que no sepas como hacerlo!!
Muchas gracias por tu trabajo. Un saludo y un abrazo enorme!!
PD:si tienes mas portales de este estilo, no dudes en escribirme a mi mail y le echaré un vistazo encantado!!
Hola Vicent,
Efectivamene no lo tengo implementado en mi web.
Te doy dos opciones, a parte de la que comentas de poner un enlace personalizado.
1.- Plugin Divi Booster, tiene una opción para poner el enlace: https://divibooster.com/make-divi-header-phone-number-into-clickable-link/
2.- He encontrado un post que dice también como hacerlo haciendo alguna modificación en el código: Learn How to Make Phone Callable Link in Header
PD: mi otra web, es tiendaonlinemurcia.es
Buenos días.
Lo primero enhorabuena por tu blog, es muy completo. Tengo una duda, estoy utilizando el menú principal en la barra de cabecera y en el pie. En la cabecera cuando una opción de menú, tiene submemús funciona correctamente, en cambio en el pie al pinchar en la opción de menú, no se visualizan los submenus.
¿ puedes ayudarme?
Gracias
Hola Angel,
Por defecto la zona Footer del menú no muestra subcategorías. Supongo que será debido a que al estar tan abajo no se desplegarían bien las categorías.
Puedes utilizar el divi builder e incluir un menú en la parte inferior de la página justo encima del footer.
Un saludo
Hola Muy buenas. tengo un problemilla y es que en el teléfono el menú hamburguesa no se ve, la rallitas son del mismo color que la barra del menú. Sabes donde se puede cambiar el color de las rallitas. no lo doy encontrado. muchas gracias de antemano
Buenas,
No se si te tomará el color de enfasis del tema, que está en: «Divi > Personalizador de temas > Ajustes generales > Ajustes de formato > Color de énfasis del tema»
Prueba a ver
Buenas tardes,
quisiera saber si se puede personalizar la cabecera en divi para una pagina en específico. Es decir, que en la misma web, cada pagina tenga un color de cabecera distinto.
Hola Richard,
De modo general, no es posible tener un heder diferente para cada página.
Pero, es posible quitar el header y footer (blank page) y luego poner un módulo menú (sección de anchura completa) en cada página. Pero esto debe se probado y analizado porque puede tener otras problematicas, y puede ser que al final no te merezca la pena.
Hola Joaquín, gracias por el tutorial.
En nuestro caso, nos han encargado hacer algo como esto: http://www.bonicklandscaping.com/.
La particularidad de esta web es que es de tamaño fijo vertical, es decir, no tiene scroll, y el menú está en el pié de página y se despliega hacia arriba. ¿Sabes si se puede hacer esto con DIVI?
Gracias
Hola Carlos,
No, eso no se puede hacer con Divi.
He buscado la plantilla que estás utilizando (bonick-new) en esa web y parece que es una plantilla realizada a medida.
Seguramente tendréis que codificar. Pero, seguir buscando a ver si encontrais una plantilla que se parezca lo más posible.
Buenas, Gracias por el post es super completo.
Pero hay una cosa que me gustaría saber: ¿se puede hacer en wordpress un menu a dos niveles en el que aparezcan en el segundo nivel alas subcategorías sin deslizante?
Es decir algo así:
Inicio – Nosotros – Tienda
Producto 1 – Producto 2 – Producto 3
Siendo los productos subcategorías de la categoría Tienda.
Muchas gracias
Buenas,
No consigo entender muy bien a que te refieres. ¿Me puedes pasar una url de una web donde se muestre a lo que te refieres?
Echa un vistazo también a este post sobre creación de menús en WordPress, es posible qeu resuelva tu duda. En el se habla del proceso de construcción de un menú y también se habla de como mostrar subcategorías: Crear menú wordpress
Hola Joaquín.
Muchas gracias por este artículo.
A ver si me puedes ayudar: He creado el menú principal en el que algunas opciones tienen otro menú desplegables. Pues bien, esas opciones me muestra a su derecha un 3 en vez del símbolo que indica que hay un submenú.
Buenas,
pues es la primera vez que veo algo así,
¿tienes la plantilla divi y wordpress actualizados?
hola, como puedo aumentar en el menu desplegable divi tenga un ancho más alargado. no me refiero al menu hamburguesa. lo quiero en arbol pero cuando es largo, se crean 2 líneas y quisiera 1 línea tanto para menú principal como secundarios. alguna opción o en css adicional. gracias
Hola Jose,
no hay ninguna opción en Divi para poder aumentar el ancho del menú desplegable
¡Buenos días!
Acabo de iniciarme en este mundillo y estoy empezando con crear un blog en WordPress con Divi. Todo bien hasta que intento subir el logo, que me aperece la opción tal cual indicas, pero al pinchar en el botón de logotipo, no se me abre nada (ni directorio ni biblioteca) ¿Cómo podría solucionarlo? ¡Muchas gracias de antemano!
Buenas,
eso es muy raro,
parece algún tipo de incompatibilidad.
¿estás utilizando la última versión de wordpress y la última versión de la plantilla Divi?
Hola, tengo un problema, el menu de mi pagina en el ordenador es transparente, y en la version movil, cuando se desplega tambien es transparente y no se ve nada. Como podria cambiar solo el menu de la version movil, para que cuando se desplegue se vea en blanco o otro color?
Muchas gracias
Buenas,
ve a: «Divi > Personalizador de temas > Estilos para dispositivos móviles > Menú para dispositivos móviles» y personaliza las opciones:
i.- Color de texto
ii.- Color de fondo
Solucionado, muchas gracias!!
Hola Joaquín, gracias por tus tutoriales y comentarios.
Necesito saber si existe la posibilidad de que el Menu Desplegable esté escondido en el movil y solo se despliegue cuando uno clickea el item correspondiente.
Gracias
Buenas Juan,
El funcionamiento de cualquier plantilla para WordPress que esté optimizada para móviles (como sucede con Divi) funciona como tu describes. En el móvil aparecerá un botón tipo hamburguer (tres rayas horizontales) y cuando hagamos clic sobre el botón se desplegará el menú.
Buenas tardes, tengo un problema con los menús, empleo Divi Builder y el Tema Divi en WordPress.
Estoy creando una web donde muestro 3 marcas diferentes, cuando estas en el menú general la idea es que muestre un poco de resumen de las tres e información de la empresa (está en construcción aún). Posteriormente una vez que entras dentro de cada marca, aparece otro menú secundario correspondiente a cada marca, de momento solo lo he podido hacer con la marca Gaby, las otras están en blanco como puedas comprobar. El tema es que en el ordenador no hay ningún problema aparente, el error viene al visualizarlo con un dispositivo movil o tablet, dicho menú no hace nada al hacerle clic. En la versión movil aparece el menú principal, por así decirlo de la web genérica, y el menú de la marca en concreto, este es el que no deja accionarlo. Cual puede estar siendo el fallo de esto, ya que no he modificado contenido fuente ni css. Espero podáis ayudarme. Muchas gracias por vuestro tiempo!! Un saludo
Hola Enrique,
yo entro con el móvil en la página de gaby-charbachy,
y me funcionan perfectamente los items de menú: Inicio, colecciones y puntos de venta
Hoal . Me gustaría saber , si es posible en DIVI, como puedo poner la cabecera (logo+menu principal) debajo de un slider a pantalla completa, y no arriba como suele ser lo usual. Te adjunto un ejemplo de algo parecido a lo que quiero conseguir: http://www.purecommunications.com/
Un saludo y gracias
Hola Berto,
no hay ninguna opción en Divi para poder añadir un Slider de imágenes por encima del menú del header.
Lo único que se me ocurre, pero no es una solución definitiva, es utilizar en la home una página con atributos de página tipo «blank page» para que no aparezca el header y con el constructor poner un slider arriba y un módulo tipo menú debajo (con la blank page tampoco se muestra el footer).
En el resto de páginas de la web las pondrías poner un menú normal
Muchas gracias por tus post, me son de mucha utilidad!!
Con Divi me esta ocurriendo un problema, y es que configuro el menu sin dificultad, pero cuando añado páginas a mi wordpress y creo categorías con esas páginas y quiero que aparezcan en el menu, las páginas sólo muestran el menu secundario al hacer scroll y no el principal. No debería quedarse igual para todo el site? Me estoy rompiendo la cabeza y no se que más hacer poreur con las entradas no ocurre, sólo con las páginas!!! Me puedes ayudar?
Buenas,
entiendo que te refieres a que al hacer scroll en menú principal desaparece y solo queda fijo el menú secundario ¿es así?
es muy raro eso.
¿Podrías quitar el mantenimiento de la web para verlo?
Hola Joaquín!
Lo primero, darte las gracias por todo el contenido y explicaciones que compartes, son muy útiles!
Yo tengo un problema con el logo en la versión móvil. En la versión escritorio he conseguido un tamaño grande modificando la barra de menú principal, pero esto no se refleja en la versión móvil, en la que se ve enano. No sé ya qué más probar. ¿Cuál es el tamaño óptimo para esta imagen?
Aunque no es sobre este hilo, aprovecho para preguntarte por qué si subo la imagen con el tamaño exacto necesario para el icono de la página, me la recorta solo (ni modifica el tamaño, ni nada, porque se la subo exacta)? La imagen pasa a llamarse cropped-xxx y me fastidia.
Muchas gracias por adelantado!
Hola Marta,
gracias por tus comentarios,
a ver dime la url de tu web para que vea exactamente a que te refieres
No sé si puedes ver la diferencia del logo en el modo escritorio y en la versión móvil, recortando lo posible el logo es lo máximo que consigo. Antes se veía aún más pequeño. Los apartados de «altura menú principal» y «altura max logo» no me funcionan correctamente en la versión móvil. ¿Es cosa mía y que no sé usar la plantilla o hay algo más que debo tener en cuenta?
Muchas gracias!
Solo hay esas dos opciones que comentas para el tamaño del logo.
Es cierto se ve bastante más pequeño en el móvil, pero sinceramente yo no lo veo mal de tamaño. Piensa en la proporción entre la altura de pantalla de un ordenador y de un móvil.
Realmente en proporción a al altura total de visión yo creo que sale más grande el logo del móvil y piensa que si fuera más grande aún en la primera visión de la página a través del móvil se vería poco espacio disponible bajo el header.
Hola, qué tal.
Tengo un problema con el menu divi.
Lo tengo con el estilo de fuente Abel y en vertical. Cuando paso de un enlace a otro en el menú, al dar click, e ir hacia la página que dirige el menú, estos se cambian de estilo unos segundos y hace un efecto extraño en los enlaces.
A qué se debe, se puede solucionar?
Gracias y un saludo
Hola Inma,
eso seguramente será un pequeño bug en la plantilla,
lo mejor sería utilizar la última versión de la plantilla a ver si se ha solucionado el problema, e informar a través del foro a Elegant themes sobre ese bug para que si aún no lo han resuelto en la última versión de la plantilla
Y, ¿si sólo quiero eliminar la cabecera de una página pero que aparezca en las restantes? He aplicado css pero elimina la cabecera en todas 🙁
Saludos
Hola,
La manera más sencilla es elegir en la página en cuestión «Atributos de página > Plantilla» seleccionar «Blank Page» en vez de «plantilla predeterminada». Eso hará que no se muestre ni header ni footer. Si quieres mantener el Footer, pues puedes crearlo con el mismo constructor para que quede lo más similar al footer del resto de páginas.
Si quieres eliminar el header vía CSS es más complicado, tendrás que probar códigos e identificar la página. Te dejo un enlace a ver si te sirve:
Remove header for specific page
Hola Joaquín, gracias por tus posts, realmente son de gran ayuda.
Tengo un problema con el menu desplegable. Cuando se activa el menú sticky, el texto de los links desplegables me aparecen en un color oscuro y no blanco como en el menú original…
Muchas gracias y un saludo
Buenas Juan Carlos,
El color de los items del menú principal pueden ser diferentes en los desplgegables, ve a: «Divi > Personalizador de temas > Cabecera y navegación > Barra de menu principal»
Aquí tienes dos opciones para los colores de los elementos del menú:
a.- Color de texto: color de los items del menú de la barra de menú principal
b.- Color de texto de menú desplegable: color de los items del menú desplegable
Quiero incluir en el elemento de cabecera (top header) un icono para que los clientes pueden chatear mediante Whatsapp utilizando una imagen con el link tipo:
https://api.whatsapp.com/send?phone=15551234567Como podría insertarlo?
Hola Álvaro,
puedes insertar el icono con el resto de iconos de redes sociales pero tendrías que utilizar Divi Booster,
aquí tienes más info: Añadir iconos con Divi Booster
hola quiero el menu que tiene el logo en el medio como hago para comprarlo?
Hola Agotina,
La opción del menú con el logo en medio ya viene incluida en la plantilla Divi (plan de elegant themes), por lo que si ya la tienes no tienes problema.
Si no has adquirido ningún plan de Elegant themes deberás adquirir uno.
Aquí tienes un enlace con los descuentos en los planes de Elegant themes (para adquirir divi)
Hola Joaquín
Muchísimas gracias por los post. Son realmente interesantes y sobretodo útiles. Mi pregunta es… el logo del menú principal me desaparece en las versiones de tablet y móvil. En la versión de ordenador lo tengo colocado a la izquierda. La verdad es que me está volviendo loco y no encuentro la solución.
Otra posibilidad que había valorado era colocar el menu en el secundario (superior derecha) y dejar solo el logo en el principal, pero por defecto me aparece en el menú una página de inicio que no sé como quitarla.
A ver si puedes darme una respuesta. Muchas gracias y saludos.
Hola Joxhe,
gracias por tus palabras,
1.- es realmente raro lo que me comentas, ya que el logo debería aparecer en la versión tablet y móvil.
Además no recuerdo que haya ninguna opción para ocultar el logo en móviles y tablets.
Prueba a poner otros diseños de header y comprueba si te sigue ocurriendo lo mismo
2.- En cuanto a lo que comentas de quitar los itemns del menú principal, te ocurre eso porque la plantilla no permite dejar el menú vacio sin ningún elemento.
Hola Joaquín.
Muchas gracias. Rápido, rápido… un gustazo.
Hola, Saludos, Joaquín. No sé si ya habrás hablado de esto en algún lugar de tu web.
Quisiera quitar en el menú para versión móvil la frase «seleccionar página» y poner otra más personalizada. ¿Cómo podría hacer eso?
Muchas gracias.
Hola,
eso se puede hacer con el plugin Divi Booster,
aquí tienes una guía con algunas de las opciones que tiene. Localiza tu opción (5.18) y haz clic para ir al post que explica en detalle la opción de quitar la frase «seleccionar página» en la versión movil de Divi
Guía Divi Booster
Aún no tengo explicadas todas las opciones del plugin ya que tiene más de 90
Gracias por tu rápida respuesta. Un gustazo tu trabajo
A ti,
Un saludo
Hola Joaquin,
mi duda es la siguiente: los enlaces del menú se me quedan de color azul cuando estoy dentro de la página a la que quiero ir, y no puedo cambiar el color. Lo tengo configurado en color negro, pero cuando están activos, se quedan en azul. Estoy usando Divi 2. Cuál sería la solución? Gracias paisano!!
Hola Isabel,
hace mucho que no trabajo con Divi 2, te digo donde esta la opción que buscas en Divi 3 que seguramente será practicamente igual que en Divi 2.
Ve a Divi > Personalizador de temas > Cabecera y nevegación > Barra de menu principal» y buscar «Color de enlace activo» y establecer el color que quieras cuando un elemento del menú está seleccionado.
Hola,
Desde que actualicé a la versión 3.0 de Divi, la barra del menú solo me aparece en la página Home, en el resto no me aparece. ¿Que puedo hacer?
Gracias de antemano
Vale…el problema era que tenia el menú en scroll y no lo veía si no bajaba la pantalla.
Otro problema que tengo es que al actualizar a divi 3.0, el logo ha desaparecido de la barra de menú y me aparece una cuadrado azul con un interrogante. Leyendo el tutoríal que has subido no soy capaz de volver a «subir el logo»….
Buenas,
para subir el logo debes ir a: «Divi > Opciones del tema» y luego botón «subir» en el apartado del logo
Hola,
Lo primero decirte que en general me gusta tu web y es muy útil tu post,
Aún así tengo dos dudas referentes a los menús de Divi que no he podido solventar en ningún sitio, a ver si tu lo sabes:
1º) En el menú, cuando hay submenús desplegables, sale por defecto el icono de una V o flecha junto al texto.
Ej: Contacto V
¿¡Dónde se quita esa flecha!?
2º) Es posible cambiar los margenes y espacios preestablecidos en los submenús? En Divi vienen muy separados los items del submenú y tampoco encuentro como cambiarlo. Ej:
menú V
Submenú 1
Submenú 2
Submenú 3 (reducir los espacios/margen entre submenu 1,2 y 3)
Si no hay solución usando solo Divi, pero sí con CSS o tocando algo más y me sabes orientar sería genial
Saludos y felicidades por tu trabajo 🙂
Buenas,
1.- Para quitar la punta de flecha «v» de los menús desplegables de Divi tendrás que utilizar CSS. Realiza la búsqueda «remove divi little down arrow drop down menu» en Google y te saldrán varios resultados a este respecto como por ejemplo este: Remove divi down arrow
2.- Para reducir la distancia entre los items del menú desplegable también tendrás que utilizar CSS.
Echa un vistazo a esta página donde se habla en los comentarios sobre este tema: cambiar separacion items menú desplegable
Hola Joaquín, lo primero gracias por tu ayuda.
Mi primera consulta está solucionada: efectivamente con el CSS he eliminado la flecha del menu desplegable, perfecto.
Sin embargo con mi segunda pregunta no ha habido exito. (cómo reducir la separación de los items del menu desplegable de Divi)
He consultado los comentarios del enlace que me dejas pero no he encontrado una solución clara entre ellos, aún así lo he intentado: he hecho una copia de seguridad del archivo style.css y he tocado lo que ponían en los conmentarios con todas las variaciones posible, sin éxito. Lo he dejado todo igual de nuevo :/ así que he acabado de nuevo aquí ¿alguna idea?
Por si te ayuda: tengo instalado Divi y creado un tema hijo. La hoja de estilos que he estado modificando sin éxto es la del Divi, ya que la del tema hijo está vacia.
Un saludo!!
Buenas,
la separación entre items de menú con Divi solo se puede modificar haciendo modificacione a nivel de CSS,
Mi recomendación es que los cambio lo hagas en el tema hijo o en el apartado de «opciones del tema» que la plantilla deja para ello, ya que si haces cambios en la plantilla padre tendrás que volver a hacerlos siempre que actualices la plantilla Divi
He visto por ahí un vídeo que a lo mejor te sirve de ayuda: modificar el menú de divi
Hola! Tengo 2 botones colocados uno al lado del otro (hasta ahí bien), pero me gustaría que en smartphone me apareciese así y no uno debajo de otro. Hay alguna posibilidad de hacerlo? Muchas gracias!!
Hola Ivan,
no es posible, las columnas que en escritorio se ven una junto a la otra, pasan en versión móvil una encima de otra.
Hola disculpe fijese que necesito colocar un texto y un logo de whatsap en el header de la barra principal como le haría disculpe muy agradecido con su ayuda.
Hola Oscar,
para colocar el texto utilizaría un item de menú que no llevara a ningun sitio, utilizaría un «Enlace personalizado» con destino «#».
Para poner un icono de whatsapp utilizaría Divi Booster.
Un saludo
Hola Joaquin como estas?
estimado tengo una duda
tengo problemas con el menu de inicio
el constructor visual solo me aparece en las siguientes pestañas y no en el inicio
dentro de la estructura del menu
me dice: enlace permanentey no pagína sera ese el problema
por favor Help!
saludos
Hola Ignacio,
no entiendo a que te refieres,
por favor dame una descripción más detallada de tu problema
(hasta el lunes no te podré contestar)
Hola Joquin se que esto que te preguntare no tiene nada que ver con tu tema que esas explicando pero quisera saber como puedo poner un witget invisible en un smartphone si ocuapo la plantilla divi podrias ayudarme con esta duda
Hola Jehieli,
echa un vistazo a este pluign denominado Widget Options,
te proporcionará diferente opciones de visibilidad de cada uno de tus widgets, podiendo ocultarlos en escritorio, tablet y/o smartphones
Gracias que me ha resultado muy bien
Hola Joaquín,
Muchas gracias por tus publicaciones, he aprendido mucho con tu blog!
Tengo una web con cabecera con iconos de facebook y pinterest, pero en la versión móvil esta cabecera y los iconos desaparece.
Sabes como puedo hacer que se muestre?
Hola Nuria,
con el plugin Divi Booster entre otras muchas personalizaciones de la plantilla Divi se puede hacer que los iconos de redes sociales aparezcan en la versión móvil de la web como puedes ver en este post: Divi booster parte 1 / opciones con iconos
Muchas gracias por responder tan rápido! instalé el plugin de Divi booster, pero el menú secundario de navegación no se muestra en tablet y móvil, no encuentro la forma de mostrarlo. ¿sabes cómo hacerlo?
Supongo que cuando consiga mostrarlo y con el check activado de social icons en móviles ya se verá correctamente.
Gracias!
Hola Nuria,
1.- Los elementos del menú secundario aparecen en el menú móvil justo debajo de los elementos del menú principal. Es decir, en móviles se fusionan los elementos del menú secundario y principal en un menú único.
2.- Si quieres que los iconos de redes sociales se muestren cuando la web se visualiza a través de móviles tienes que marcar la opción de Divi Booster: «Header > Top Header > Show secondary nav bar social icons on mobiles» como puedes ver en este post
Buenas tardes
Cómo puedo centrar el logotipo en modo deslizar ya que se queda a la izquierda
Gracias
Un saludo
Hola Ángel,
no existe en Divi una opción para centrar el logo cuando se elige la opción de de diseño de menú deslizar.
Buenas quisiera saber como dejo el menu fijo en el mobil ya que estoy utilizando este tema para mi agencia de publicidad y no se como hacerlo.
Gracias
Buenas,
en la web que mencionas no estás utilizando Divi,
en cualquier caso no hay una opción en Divi para que el menú se quede fijo o flotante cuando se visualiza la web en móviles,
pero te he encontrado un post donde se explica como hacerlo a través de código-> Menú foltante en móviles
Hola, se puede dividir en divi el menu en dos lineas?
Hola Ana,
por defecto cuando no caben todos los elementos del menú en una primera línea aprace una segunda línea en el menú, pero no podemos hacer una división voluntaria del menú en dos líneas.
Otra opción que tienes es utilizar la zona de menú principal para un menú y la zona del menú secundario para otro menú, apareciendo de esta manera dos líneas de menú.
Hola Joaquin,
Enhorabuena por tu post, es magnífico.
Como veo que sabes bastante de Divi, me ha surgido una duda.
Tengo puesta una imagen de fondo como cabecera en el blog, para ello he tenido que incluir el blog en una página y cada post tiene la misma cabecera, ya esta cabecera es global.
Mi problema surge cuando hago una busqueda en el buscador del blog, la búsqueda es correcta pero me aparece en una página sin la cabecera y como si fuera el blog que viene por defecto y no encuentro donde editar esa página.
Como puedo hacer para mantener esa cabecera. He pensado en buscar el archivo .php de plantilla base para el blog e incluir la cabecera, pero me parece bastante complejo ya que es php.
Muchas gracias por tu ayuda.
Un saludo
Buenas,
la página de resultados de búsqueda del widget efectivamente usa la página tipo blog estándar y no una página personalizada de Divi.
La única opción que se me ocurre es la que tu dices, modificando directamente el php. Tendrás que hacer una copia de seguridad e ir haciendo pruebas
Hola, tengo una duda cuando creo un menu en Divi, a la hora de verlo en el móvil no se me queda la hamburguesa a la derecha, se me queda por debajo del logo y me sale la opción de elegir página.
Podrías decirme como se hace para que no salga eso de elegir página?.
Gracias
Hola Roberto,
seguramente te ocurre eso porque no estás utilizando una de las últimas versiones de Divi,
prueba a añadir el siguiente código a tu tema hijo y si no tienes tema hijo añadelo en «Divi > Opciones del tema > CSS Personalizado»
.select_page { visibility: hidden; }Con el plugin Divi Booster, se puede personalizar ese texto.
Hola, tengo marcada la opción de menú fijo, pero al hacer scroll se ve únicamente el enlace activo, el resto del menú desaparece y se ve sólo el fondo. Sabes por qué puede ser?
Saludos
Buenas,
que raro,
parece algún problema de incompatibilidad de la plantilla con algún plugin o con wordpress,
1.- yo probaría primero a ir desactivando plugins uno a uno y probando a ver si se soluciona el problema, para saber si hay algún plugin que esté entrando en conflicto con la plantilla Divi.
2.- En caso de que lo anterior no funcionara, haría una copia de seguridad y procedería a actualizar plantilla, wordpress y plugins.
Un saludo
Genial, voy a probar con esas opciones.
Ya que estoy te hago una consulta, estoy probando all import pro para woocommerce. Lo que me pasa es que tengo un archivo que tiene 700 registros, si lo subo completo, los productos se suben como si fueran simples, con el mismo nombre y sus respectivos atributos. Si lo divido y subo un solo producto, que tiene 200 registros aproximadamente debido a todas sus variaciones, se carga bien, es decir, un solo producto y todas las posibilidades en un desplegable. No se si me expresé bien pero si es así y si tenes alguna idea al respecto te agradecería!
Saludos!
y mil gracias!
Hola Del,
no conozco el plugin que mencionas, yo lo que haría sería plantear el problema que tienes al creador del plugin. Seguro que tiene un foro para resolver dudas y problemas.
Hola!
muchas gracias por su blog! me gustaría saber si se puede hacer como puedo centrar los datos en el menú secundario de divi, gracias
Hola Gisela,
Por el momento Divi no tiene ninguna opción para centrar el contenido del menú secundario,
pero puedes probar a introducir es siguiente código en: «Divi > Opciones del tema > General» y luego el campo «CSS Personalizado»
/* Centrar menú secundario */#et-info {float: none !important;text-align: center;}Si tienes un tema hijo o child theme también puedes usarlo para introducir el código (sería en el archivo style.css)
Un saludo
Saludos Joaquín.
Genial tu ayuda!!!
Estoy usando DIVI en su última versión.
He creado un menu con varios niveles (Menu 1->Submenu 1->Sub-Submenu 1).
Todo funciona genial hasta que lo lanzas en Móvil, ya que al pulsar el cuadrado azul rayado, aparecen todas las opciones del menu desplegadas con todas las opciones
¿Se puede hacer que solo aparezcan los niveles Menu 1 y pulsando desplegar Submenu 1 y así sucesivamente?
Gracias anticipadas
Hola Juan Carlos,
en este momento Divi no tiene la opción de mostrar un menú móvil como el que comentas,
pero existe algún plugin para añadir esa funcionalidad al menú.
échale un vistazo a este plugin
Un saludo
Joaquin, Muchas Gracias!!
hola estimado como elimino por completo las pestañas del menu divi. sucede que al instalar woocommerce, me quedan permanentes las pestañas home y carrito. y ya elimine esas paginas que estaban hechaspero todavia aparecen en la presentacion de la pagina. como las puedo eliminar del header,php o de otra forma? saludos cordiales.
Hola Ale,
Para eliminar la pestaña home o inicio elimínala del menú.
Para eliminar el carrito prueba a poner el siguiente código en el archivo style.css de tu tema hijo
.et-cart-info { display:none; }Un saludo
Hola muy interesante tus explicaciones, pero tengo una duda con el menú hamburguesa, como puedo manejarlo en versión desktop con un efecto Style Slide-In Gradient no quiero que se desplace a la derecha si no que flote encima de la pagina, agradecería mucho si me puedes indicar como hacer esto ..
Hola Mauricio,
Por el momento solo existen en Divi los tipos de menú que se mencionan en el post. Es posible que con próximas actualizaciones añadan nuevos tipos de menús.
Buenas tardes, no estoy trabajando con DIVI pero tal vez me puedas ayudar. Como puedo hacer para que en un wordpress, en la versión movil, el menú aparezca ya desplegado?
Un saludo y gracias
Hola Cesar,
no es nada habitual ver sitios webs donde el menú aparezca desplegado en versiones móviles, por lo que no creo que muchas plantillas incorporen dicha funcionalidad. La posiblidad de que aparezca el menú desplegado en la versión móvil de la web depende totalmente de la plantilla wordpress utilizada.
En el caso de Divi no incorpora esa funcionalidad, en el caso de tu plantilla no lo se. Tendrás que consultarlo con los desarrolladores de la plantilla que estés utilizando.
Un saludo
hola
estoy trabajando con divi y cuando redusco el tamaño de la pantalla a la mitad el header cambia a estilo hamburguesa y prefiero que no pase
como puedo hacer?
gracias
Hola Kristian,
El Header de Divi pasa a un icono tipo hamburguesa debido a que Divi está optimizada para dispositivos móviles. Si en un móvil no ves un icono tipo hamburguesa sino que ves todos los items del menú esa web no estará optimizada para móviles.
Lo que quiero decir es que ese comportamiento es importante que sea así para que la web esté optimizada para dispositivos móviles (smartphone y tablets), con los consiguientes beneficios a nivel de experiencia de usuario y de SEO.
Un saludo
Estupendo post!
Es posible mantener el menú secundario fijo y que el principal aparezca en el desplazamiento como menú hamburguesa?
Hola Jorge,
No, los dos menús se integran en los dos menús tipo hamburguesa de que dispone la plantilla Divi. No es posible dejar fijo uno de los menús.
Hola Joaquín,
Tengo un problema con el menú cuando accedo desde móvil o tableta.
Debajo del logo, me sale una ‘pastilla’- un recuadro gris- que dice «Seleccionar página, con el menú hamburguesa.
Yo solo quiero que salga el menu hamburguesa, sin más, no dentro de ese recuadro con esa leyenda… Cómo puedo quitarlo?
Muchas gracias
Hola Ana,
Yo estoy utilizando la última versión de Divi y no me aparece el texto de «Seleccionar página» junto con el item de menú hamburguesa en la versión móvil.
Por lo que mi primera recomendación es que actualices la plantilla a la última versión.
Si no consigues eliminar el texto «Seleccionar página» del menú de la versión móvil de Divi deberás añadir el siguiente código css.
.select_page { visibility: hidden; }Si dispones de un tema hijo o child theme lo ideal es añadir el código css en el archivo style.css del tema hijo de Divi
Aquí tienes más info sobre las opciones que tienes para eliminar el texto de «seleccionar página» de Divi
Hola! me gustaría saber si se puede hacer que el menú secundario se despliegue en móviles. No encuentro como hacer ya que en versión movil solo me aparece el correo. Gracias!
Hola Asier,
el menú secundario de despliega junto con el menú principal. Es decir, cuando haces clic en el icono tipo hamburguer del móvil te aparecerán los items del menú principal y del menú secundario.
Un saludo
Hola, tengo un problema como en el menú principal a la hora de visualizarlo en el móvil, y es que al lado del icono hamburguesa me aparece la frase «seleccionar página». ¿Sabes alguna manera de quitarlo? Gracias.
Hola Dani,
que yo sepa no hay ninguna opción en la configuración de Divi para eliminar ese texto que aparece en móviles junto al icono del menú hambuerguer de la plantilla Divi.
Tendrías que ver que clase CSS es la que lo define y crea una regla para que no aparezca y ponerla el archivo CSS, lo que sucede es que saber la regla es más complicado ya que no aparece el texto cuando se visualiza en el ordenador.
En cualquier caso échale un vistazo a esta página donde dice como añadir un texto previo al botón menú movil en la plantilla Divi, es posible que esta regla CSS te sirva para modificar el texto actual por un texto en blanco
Un saludo
He creado un nuevo menú para incorporarlo a la página Blog con las categorías de este.
Lo que pasa es que estos menús se abren por defecto en una pestaña nueva, como puedo cambiar esto para que se abran en la misma página.
Muchas gracias
Hola Guzman,
Para gestionar como se abren los items del menú, en «apariencia > menus», haz clic en «opciones de pantalla» y marca para que se visualice la opción «Destino del enlace». En cada elemento del menú te saldrá un checkbox para decidir si el item se abre en una nueva pestaña o en la misma.
Un saludo
Tengo un problema con las entradas del blog y las páginas de aviso legal etc pues al no tener ningún encabezado y fondo blanco no se visualizan correctamente.
Como puedo cambiar el fondo, por lo menos a las entradas, simplemente sería sustituir el color de fondo para estas.
Si sabes algo y tienes ganas te lo agradecería.
Muchas Gracias
Buenas,
no hay opción para modificar el color de fondo de las entradas de blog,
para modificar el fondo de todas las entradas y páginas tendrías que modificar el codigo CSS de la plantilla o añadir nuevas reglas CSS en el tema hijo (si lo tienes).
Yo probaría con
#main-content{background-color: #000;}por ejemplo para poner el color negro de fondoUn saludo
Muchas Gracias Joaquin,
No me he explicado con claridad, lo que necesitaba es que se cambie el color de fondo del menú principal cuando se accede a las entradas y las páginas por defecto por que las letras son blancas y el fondo también.
Dispongo de tema hijo pero no se como implementar esto únicamente para que cambien el menu en los post y en las paginas que tengo de aviso legal, etc.
En este tema hijo premium sí que lo tienen http://www.sawebsolution.de/Projects/TTheme/
Muchas Gracias
Hola Guzman,
Ahora entiendo lo que quieres decir,
he estado buscando documentación en ingles de Divi a ver si encontra a alguien que ya lo hubiera realizado, pero no he encontrado nada.
En cualquier caso estaré atento al blog en inglés de elegant themes y si encuentro algo lo comentarñe en este post.
Un saludo
hola buenas noches mi pregunta es la siguente mi pagina web creada con divi es totalmente en blanco, pero me gustaría eliminar la linea gris que marca el fin de la cabecera
me gustaría eliminarla que no se diferencie la cabecera del resto. gracias
Hola Fernando,
no existe en el panel de adminitración de la plantilla ninguna opción para quitar esa línea.
Tendrías que modificar CSS código de la plantilla
Un saludo
Muchas Gracias Joaquín, si encuentro una solución lo publicaré en el post
Hola de nuevo Joaquín. ¡Enhorabuena por el post!
Soy incapaz de eliminar el menú secundario. No tengo ningún menú asignado a ese menú secundario pero aun así me aparece siempre.
¿Como puedo quitarlo?
Muchas gracias
Hola Antonio,
Asegurate que en el campo para poner el teléfono y el email están vacios
Un saludo
Hola Joaquín, gran aporte. Tienes idea de si se pude Eli a rendir el. E u hamburguesa para los dispositivos móviles? Es decir, usar el tradicional para las tablets por ejemplo?
Hola Yohad,
No se entiende muy bien tu comentario, por favor escríbelo otra vez
gracias
Hola Joaquin,
¿Se puede desactivar el menú, pero solo en la versión responsive?
Muchas gracias,
Un saludo,
Juan Jose
Hola Juan José,
entiendo que te refieres a la versión móvil,
el menú principal no se puede desactivar solo en móviles pero si el módulo menú. El módulo menú como cualquier otro módulo del page builder se puede desactivar de manera selectiva en Escritorio, tablet y/o móvil.
Un saludo
Gracias Joaquin,
El menú del modulo menú no se queda fijo en la versión ordenador y no integra el logo (o yo no he dado con ello) y esa parte del menú «de serie» si me gusta.
Al final lo que he hecho para quitar el menú de la versión móvil es ocultarlo haciendo que los colores de texto y fondo sean transparentes, un poco chapucilla pero sigo manteniendo el logo
Hola Juan José,
efectivamente el módulo menú no tiene las características de crear un menú flotante, sticky o pegajoso. Efectivamente, tampoco incluye un logo ya que está pensado para ser un menú complementario al principal.
Bien hecho, ¿has tenido que modificar CSS?
Un saludo
No, lo hice desde Divi -> Personalizador de temas -> Estilos para dispositivos móviles -> Menú para dispositivos móviles -> cambiar a transparente.
Tenia la opción de quitar el menú totalmente con este CSS,
#main-header { display:none; }
#page-container { padding-top:0px !important }
Pero también desaparece en la versión de ordenador, claro.
Gracias por todo y volveré al ataque, estoy empezando en esto del WP y Divi y seguro que te preguntare algo mas.
Muchas gracias por compartir
Un saludo
Hola Joaquín.
Tengo 2 asuntos con la plantilla que no sé cómo solucionarlo.
-Quito el logo de Divi y en el pc no se ve pero cuando lo miro desde mi teléfono sigue apareciendo. ¿Qué puedo hacer?
– Estoy subiendo una imagen enlazada a una web y por más que cambio el tamaño de la imagen, me sigue apareciendo muy pequeña. He cambiado el tamaño desde GIMP, Paint.net y también desde el panel de wordpress/Divi pero nada.
Si me puedes ayudar te lo agradecería mucho.
Muchas gracias.
Un saludo.
Yanire
Buenas,
1.- ¿Te refieres a que sustituyes el logo Divi por uno propio y este no se muestra en el móvil pero si en el pc?
2.- ¿Cómo estás subiendo la imagen? ¿estás utilizando el módulo imagen? ¿que distribución tienes de columnas en la fila donde estás insertando la imagen?
Un saludo
Hola, excelente artículo. Es posible quitar el menú hamburguesa sin eliminar el menú principal?
Hola Ramón,
No entiendo bien a que te refieres. Puedes utilizar otro tipo de menú que no sea el menú tipo hamburguesa. Si te refieres a si se puede tener la barra de menú principal sin ningún tipo de elemento de menú, creo que no es posible.
Un saludo
Hola Joaquín.
Estoy intentando modificar la cabecera (en este caso la tuya azul donde aparece teléfono y mail y además unos enlaces: DESCUENTO PLANTILLA DIVI y CURSO WORDPRESS ONLINE DIVI) Y no encuentro cómo hacerlo, es decir meter los enlaces como los tuyos.
Gracias de antemano
Hola Emma,
para meter enlaces en la barra de menú secundario, tienes que ir a Apariencia > menús y crear un nuevo menú. Añade los elementos que quieras al menú y marca la opción «menú secundario», a continuación guarda los cambios.
Para personalizar el diseño de este menú ve a «Divi > personalizador de temas > Cabecera y navegación > Barra de menú secundario».
Un saludo
Hola Joaquin…
Gracias x las explicaciones,… me parece interesante el tema del DIVI.
Queria saber que si la barra azul que aparece arriba del header es propia del DIVI también o es otro plugin o programación? Me gustaria tener algo asi tambien en mi pagina
Gracias
Hola Alejandro,
Efectivamente la barra azul es un elemento de la plantilla Divi. En divi se denomina como barra de menú secundaria, mientras que la barra que hay debajo se denomina barra de menú principal
Un saludo
Hola Joaquín, muchas gracias por este gran aporte, tengo una pregunta, como puedo eliminar del menú el icono de búsqueda y del carrito. De antemano Muchas gracias.
Hola Gustavo,
1.- Quitar icono de búsqueda: para quitar el icono de búsqueda del menú en la plantilla Divi ves a: «Divi > personalizador de temas > cabecera y navegación > Elementos de cabecera» y desmarca la opción «Mostrar icono de búsqueda». A continuación pulsa en «Guardar y Publicar».
2.- Para quitar el icono del carrito en la plantilla Divi que aparece en la parte superior del menú: hay que modificar el código de la plantilla. Prueba a utilizar el código:
.et-cart-info { display:none; }Si tienes un tema hijo o child theme de Divi, añadelo al archivo style.css del tema hijo. Si no utizas un tema hijo, puedes añadirlo a Divi > Opciones del tema y lo metes en el area de texto: «CSS Personalizado».
Un saludo
Muchas gracias por tu pronta respuesta, me ha servido de mucho. 😉
Hola, muchas gracias por tus consejos….
soy nuevo en el tema y tengo una duda: no puedo eliminar el menú principal de la parte superior, siempre tengo el inicio, me gustaría tener una cabecera limpia (una foto) sin menús ni logos, puesto que mas abajo puedo incluir menús……
no consigo hacerle desaparecer por completo de la home….
PD. la web esta en proceso por lo que esta un poco desastre.
muchas gracias por tu tiempo.
Hola Javier,
Para eliminar de manera completa el menú en una página tendrás que utilizar una black page. Para ello, cuando estés en la página busca el bloque «Atributos de página» y en el apartado plantilla elige la opción «blank page».
Un saludo
Hola Joaquin !
Tengo el el DIVI 3.0 y el problema que no encuentro como cambiar lo siguiente : El menú esta encima del Slider quiero que se vea uno luego el otro , osea se vea el menu completo y luego se vea debajo el Slider completo (que la imagen del Slider no este debajo del menú).
Ademas veo en un video de tu articulo que tienes una barrita a la derecha con puntitos es es un desplador , ¿En donde esta esa opcion?.
Gracias por la respuesta.
Hola Alberto,
No entiendo bien lo que dices del menú.
En cuanto a los puntos para desplazamiento entre secciones de la página lo tienes en cada página en la parte derecha. El bloque se denomina: «Ajustes de página de Divi» y la opción: «Navegación con puntos».
Un saludo
Hola Joaquin, muchas gracias por tu tiempo, más que interesantes tus artículos.
Me surge una duda respecto a como tener un menú con la opción «OCULTAR NAVEGACIÓN HASTA QUE HAYA DESPLAZAMIENTO» tan solo en la página de inicio y en el resto de páginas, tenerlo de modo FIJO. Es esto posible en la plantilla, como habría que proceder en caso afirmativo?
Gracias anticipadas y un saludo
Jose
Hola Jose,
no es posible tenerlo de la dos formas. O tienes toda la web en modo «ocultar navegación hasta que haya desplazamiento» o en modo normal.
Un saludo
Hola Joaquín,
Gracias por el artículo, me ha sido de gran ayuda.
Un saludo
Hola Joaquín, la verdad es que es todo muy interesante referente al tema Divi, y más cuando tienes tantas posibilidades sin tener conocimientos de programación.
En esta entrada comentas varios puntos sobre la personalización de la barra de menú principal, para la barra secundaria cómo se debería hacer, he podido leer algún cambio por la plantilla pero si quisiera poner más contenido como un horario o un enlace como el que tienes en tu barra secundaria de «descuento plantilla Divi» cómo debería hacerse…
Muchas gracias.
Hola David,
Para poner un enlace en la barra de menú secundario tendrás que crear un nuevo menú (apariencia > Menu), añadirle las páginas o enlaces personalizados que quieras y debes marcar «Menú secundario» en ubicaciones del tema. A continuación guarda y listo.
Un saludo
Muchas gracias Joaquín 😉
Cuando estará disponible tu curso on line de Divi 3.0 y qué precio tendrá.
Un saludo.
Hola David,
Gracias a ti.
Pues el curso Divi 3.0 + wordpress online estará disponible a finales de este mes de octubre de 2016 o principios de noviembre. El precio aún no lo tengo cerrado pero te adelanto que rondará los 120 € aprox.
Un saludo
Muchas gracias por tu artículo tan detallado. Acabo de empezar con Divi y me ea de mucha ayuda 🙂
Hola Ana,
me alegro que este post sobre tipos de menús con Divi + WordPress te haya sido de utilidad.
Un saludo
Hola!! Gran explicación de como utilizar los menús. Pero, para un proyecto que tengo en mente, no veo la forma de hacerlo… a ver si me puedes ayudar.
Quiero hacer una web con el menú sticky. Uno de los apartados del menú, tendrá varios submenús y aquí viene mi cuestión (pongo un ejemplo para que sea más fácil de entender o yo de explicarme). En el menú principal habrá varios títulos (Vegetal, Carnes y Contacto) y en menú «Carnes» habrá varios submenús (Pollo, vaca, cerdo, pavo). Me gustaría saber como hacer que cuando me meta en Carnes o en cualquier submenú, se visualice, por ejemplo, un menú con la categoría principal y sus subcategorías, es decir, que se muestre sólamente en la página de carnes, un menú donde pueda ver que otros apartados tengo, como pollo, pavo, etc… y ya, sería la leche, si estando en el submenú, por ejemplo, Cerdo, en el menú, este apareciese resaltado.
Gracias por adelantado y espero haberme explicado bien.
Hola Koldo,
No se bien a que te refieres,
¿me puedes decir alguna web donde se vea lo que comentas?
Un saludo
Muchas gracias 😀
Hola, interesante artículo. Me gustaría saber como sabes el tamaño exacto para que el logo se vea bien en Divi. Es algo que me trae de cabeza, al final lo he hecho subiendo el logo de diferente tamaño, hasta encontrar el adecuado.
Pero ahora he cambiado el fondo de la cabecera de mi web, y es de color casi negro, y no consigo que el logo se vea bien, porque contrastan los píxeles amarillos, con el negro del fondo y se ve horroroso, tanto es así que he decidido quitar el logo, hasta que encuentre una solución. Como podría hacer ???
Muchas gracias,
Un saludo
Jen
Hola Jen,
Estoy seguro de que el problema que tienes es con la calidad de la imagen del logo y no con la plantilla Divi. Cuando utilizas un logo con fondo transparente en una web es necesario guardarlo en PNG-24 (Nunca en PNG-8).
En cuanto al tamaño del logo, debes subirlo al tamaño que quieres que se muestre en la web (ojo con ampliar el tamaño del logo original, ya que puede perder calidad. Es necesario trabajar con un logo con calidad suficiente) y luego jugar con las opciones de «Menu altura» y «logo máx altura» (panel de administración > Divi > Personalizador de temas > Cabecera y navegación > Barra de menú principal) hasta que se muestre como quieres.
Un saludo