Farbiger "Discord" Button mit Icon in der Navigation

1. offizieller Beitrag
    • Offizieller Beitrag

    Wer gerne einen farbigen Menüpunkt hätte wie hier z.B. den Discord Button der kann dies folgendermassen machen.

    ACP Inhalt Menü Hauptmenü +Mneüpunkt Hinzufügen

    Name: Discord (frei wählbar)

    Verlinkung: Externer Link (z.B. zu Discord)


    ACP Anpassung Stile Stile bearbeiten Erweiterte Einstellungen Individuelle CSS und SCSS

    ganz am Ende fügt man folgenden CSS Schnippsel ein

    CSS: CSS
    .box.mainMenu a[href*="discord.gg"] {
    background-repeat: no-repeat !important;
    background-color: #7289da !important;
    color: #fff !important;
    padding-left: 35px !important;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAABAlBMVEUAAABziNlwh9lziNlvg+JtkvFJluRyi95xhtlvhdhyh9p0hNt2hslpmd1ziNt9ndV3bdVxgNV7jth6g9h4jtdtgthtg9d0h9hsi+Bsjd6IetCIdthlctxme9lrhdhzh9hwfM9db+z///9ziNlsgtd3jNpqgddpf9f9/f73+PzAye5xhthmftb6+/7z9fzr7vrl6fjf4/a6xeycq+SSouGAlN1heNX4+f3p7PnO1vHEze+xvOmjsOaYqOOWpuOFl959kdx5jdttg9dxiNVcdNPu8frt7/rX3fTR2PG0v+qvvOqmueiptueMneByht1of9p6hdZshdZ6kdVuetNjetNqgNKcXhTlAAAAInRSTlMA7ovJMwkH/e7uzKagmoEvJ/37+/rNysazr6ynm5SEgzUD15bdbgAAANZJREFUGNM9z9WSwkAQBdBOAiyyC6y7dTIzxIgHd3f//19hSAHnrbuqu+6Fk1z2VRCk3xicfT/IkZvbBHCJzy2lCseU5XucL+7WrN1sBUHLC1gvA5B/pJ7j2KpqO3ad6jHIdkkZz4ptKoJk+HjlGWlIGhPEilYoaBVElyUh1R1jqdO3in1i4khPwQuxEGuNktmoIQ7JM/wQFa1B9LKMakeE/P2M39ddd66ZON388WA7v+qHBgsX1eYhc4r+0QsVWddlZb96iwP3//V0KcfnSE6UBCEtRvWPhOkhhPp2MIkAAAAASUVORK5CYII=') !important;
    background-position: 16px 16px !important;
}

    Will man einen anderen Button mit einem anderen Icon einfügen dann ändert man in Zeile 1 .box.mainMenu a[href*="discord.gg"] { auf den gewünschten Button.

    Will man ein anderes oder eigenes Icon nutzen dann ersetzt man background-image: url('https://meinedomain/pfad/zum/bild.png') !important;

    Viel Spass

    Gruss Grischabock