Consejos para ocultar un menú móvil en WordPress

En la mayoría de los casos, los temas de WordPress ya tienen estilos definidos que les permiten transformar un menú de navegación normal en un menú móvil. Es conveniente si necesita una solución rápida lista para usar. Por ejemplo, tiene un diseño tradicional para computadoras de escritorio y un menú de hamburguesas en dispositivos móviles. Sin embargo, si desea personalizar aún más o incluso reemplazar por completo su menú móvil existente, también es posible. Hay varias formas de ocultar un menú móvil en WordPress, ya sea con plugins o con código .

Cómo ocultar un menú móvil en WordPress

La personalización completa del sitio web requiere un poco de conocimiento y experiencia. Si desea tener una personalización segura sin riesgo, puede utilizar profesionales para personalizar y mantener su sitio web. Si bien hay algunas partes fáciles que puede hacer por su cuenta, la personalización más seria requiere un toque profesional. Cuando se trata del menú móvil en WordPress, puede usar complementos para simplificar el proceso . O, si tiene conocimientos de codificación, puede crear cambios directamente dentro del código.

Para ayudarlo a cambiar la forma en que aparece el menú móvil en su sitio web, estas son las dos formas más comunes de completarlo:

• Ocultar un menú móvil en WordPress con un complemento
• Ocultar menú móvil con código CSS

Cómo ocultar un menú móvil en WordPress con un complemento

Probablemente haya encontrado un tema de WordPress con un comportamiento de menú móvil interesante y quiera replicarlo fácilmente. Este método no requiere conocimientos de codificación, por lo que es más conveniente para esta tarea. Después de instalar un complemento, podrá eliminar completamente su menú móvil en dispositivos móviles . Además, algunos complementos te permitirán personalizarlo en profundidad. Además de la ocultación básica, también puede usarlo para eliminar solo elementos específicos en su menú.

Crear un nuevo menú móvil

El primer paso es ir a Apariencia>Menús . Allí podrá crear un nuevo menú haciendo clic en la opción "crear nuevo menú" en la parte superior. Asigne un nombre a su nuevo menú y confírmelo con el botón "Crear menú" en la esquina inferior derecha de la pantalla.

Después de estos pasos, ya no se podrá hacer clic en la selección del lado izquierdo y podrá agregar elementos para su nuevo menú. Cuando haya terminado de agregar nuevos elementos, simplemente haga clic en "Guardar menú" .

Buscar e instalar un complemento

El siguiente paso es encontrar e instalar un complemento. Existen numerosos complementos que pueden ayudarlo a manipular y personalizar los menús . Algunos de los más populares son WP Mobile Menu, Max Mega Menu, Responsive Menu, etc. En aras de la explicación, instalemos y activemos WP Mobile Menu.

Una vez que haya terminado, vaya a Opciones de menú móvil en la barra lateral izquierda de WordPress. Dentro de las opciones del complemento, ahora puede elegir si desea mostrar su nuevo menú móvil a la izquierda o a la derecha. Seleccione el menú creado anteriormente y luego desplácese hacia abajo hasta "Ocultar menú de tema original" . Allí, puede optar por eliminar elementos específicos del menú original. Si hace clic en el campo "Buscar elemento", obtendrá una vista previa en vivo de las selecciones para elegir. Una vez que haya completado el proceso de selección, simplemente guarde los cambios.

Reemplazar u ocultar el menú

Una vez que haya elegido qué ocultar, simplemente regrese a Apariencia>Menús . Seleccione de un menú desplegable su menú móvil creado previamente y configure su "Ubicación de visualización" . Su menú original ahora está oculto y reemplazado con su menú personalizado.

Ahora puede visitar su sitio web para ver su nuevo menú en acción. El complemento ahora ocultará el menú móvil de su tema y, en su lugar, mostrará un menú personalizado.

Cómo ocultar menú con código CSS

Otro método para ocultar el menú móvil requiere un cierto conocimiento del código y las prácticas de CSS . Las personas que a menudo crean temas personalizados de WordPress ya saben lo compleja que puede ser la personalización. Y, dados estos puntos, no es exactamente un método recomendado para principiantes. Sin embargo…

Encuentra el nombre de tu menú

El primer paso es encontrar el menú que desea editar. Probablemente la forma más sencilla sea utilizar las herramientas integradas de desarrollo del navegador . Vaya a su sitio web donde desea realizar cambios y abra las herramientas para desarrolladores. Si está utilizando Google Chrome, puede hacerlo con el acceso directo Ctrl+Shift+I . En la parte superior de la pantalla, encontrará la opción Alternar barra de herramientas del dispositivo que le mostrará cómo se ve su sitio web en dispositivos móviles. Incluso puede cambiar diferentes tipos y resoluciones.

Ahora que ve cómo se muestra en los dispositivos móviles, seleccione el botón con forma de flecha y haga clic en su menú para inspeccionarlo. Inmediatamente lo llevará a la parte del código donde puede ver la clase CSS para un menú determinado. Es decir, verá ese nombre de clase.

Oculte su menú con una nueva línea de código

Después de obtener el nombre correcto, simplemente vaya a Apariencia>Personalizar y seleccione "CSS adicional" . En general, esto suele estar en la parte inferior de la barra lateral izquierda. Haga clic en él y se le dará la siguiente pantalla. Allí, puedes hacer clic en la parte inferior de la pantalla para seleccionar la vista móvil y, encima, ingresarás el código para ocultar el menú:

Código: .menu-name {display: none;}

Finalmente, haz clic en el botón Publicar y listo. Si está un poco más familiarizado con el código CSS, muchos de estos cambios se pueden completar dentro del archivo CSS. Sin embargo, deberá prestar atención a las consultas de los medios. Le permitirán crear diferentes reglas para diferentes dispositivos, para que pueda tener más control sobre sus sitios web y el comportamiento del menú.

Si es un principiante en la edición de diseño, la opción de complemento es probablemente la mejor manera de comenzar. Si comienza a cambiar el código sin saber exactamente lo que está haciendo, puede romper fácilmente la apariencia de su sitio web. Existen numerosas reglas y propiedades en CSS que se sobrescriben entre sí. Entonces, si desea ocultar su menú móvil en WordPress sin riesgo, use complementos para completar el trabajo por usted .