Tutorial Divi Parte 2: Cómo cambiar el estilo de cualquier menú de tu sitio web
Esta es la segunda parte del video tutorial sobre cómo personalizar el estilo de los menús de tu sitio web, y darle un aspecto más elegante…
…Sin embargo, en el video anterior solo nos enfocamos en el ‘menú principal’, y en esta ocasión te vamos a mostrar cuál es el procedimiento para cambiar el aspecto de “cualquier otro menú” que incorpores en tu sitio web, el cual podría ser considerado como un menú secundario.
En caso que no hayas visto la parte 1 – Clic Aquí para ver la primera parte >>
OJO: por favor ten presente que este video tutorial está enfocado en el tema Divi, por lo tanto, si utilizas el código de los estilos CSS en un tema/theme diferente, la más seguro es que no te funcionará de la misma forma como te lo mostramos en el video.
Si deseas obtener más información sobre el “Theme Divi”, Clic Aquí para más detalles >>
Por otra parte, la herramienta para obtener los códigos de los colores se llama “ColorPick Eyedropper”.
Aquí te proporcionamos un video tutorial sobre esta herramienta, para que sepas donde obtenerla, y aprendas cómo seleccionar y obtener los códigos de los colores.
–
A continuación, te proporcionamos el código de los “Estilos CSS” que te mostramos en el video.
[php light=”true”] .et_header_style_left #et-top-navigation nav > ul > li > a,
.et_header_style_left .et-fixed-header #et-top-navigation nav > ul > li > a {
padding-bottom: 15px;
}
#top-menu li {
padding-right: 5px;
}
#et-top-navigation {
padding: 20px 0 !important;
}
#top-menu li a {
background: #C1B2AB; /*** CHANGES THE BACKGROUND COLOR ***/
padding: 15px 20px;
border-radius: 3px;
}
#top-menu li a:hover,
#top-menu li li a:hover {
color: #fff !important;
}
#top-menu li a:hover {
background: #559CAD !important; /*** CHANGES THE BACKGROUND COLOR ON HOVER ***/
}
#top-menu li.current-menu-item > a {
background: #edc77b; /*** CHANGES THE BACKGROUND COLOR OF THE CURRENT PAGE LINK ***/
}
#top-menu .menu-item-has-children > a:first-child:after {
content: none;
} [/php]
–
¿Deseas ver los otros códigos de estilos CSS?
Si tu respuesta es Sí, entonces Clic Aquí para ir directamente al artículo de Elegant Themes.
El sitio web de Elegant Themes está en inglés, pero te puedes ayudar a traducirlo con el traductor de Google.
–
Si te pareció que esta información es útil, por favor compártela y déjanos tus comentarios. ¡Gracias!
También te puede interesar
Deja una respuesta
Política de Comentarios de Media Digital Fácil
Media Digital Fácil te informa que los datos de carácter personal que nos proporciones rellenando el presente formulario serán tratados por Media Digital Facil (Media Digital Fácil ) como responsable de esta web.La finalidad de la recogida y tratamiento de los datos personales que te solicitamos es para gestionar los comentarios que realizas en este blog.
Legitimación: Consentimiento del interesado.
- Como usuario e interesado te informo que los datos que me facilitas estarán ubicados en los servidores de Siteground (proveedor de hosting de Media Digital Fácil ) dentro de la UE. Ver política de privacidad de Siteground. (https://www.siteground.es/privacidad.htm).
Podrás ejercer tus derechos de acceso, rectificación, limitación y suprimir los datos en Nuestro Sitio de Soporte así como el derecho a presentar una reclamación ante una autoridad de control.
- Por favor lea nuestra Política de Privacidad antes de dejar tu comentario.
4 Comentarios
Que pena Pedro no habia leído los otros CSS creo que esa parte ya estaría solucionada, como usted dice es muy cierto, el menú le da mucha vida a una página web. Le encargo lo de los formularios. Gracias.
Gracias a ti Diego por tus comentarios, en cuanto a los formularios, ya te deje respuesta en el comentario anterior.
Un saludo
Pedro
Pedro muy interesante la información y como siempre tus videos son muy bien explicados. Lo que meha parecido molesto del Divi es que no tiene variedad de estilos para los menús, fuera de eso para los formularios tampoco he podido. He tratado de trabajar con BLOOM o FLORECER y me bloquea el menú. A estas altura si Divi en lo mas genial como dice mucha gente deberían de tener solucionado el problemas. Tiene usted alguna solución para estos inconvenientes? Gracias Pedro
Si te refieres a cambiar el estilo a los formularios, con CSS se puede hacer al igual que con los menús. En cuanto a lo que comentas de Bloom, aso, de pronto, no se a que se pueda deber.
Un saludo
Pedro