Icons im Menü wieder einblenden

  • App
    WoltLab Suite Forum

    Liebe Woltlaber!

    Ich begrüße die neuen Features wie Less für Designer. Allerdings fehlt mir persönlich dennoch wieder eine Option, Icons im mainMenu zu aktivieren. Ich denke als Designer kann man damit eine Vielzahl kreative Stilmittel mit den Icons umsetzen - alternativ könnte ich natürlich auch eine Icon Font einbinden und dann den Nutzer dazu zwingen zusätzlich ihre Menüpunkte anzupassen, allerdings passen diese dann eher suboptimal zu den Originalen.

    Viele Grüße

  • Du kannst doch per LESS /CSS da Icons einbinden?

    CSS
    .mainMenu > ul > li > a:before {
        content:url('http://www.woltlab.com/forum/icon/indexM.png');
    }


    Allerdings muss man dann noch ein wenig an der Positionierung arbeiten. gehen tuts aber ;)

    "A life is like a garden. Perfect moments can be had, but not preserved, except in memory. LLAP" — Leonard Nimoy

  • Du kannst doch per LESS /CSS da Icons einbinden?


    Wie kann man dann da eigentlich die Fontawesome Icons benutzen? Sowas wie:

    CSS
    .mainMenu ul li a:before {
    .icon-folder-close-alt;
    }


    Die Icon Klassen arbeiten wenn mich jetzt nicht alles täuscht ja mit der content Eigenschaft, aber das da oben funktioniert nicht so richtig.

    98% aller PC Probleme sitzen direkt davor.

  • Das ist schon richtig - allerdings möchte ich ja zukünftig nicht meine eigenen Stile damit schmücken, bei den ich die Punkte via CSS anpassen kann, sondern auch künftig Stile veröffentlichen. Und da bringt ein Icon via CSS nichts, da ich ja nicht weiß ob Menüpunkt mit der ID 4 das Forum oder doch eine eigene Seite bei dem Endnutzer ist.

    Ich hatte jedenfalls zum GneX Aprilscherz 2012 dieses icegentyboard Design entworfen, das Menü basierte da vollkommen auf Icons im Design. Das WBB4 macht mir daher durch das Entfernen der Icons nicht gerade einen Vorteil. Aber mir ist erst kürzlich aufgefallen, das ja sowieso offiziell auf die Icons auch in der mainHeadline verzichtet wird - sprich es gibt auch für die Seiten kein offizielles Icon - das würde mir doch ermöglichen auf Icon-Fonts auszuweichen. Nachteil ist zwar, das man hierzu eine zusätzliche Dokumentation mitgeben sollte, aber direkt sehe ich keine Lösung.

  • Du kannst ohne Probleme mittels EventListener die nötigen Schnittstellen einbauen, um Bilder oder Icons im Menü einzubauen.

    Nehmen wir mal an, du würdest wirklich den Hauptmenü-Editor im ACP so umbauen wollen, dass man dort Icons einstellen kann - dann muss dein Plugin lediglich auslesen, welcher ID welches Icons oder Bild zugewiesen werden soll, das nötige LESS generieren & compilieren, und schon bist du fertig.

    "A life is like a garden. Perfect moments can be had, but not preserved, except in memory. LLAP" — Leonard Nimoy

  • As Christophe and Brian said, with font awesome already installed :

    Code
    .mainMenu ul li a:before { content: "\f064";
    font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        text-decoration: inherit;}
    Zitat
    Code
    .element {    position: relative;} /*replace the content value with the corresponding value from the list below*/ .element:before {    content: "\f000";     font-family: FontAwesome;    font-style: normal;    font-weight: normal;    text-decoration: inherit;/*--adjust as necessary--*/    color: #000;    font-size: 18px;    padding-right: 0.5em;    position: absolute;    top: 10px;    left: 0;}

    fortawesome.github.io/Font-Awesome/icons/

    gegeek.net --> my french translation, my customisations and my plugins for WBB4..
    woltlab.net --> WoltLab French community, french translations, support..

  • Von unserer Seite ist eine Unterstützung von Icons im Hauptmenü nicht geplant.

    Reicht nicht einfach ein Feld unter dem Menüpunktnamen, wo man ein Link zur Menügrafik reinkopieren kann oder nicht? Sehr aufwendig ist das doch nicht, und es kann dann jeder selbst entscheiden, ob er da ein Icon haben möchte oder nicht.

    Ich finde Icons z. B. viel ansprechender als einfachen Text im Menü...

    Momentan hab ich einfach Grafiken mit <IMG> vor den Menüpunktnamen geklatscht, was sicher nicht sehr Pro ist, aber als Notlösung seinen Zweck erfüllt:
    http://www.gildenforum.de/wbb4/

  • Oder ähnlich wie bei den Labeln die Möglichkeit eigene CSS-Klassen für einen Menü-Punkt zu nutzen.
    Dies würde einem jede Freiheit im Menü geben die man möchte...

  • Das ist mir durchaus bewusst, gäbe es jedoch für die einzelnen Menü-Punkte extra selektoren die werksseitig bereits einen Eintrag enthalten, so könnte man diese sehr viel leichter und flexibler für die Stilentwicklung nutzen.
    Denn nicht jeder hat auch nur ansatzweise die selbe Reihenfolge im Menü...

  • Über den :nth-child() Selektor lassen sich die Menüpunkte bereits per CSS ansprechen und individuell gestalten.

    Das funktioniert aber nur solange alle Foren, die den Stil verwenden, die gleiche Reihenfolge der Menüpunkte haben. Eigene Klassen für die Menüpunkte wären vor diesem Hintergrund schon sinnvoll.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!