Dependiendo del tipo de menú que elijamos en la cabecera de DIVI, cuando presentamos la página en dispositivos móviles, aparece un texto que no podemos cambiar con ninguna opción del tema. Pero aquí os traigo soluciones muy prácticas y sencillas para poder modificar en el menú Divi "Seleccionar página" y poner lo que queramos o quitarlo del todo.
Quitar o modificar en Divi el texto del menú en dispositivos móviles
Divi es uno de los mejores temas que se pueden utilizar para montar cualquier tipo de web en WordPress, pero todavía hay alguna opción que no es posible cambiar si no lo hacemos con algo de código.
Para realizar el cambio se necesita, por supuesto, tener instalado el tema DIVI. Si no lo tienes aún, puedes comprarlo con un descuento en este enlace.
Para modificar en el menú Divi el texto "Seleccionar página", que aparece al lado del menú hamburguer en los dispositivos móviles, podemos hacerlo de tres formas.
Cambiar el tipo de cabecera en DIVI
Es la opción más sencilla, pero implica que tenemos que cambiar la forma en la que mostramos los elementos de la cabecera.
En las opciones en las que mostramos el contenido en formato vertical (Centrado o Logo centrado en línea), el menú en dispositivos móviles se coloca debajo del logo ocupando todo el ancho de la pantalla y mostrando el famoso texto "Seleccionar página" (en inglés Select page).
Para que no nos pase esto, la solución más simple es elegir uno de los otros tipos de encabezado (Por defecto, Deslizar o Pantalla completa).
De esta forma el menú aparece en línea con el logotipo y desaparece el texto.
Ocultar o modificar el texto "Seleccionar página" en el menú móvil de DIVI con CSS
Cambiar el formato de la cabecera puede ser algo drástico que puede afectar al diseño de nuestra web o a la imagen preconcebida que teníamos en mente.
En este caso dejaremos el menú que nos gusta y lo cambiaremos con un poco de código CSS añadido a la pestaña del personalizador de WordPress.
En primer lugar, reduciremos el texto original a un tamaño de 0px, con lo que haremos desaparecer las palabras "Seleccionar página", y a continuación añadiremos delante del texto oculto el que nosotros queramos con otra función CSS.
1 2 3 4 5 6 7 8 | .select_page { font-size: 0px !important; padding-bottom: 0px; } .select_page:before { content:"Pon lo que quieras" !important; font-size: 14px !important; } |
El texto que aparece entre comillas se puede cambiar por lo que quieras, incluso no poner nada. Pero si no queremos que aparezca ningún texto, con la primera parte del código sería suficiente.
Ocultar y modificar el texto "Seleccionar página" en el menú móvil de DIVI con Java Script
La tercera opción es añadir un fragmento de código en Java Script dentro de las opciones del tema.
desde la administración de WordPress, en la pestaña del tema DIVI y dentro de las opciones del tema, seleccionamos el apartado "Integración" y activamos "Habilitar código de la cabecera".
En la casilla "Agregar código al <head> de su blog" colocamos el siguiente código:
1 2 3 4 5 | <script> jQuery(document).ready(function() { jQuery(".select_page").text("Pon lo que quieras"); }); </script> |
En lugar de "Pon lo que quieras" se puede colocar lo que nosotros queramos, incluso dejarlo vacío para que no aparezca nada.
Cualquiera de las opciones anteriores es permanente, no se perderán los cambios aunque actualicemos el tema, ya que no se han realizado modificaciones en los archivos originales, sino que hemos utilizado las opciones de administración que nos ofrece tanto WordPress como el tema DIVI.
Cómo adjuntar archivos a formulario de contacto de Elegant Themes- El mayor descuento de Divi durante el Black Friday 2022
- Añadir reCAPTCHA v3 al formulario de contancto en el tema Divi
- Configurar el footer en Divi con módulos
- Divi Cloud, el diseño de páginas web en la nube
- La mejor forma de personalizar la página de producto de Woocommerce con Divi Builder
0 comentarios