Awesome Icon als Menü Titel (ohne Text)

  • Auch wenn ich jetzt erschlagen werden sollte:

    Einfach als Menü-Titel ein   eingeben. Der Alias kann ja bleiben.

    Allerdings komme ich anschließend nicht mehr in den Menüpunkt (im Backend). Jedenfalls nicht durch simples Anklicken. Einfach einen anderen Menüpunkt anklicken und dann die "id" in der URL austauschen!

    Was anderes fällt mir auf die Schnelle auch nicht ein.


    Oder einfach einen sehr kurzen Menü-Titel wählen und diesen in der selben Farbe wählen wie der Hintergrund ist. ;)


    Keine Ahnung, ob das so gewollt ist, dass man das Icon nicht alleine darstellen kann. Müsste ich mich auch erst näher mit beschäftigen.

    Was passiert, wenn du stattdessen ein kleines Bild als Icon verwendest?


    EDIT: Getestet mit RC2.

  • Danke JoomlaWunder,


    Eben, bei einen J3 gerade getestet mit (Helix 3) funktioniert es gemäss Bild oben, und so ist nur das Icon sichtbar.


    Der Unterschied zwischen Icon oder Bild ist, beim Icon funktioniert auch das Mouseover und der a:activ wie Text.

    Beim Link "Suche" kann man den Titel nicht frei wählen.

  • Aktuelle Joomla 4 nightly. Ich kann bestätigen, dass bei Einstellung "Display Menu Item Title", der Titel IMMER angezeigt wird, auch, wenn er auf "Nein" steht. Dabei ist es vollkommen egal, ob mit eingetragener Klasse oder nicht.


    Ich habe alle Overrides für mod_menu deaktiviert.


    Ich denke mal, dass irgendwo eine blöde Weiche eingebaut wurde, die Titel nur dann versteckt, wenn auch ein Bild gewählt wurde.


    Ist mir aber auch egal, da ich seit je her (auch Joomla 3) eigene Overrides verwende, die einen Icon-Link anzeigen, wenn in "Image Class"(!) was drinnen steht UND KEIN Bild gewählt wurde UND Titel anzeigen auf NEIN steht. Dann wird mir im Override ein sauberes, Icon-SPAN mit Link drumrum gebaut und eingesetzt, das dann auch barrierefrei gestyled werden kann.


    Da ich die Overrides schon unter Joomla 3 gebaut habe, gehe ich davon aus, dass das auch schon da krumm war; mindestens, weil so Icon-Klassen im <a>-Tag einfach nicht passen, blöde Ergebnisse geben. Deshalb mein zusätzlicher SPAN.

  • Das ist ein bug in J4 und ich erinnere mich, dass es dazu eine offene Meldung gibt, allerdings ging es darum dass dann das ganze menuItem eine falsche font-family hat. Leider finde ich das gerade nicht.

    Das müsste man nochmal durchgehen. christine2 ist Weltmeister im finden von Sachen auf github, vielleicht kann sie da tätig werden.

  • Danke Re:Later,


    Eine Override für Joomla 4 fände ich gut. Aber ob ich sowas als Daueranfänger hinkriege bezweifle ich.


    Ich bin daran eine bestehende J3 Webseite (Helix 3) auf J4, neu und ca. 1 zu 1 zu gestalten/übernehemen. Mein Ziel ist es das Cassiopeia Template zu benutzen. Bis jetzt komme ich gut voran, und bin auch überzeugt, dass es für kleinere Webseite keine «Helix 3, Ultimate, …» benötigt, und dass ich mit dem Cassiopeia + user.css, mein Ziel erreichen werde.


    Das ist ein bug in J4 und ich erinnere mich, dass es dazu eine offene Meldung gibt, allerdings ging es darum dass dann das ganze menuItem eine falsche font-family hat. Leider finde ich das gerade nicht.

    Das müsste man nochmal durchgehen. christine2 ist Weltmeister im finden von Sachen auf github, vielleicht kann sie da tätig werden.


    Danke firstlady,

    Dass klingt gut, wenn dies noch angepasst wird ! :)

    Wie erfahre ich wann dies angepasst wurde ?

    Einmal editiert, zuletzt von Indigo66 () aus folgendem Grund: Ein Beitrag von Stef mit diesem Beitrag zusammengefügt.

  • Cassiopeia wird ein barrierefreies Template.
    Ein Menu,das nur aus icons oder Bildern ohne Title bestehen würde, wäre nicht barrierefrei, ein Title muss also vorhanden sein.


    Allerdings sollte der dann vor sehenden Benutzern versteckt sein, wenn der Schalter "nicht anzeigen" gesetzt ist.


    Ich werde das nochmal als issue melden, vorsichtshalber.


    EDIT: Bei Bildern verhält sich Joomla richtig. Es geht nur um den Sonderfall, dass ein menüeintrag eine icon Klasse hat.

  • Hallo Re:Later,


    Danke für die Dateien.


    Habe ein menu override gemacht und deine 2 Dateien (default.php + default_component.php) im Ordner html/mod_menu ersetzt.


    Leider sehe ich bei mir keine Änderung.

  • Oh ja. 50:50 meine Fehler:versus Joomla4-Paranoiia nenn ich das mal ;)


    Ist aktualisiert. Ob das jetzt auch für Joomla 3 passt weiß ich nicht. Weiß nicht, ob es da ein

    Code
    $item->getParams()

    gibt. Egal.


    Nur falls Interesse: Nur die Änderungen hier: https://github.com/GHSVS-de/GH…273ad7d95440dceda4d32f86e


    Und ich habe jetzt noch einen Switch eingebaut, dass der Titel-Text auch garantiert nicht angezeigt wird, wenn eine Bild-Klasse UUUND Titel anzeigen auf Nein.


    Das hatte ich vorher nicht, weil ich dachte firstlady ist dabei das zu korrigieren(?????)


    Im Bild 2 sieht man auch das Problem, wenn man auf den A-Tag die Icon-Klasse setzt (siehe abweichenden Font de Titels "Home").



  • Re:Later,

    Kann das bestätigen, dass wenn ein Bild ist, kein Titel angezeigt wird:


    Code
    <a href="/example.org/index.php/search?f=1" class="fa fa-search"><img src="/example.org/images/sampledata/parks/landscape/180px_ormiston_pound.jpg" alt="Search" class="testclass"></a>

    Das Override selbst, habe ich auch ausprobiert. Mit Deinen files. Leider klappt es nicht.

    OT: System macht halt dann diese ergänzenden Files dazu, z.B. 20210628-163131.php usw. Habe ich gelöscht.

    (= anderes Thema)


    Rede jetzt von:

    4.0.0-2021-06-04

    ‎4.0.0-rc3-dev


    Liebe Grüße

    Christine


    Edit: war da am Text/Bild basteln > Muss Dein Post erst noch lesen/studieren :)

  • Und barrierefrei ist mein Override nicht, wenn "Titel anzeigen" auf Nein steht.

    Code
    <a href="/wir-rauchen-sie.html">
     <span class="icon-home" aria-hidden="true"></span>
    </a>

    Da muss man dann eben einen weiteren SPAN mit wohl aria-hidden rein-basteln an dieser Stelle wohl, stat den title komplett zu killen.

    https://github.com/GHSVS-de/GH…-icon/default.php#L41-L45

    Code
    $item->title = '<span class="sr-only">' . $item->title . '</span>';

    Bin ich jetzt aber überfordert, da mich GitHub gerade überfordert ;) Mach nur Fehler...


    Damit sollte dann rauskommen:

    Code
    <a href="/wir-rauchen-sie.html">
     <span class="icon-home" aria-hidden="true"></span>
     <span class="sr-only">Wir rauchen Sie</span>
    </a>

    Weiß aber gerade nicht, wie die korrekte, moderne Klasse für sr-only heutzutage unter Joomla 4 heißt. Selber raussuchen


    Edit: Statt sr-only verwendet man am besten visually-hidden-focusable