Um dein Sidebar-Menü zu bearbeiten, befindest du dich als Admin angemeldet im Backend der cloud software und navigierst dich im linken Menü zum Punkt “Webseite” und klickst dann auf “Menüs”. Hier siehst du alle Menüs, die für deine Webseite oder deinen Webshop angelegt wurden und wenn du eine Sidebar hast, findest du hier das dazu gehörige Menü. Schauen wir uns das einmal im Frontend an.
Dafür kannst du einfach auf dein Logo oben rechts klicken und gelangst dann ins Frontend deiner Seite. Hier am Rand siehst du die Sidebar. Hier werden kleine Icons angezeigt, die direkt zum Kontaktformular weisen oder deine Kontaktdaten anzeigen. Wir wollen für unser Beispiel hier jetzt eine Verlinkung zur “Über uns” Seite einfügen. Damit wir auch dafür ein Icon haben, öffnest du dir die Seite Font Awesome . Du dieser Seite mit unzähligen Icons haben wir eine Schnittstelle, die es uns und dir ermöglicht, die Icons einzubinden.
Suchen wir also nach einem passenden Icon für unsere “Über uns”-Verlinkung. Wie wäre es mit einem Herz-Icon? Dazu suchen wir einfach nach dem passenden Begriff und klicken unser gewünschtes Icon an. Hier siehst du dann einen HTML-Code, den du dir offen halten musst. Wie und wo du den gleich einfügst, zeigen wir dir.
Wechsel jetzt wieder in dein Sidebar-Menü und erstelle mit dem blauen “Plus” einen neuen Menüeintrag. Wir bleiben für unser Beispiel bei “Über uns” und vergeben das als Namen. Da wir wollen, dass der Eintrag unter dem bereits bestehenden Eintrag angezeigt wird, vergeben wir eine höhere Priorität. Außerdem verlinken wir die Seite “Über uns”, weil wir wollen, dass der Kunde mit Klick auf die Sidebar auf der “Über uns”-Seite landet.
Spannend wird es jetzt unter “Erweitert”. Denn hier findest du den Punkt “Glyph”. Und genau hier kommt jetzt gleich der Code von Font Awesome ins Spiel. Vorher musst du aber noch etwas einfügen und dafür gehen wir noch einmal auf die Seite von Font Awesome. Hier siehst du, ob dein Icon eine bestimmte Formatierung hat und kannst diese auch noch ändern, indem du auf die unterschiedlichen Iconvarianten oben rechts klickst. Je nachdem, wofür du dich entscheidest, siehst du darunter im Code die Info “solid”, “regular”, “light” oder “thin”. Wir nehmen für unser Beispiel das Icon nun in “solid” und merken uns den Code “fa-heart”.
Gehe dann wieder zurück zu deinem Menüpunkt und trage bei Glyph Folgendes ein:
- fas fa-heart
Jetzt kannst du deinen Menüpunkt speichern, den Cache löschen und ins Frontend deiner Seite gehen. Wir der Menüpunkt noch nicht sofort angezeigt, kannst du noch den HTTP-Cache löschen. Wie das genau geht, zeigen wir dir auch noch einmal ausführlich im Beitrag “Erste Schritte - Cache leeren”. Und wie du siehst, wurde dein Sidebar-Menüeintrag erstellt und ist sichtbar.
Wenn du deinen Menüpunkt noch einmal bearbeiten willst, kannst du das im Sidebar-Menü im Backend ganz einfach machen, indem du auf den „Bearbeiten“-Button klickst. Löschen kannst du einen Eintrag, indem du auf den „Löschen“-Button klickst. Und wenn du einen Menüpunkt mal deaktivieren, aber nicht löschen willst, klickst du einfach auf den „Bearbeiten“-Button und entfernst den Haken bei „Aktiv“. So wird dein Menüpunkt ausgeblendet, bis du den Haken wieder bei „Aktiv“ setzt.
