Soporte » Plugins y Hacks » Algún plugin para menú que pueda personalizar iconos?

  • Resuelto mafit0

    (@mafit0)


    Hola compañeros! Estoy realizando una página web con wordpress y necesito incorporar un menú con iconos, la idea es conseguir algo parecido al menú de esta página: http://www.marabraz.com.br/

    Quisiera poner un icono y debajo texto, siendo desplegable etc, pero los que he encontrado hasta el momento no puedo introducir iconos personalizados, ya que necesito que sean iconos de muebles y otras cosas. Alguien sabe de un plugin para menú que me permita introducir a mi mismo los iconos y pueda lograr algo parecido a esa página?

    Desde ya, gracias a aquellos que puedan echarme un cable.

    Saludos!

Viendo 14 respuestas - de la 1 a la 14 (de un total de 14)
  • Hola,
    siento no poder ayudarte ya que no conozco ningún plugin que te permita hacer lo que comentas. De todos modos he consultado la web que dabas como ejemplo y no sé si me acaba de convencer la idea. La verdad es que queda original, pero ya te digo, no sé hasta que punto me convence.
    Saludos!

    Iniciador del debate mafit0

    (@mafit0)

    Bueno, no es cuestión de gustos, es lo que el jefe quiere =)

    A ver si alguien me puede decir…

    Hola,

    supongo que es dificil encontrar un plugin así, ya que depende mucho de cada plantilla como sea el menú.

    Si dominas código, podrías probar de añadir con css el «:before» para añadir iconos, aunque será difícil ponerlo igual que la web que dices.

    La otra opción es buscar una plantilla (theme) que tenga esa opción del menú.

    Un saludo.

    Moderador almendron

    (@almendron)

    Tal vez pueda servirte https://es.wordpress.org/plugins/menu-icons/

    Y también lo puedes hacer con código. Accede al código de la página que has indicado (botón derecho > Inspeccionar elemento (firefox) o Inspeccionar) y verás que es tan sencillo como usar un background.

    Iniciador del debate mafit0

    (@mafit0)

    ACTUALIZO:

    Hola a todos, he conseguido hacer lo que quería por CSS, pero el problema que tengo ahora es que cuando despliego el menú (para ver las subcategorias), el icono se me repite por debajo y yo solo quiero que se muestre en la categoría principal.

    Menú sin desplegar: http://i.imgur.com/PbLM5ly.png
    Menú desplegado: http://i.imgur.com/qYzVap4.png

    Esto lo he hecho modificando el menú y añadiendo en CSS Clases (opcional): «home-link-icon«. A continuación he ido al style.css de mi theme y he añadido lo siguiente:

    .home-link-icon a{
       padding-top: 45px !important;
       background-image: url(http://miweb.com/wp-content/uploads/2017/04/1492328393_sofa-chair.png);
       background-position: top;
       background-repeat: no-repeat;
    }

    El problema que tengo es que se me repite el icono en las subcategorías, alguien sabe que tengo que modificar en el código para que no me ocurra? Gracias

    Iniciador del debate mafit0

    (@mafit0)

    Nadie por favor? Me urge acabar esto y no consigo que me salga bien 🙁

    Hola, lo que tienes que hacer es puntualizar al máximo el selector del CSS, por ejemplo cogiendo la id del menú (del tag «li») y usarlo así:

    #menu-item-99 aa{
    /* estilo */
    }

    Si así no te funciona (ya que depende del tema) la clave es según el menú que tengas pues utilizar el más exacto, como las ID que normalmente son únicas, y a la vez eso te permitirá usar un icono para cada enlace del menú. Puedes usar el «Inspeccionar Código» de Google Chrome (por ejemplo) para ver el código html y poder hacer pruebas en vivo o bien saber las ids, clases o tags del menú.

    La otra opción es usar el plugin que te ha pasado @almendron .

    Un saludo.

    Moderador almendron

    (@almendron)

    Adivinos no somos. Dinos que tema usas para echarle un vistazo a ver si se puede diferenciar entre menús y submenús.

    Iniciador del debate mafit0

    (@mafit0)

    Este es el tema que estoy utilizando @almendron: http://demo.presslayouts.com/emallshop/default/, el menú que estoy usando es el que dice Home, Shop, Men & Women… (el horizontal).

    No se como hacer exactamente lo que me comentas @merksk8, yo tengo este código para definir la clase del menú:
    `.home-link-icon a{
    padding-top: 45px !important;
    background-image: url(http://miweb.com/wp-content/uploads/2017/04/1492328393_sofa-chair.png);
    background-position: top;
    background-repeat: no-repeat;
    }`

    y en el menú he puesto vía panel de wordpress ese estilo (http://i.imgur.com/1RN9BeU.png), pero se me repite en las subcategorías del menú y yo solo quiero que el icono aparezca una vez, en la principal (la que he insertado el estilo, no el resto).

    Gracias por las respuestas, saludos.

    • Esta respuesta fue modificada hace 4 años, 7 meses por mafit0. Razón: puse mal el codigo
    Moderador almendron

    (@almendron)

    Prueba con .sub-menu li a { background-image:none !important} o .sub-menu li { background-image:none !important}

    De todas formas, el tema es de pago y mucho más no podemos ayudarte ya que no tenemos acceso a dicho tema.

    Iniciador del debate mafit0

    (@mafit0)

    Muchas gracias @almendron, funciona! El problema ahora es que me deja unos margenes muy jodidos que no consigo quitar… http://i.imgur.com/eTmJbsC.png Parece como si respetase el espacio que debería tener la imagen que no se muestra. 🙁

    Moderador almendron

    (@almendron)

    Sin tener acceso a la plantilla es complicado pero prueba a poner un «margin-top» negativo a «.sub-menu li a»

    Iniciador del debate mafit0

    (@mafit0)

    Ahora sí! @almendron muchas gracias, está perfecto ahora. Te lo agradezco mucho

    Moderador almendron

    (@almendron)

    De nada. Un saludo.

    PD. Por favor, marca el hilo como resuelto.

Viendo 14 respuestas - de la 1 a la 14 (de un total de 14)
  • El debate ‘Algún plugin para menú que pueda personalizar iconos?’ está cerrado a nuevas respuestas.