Viernes , 26 Abril 2024
Inicio / Tutoriales / Mostrar icono “home” (casa) usando menús personalizados en Mystique

Mostrar icono “home” (casa) usando menús personalizados en Mystique

Cuando instalas Mystique, por defecto verás un icono de una casita al lado de la palabra “Inicio” en el menú superior. Si después decides usar un menú personalizado de WordPress, verás que este icono desaparece.

Si quieres que se muestre de nuevo el icono, tienes que añadir el siguiente código en la pestaña “CSS” de las opciones de Mystique o en el archivo “style.css” de Mystique – Extend, cambiando “www.ejemplo.com” por tu propio dominio en las dos URLs, no lo olvides.

.nav-main .menu-inicio a{
background: transparent url(https://www.ejemplo.com/wp-content/themes/mystique/images/icons.png) no-repeat -46px -56px;
padding-left: 32px;
}

.nav-main .menu-inicio.active > a,
.nav-main .menu-inicio.active-parent > a{
background: transparent url(https://www.ejemplo.com/wp-content/themes/mystique/images/icons.png) no-repeat -46px -6px;
}

El problema viene porque, al usar un menú personalizado, el nombre de clase que asigna Mystique a ese elemento del menú es “menu-inicio”, cuando la clase que está definida en el archivo “core.css” es “menu-home”. Esto es un pequeño error de Mystique que solo aparece cuando se está usando una traducción.

Gracias a felix46r

También puedes ver...

Comienza a crear tus páginas web en WordPress PASO a PASO

Un curso de WordPress es esencial para poder crear un sitio web. El crecimiento de los …

8 Comentarios

  1. LLevo toda la mañana dandole vueltas y a mi no me sale 🙁

  2. ok! Sois la kaña! Muchas gracias por vuestros aportes!!!

  3. Hola, ¿sabéis como se activas las “entradas destacadas” en forma de slide debajo del header?. Yo antes lo tenía así configurado (en la 2.4.5), pero al actualizar a la 3.2.5 no viene la misma opción en “opciones de Mystique-Contenido”. Sin embargo en la demo de Digitalnature se ve funcionando esta opción. ¿Como se hace?. Enhorabuena por la traducción. Salu2

  4. Hola Soy Amaury desde la Rep Domincana…

    Tengo un inquietud…Hoy me pase el sábado entero tratando de hacer algo que tienes este blog y no pude hacerlo…es lo siguiente..
    En el menu, donde dice “foros” tiene una imagen al lado izquierdo…Como es que eso se hace, por que mas que trate no pude.. subí la imagen que quería en la carpeta correspondiente…copie el scc y no me salio..por favor ayúdenme en eso

    • Hola, te dejo el código que yo he usado para conseguir eso, lo tengo puesto en el apartado CSS de la configuración de Mystique. Tendrás que adaptarlo para que funcione en tu página.


      .nav-main .menu-foros a{
        background: transparent url(https://www.ngeeks.com/wp-content/uploads/icono-foros.png) no-repeat 5px 5px;
        padding-left:40px;
      }

      .nav-main .menu-foros.active > a,
      .nav-main .menu-foros.active-parent > a{
        background: transparent url(https://www.ngeeks.com/wp-content/uploads/icono-foros.png) no-repeat 5px 5px;
      }

      .nav-main .menu-general a, .nav-main .menu-general.active > a, .nav-main .menu-general.active-parent > a{
        background: none; padding-left: 0;
      }
      .nav-main .menu-wordpress a, .nav-main .menu-wordpress.active > a, .nav-main .menu-wordpress.active-parent > a{
        background: none; padding-left: 0;
      }
      .nav-main .menu-desarrolloweb a, .nav-main .menu-desarrolloweb.active > a, .nav-main .menu-desarrolloweb.active-parent > a{
        background: none; padding-left: 0;
      }
      .nav-main .menu-dispositivosmviles a, .nav-main .menu-dispositivosmviles.active > a, .nav-main .menu-dispositivosmviles.active-parent > a{
        background: none; padding-left: 0;
      }
      .nav-main .menu-presentatusitioweb a, .nav-main .menu-presentatusitioweb.active > a, .nav-main .menu-presentatusitioweb.active-parent > a{
        background: none; padding-left: 0;
      }
      .nav-main .menu-off-topic a, .nav-main .menu-off-topic.active > a, .nav-main .menu-off-topic.active-parent > a{
        background: none; padding-left: 0;

Responder a Amaury Cancelar respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *