Hinweis in der Topbar einfügen oder bearbeiten

So zeigst du in der Topbar einen eigenen Hinweis an, z. B. zum Versand, und ergänzt ihn mit einem Icon.

  • 2 Min. Lesezeit

In der Topbar kannst du zwischen dem Google Translator und den Links einen eigenen Hinweis anzeigen – zum Beispiel „Wir versenden noch am selben Tag mit DHL.“ Das funktioniert im Remake und im Avantus Template gleich. Unterschiedlich sind nur die Icons.

Hinweis einfügen oder bearbeiten

Im JTL-Shop 5 ist der Hinweis standardmäßig leer. Du trägst ihn über die Sprachvariablen ein.

  1. Öffne im Backend Administration > Sprachvariablen.
  2. Wähle oben die gewünschte Sprache aus, z. B. „Deutsch“.
  3. Gib im Feld „Suche“ den Begriff topbar ein und klicke auf die Lupe.
  4. In der Ergebnisliste erscheint die Variable topbarNote in der Sektion global.
  5. Trage in der Spalte „Inhalt“ deinen Text ein.
  6. Klicke unten auf „Speichern“.

Betreibst du deinen Shop in mehreren Sprachen, wiederhole die Schritte für jede Sprache.

Remake Template: Hinweis mit einem Icon ergänzen

Das Remake Template enthält die kostenlose Version von Font Awesome 5. Damit kannst du deinen Hinweis mit einem passenden Icon kombinieren.

  1. Suche in der Font-Awesome-Icon-Suche ein Icon aus und klicke darauf.
  2. Wechsle im geöffneten Fenster auf den Reiter „HTML“ und kopiere den angezeigten Code.
  3. Füge den Code in der Sprachvariable topbarNote vor deinem Text ein.

Du kannst dem Icon weitere CSS-Klassen hinzufügen, zum Beispiel für Abstände oder die Farbe:

<i class="fas fa-truck mr-2 text-primary"></i> Wir versenden noch am selben Tag mit DHL.

  • fas fa-truck: das Lkw-Icon von Font Awesome
  • mr-2: Abstand rechts vom Icon
  • text-primary: Primärfarbe deines Templates

Avantus Template: Hinweis mit einem Icon ergänzen

Das Avantus Template nutzt Lucide Icons. Eine Anleitung zum Einbinden folgt in Kürze.

Weiterführende Artikel

War dieser Artikel hilfreich?