Aufzählungszeichen bei ul (unordered list) ändern

  • Joomla Version
    Joomla! 5.1.0
    PHP Version
    PHP 8.2.x
    Hoster
    allinkl.com
    Link (URL) zur Seite mit dem Problem
    Entwurfstatus

    Hallo Zusammen!

    Ich würde gerne die "Bullet Points" bei den UL - Listen anpassen.
    Entweder über kleine Grafiken, oder farbige "Punkte" erstellen.


    Ich verwende ein Template von joomlaplates.de

    Mit Asteroid-Framework.


    Gibt es da evtl. "Icon-Packs" für eine solche Umsetzung?
    Oder evtl. über UIkit 3?


    Die Punkte sollten z.B. bisschen größer sein (als normal) und z.B. in der Farbe #27A998


    Hat jemand einen Tipp, wie ich das umsetzen kann?


    Hab leider nichts gefunden.
    Falls es dazu schon Einträge gibt, bitte gerne verlinken.


    Schöne Grüße
    Joomla-Sigi

  • Hallo!

    Vielen Dank für die Info.
    Und auch für den Tipp nach "CSS UL" zu googeln!


    Kann ich denn im Template dann "Custom CSS Styles" definieren, dass die Aufzählungszeichen immer so gesetzt werden?
    Auch wenn man ohne HTML im WYSIWYG-Content-Editor (z.B. JCE) UL-Listen generiert?

    VG
    Joomla-Sigi

  • Du kannst natürlich per custom CSS die Aufzählungszeichen generell umbiegen, kannst das aber auch nur für bestimmte Fälle ändern. Braucht natürlich gewisse Kenntnisse in CSS (kein Expertenwissen).
    Im Übrigen sind die Entwicklertools Deines Browsers Dein Freund: Hier kannst Du nach Herzenslust probieren und eine gefundene Lösung kopieren und in Deine user.css oder custom.css (je nach Template) einfügen.

  • Hallo Dautrich!

    Vielen Dank für die Info.
    Das mit den CSS-Style habe ich schon versucht.
    Funktioniert auch "fast".
    Problem ist, dass ich dann in der Menüleiste ebenfalls komische Aufzählungszeichen haben. ?!?
    Warum das so ist, muss ich erst noch überprüfen.



    Noch eine Frage.

    Ich nutze in meinem Template (Joomlaplates) Aufzählungszeichen sowohl als normalen Beitrag (erstellt und editiert über JCE), aber auch in einem UIkit 3 Modul (Slider) im Content-Bereich mit HTML-Support.

    Hier habe ich z.B. eingetragen:


    <h4>Überschrift</h4>

    <ul>

    <li style="text-align: left;">Text 1</li>

    <li style="text-align: left;">Text 2</li>

    <li style="text-align: left;">Text 3</li>

    </ul>


    Was ich nicht ganz verstehe.

    Die Aufzählungszeichen in den Beiträgen (erstellt über JCE) sind normale, ausgefüllte Bullet-Points.

    Die Aufzählungszeichen im UIkit 3 Modul (erstelt mit dem Code) zeigt Ringe an.


    Weiß jemand warum es hier Unterschiede in der Darstellung der Aufzählungszeichen gibt?


    VG

    Joomla-Sigi

  • Weiß jemand warum es hier Unterschiede in der Darstellung der Aufzählungszeichen gibt?

    Du kannst mit den Entwicklertools Deines Browsers herausfinden, welche Klassen bei den Aufzählungszeichen (und bei jedem anderen Element auf der Seite) genutzt werden.


    Wenn Du unerwünschte Nebeneffekte bei CSS-Änderungen hast, musst Du Dein CSS besser qualifizieren, also nicht .li {color:red;}, sondern .die_richtige_klasse li {color:red;}. Um die richtige Klasse herauszufinden: siehe oben.