Header-Untermenüs

:discourse2: Zusammenfassung Header-Untermenüs ermöglichen es Ihnen, ein Header-Menü mit Untermenüs in reinem Text zu erstellen!
:eyeglasses: Vorschau Vorschau im Discourse Theme Creator
:hammer_and_wrench: Repository-Link https://github.com/discourse/discourse-header-submenus
:open_book: Neu bei Discourse Themes? Anfängerleitfaden zur Verwendung von Discourse Themes

Dieses Theme-Komponente installieren

Funktionen

Desktop

Mobil

Einstellungen

Name Beschreibung
Menüpunkte Menüpunkte hinzufügen. Ein Punkt pro Zeile in dieser Reihenfolge: Text, Icon, Titel, Ansicht.
Untermenüpunkte Untermenüpunkte hinzufügen. Ein Punkt pro Zeile in dieser Reihenfolge: Übergeordnet, Text, Icon, URL, Ziel, Titel.
Svg-Icons FontAwesome-Icon-Klassen für jedes in den obigen Listen verwendete Icon einfügen.
Fixierter Modus Erzwingt, dass das Menü unabhängig von der Scroll-Position oben auf dem Bildschirm sichtbar bleibt – Nur Desktop
Pfeil anzeigen Pfeil-Icons neben Menüpunkten anzeigen
Position umkehren Menüpunkte auf der gegenüberliegenden Seite des Bildschirms anzeigen
Menühintergrund Hintergrundfarbe für das Menü. (hex, rgb, rgba oder CSS-Farbbezeichnung)
Menüpunktfarbe Farbe für Menüpunkte. (hex, rgb, rgba oder CSS-Farbbezeichnung)
Menüpunkt-aktiv-Hintergrund Hintergrundfarbe für Menüpunkte, wenn aktiv. (hex, rgb, rgba oder CSS-Farbbezeichnung)
Menüpunkt-aktiv-Farbe Farbe für Menüpunkte, wenn aktiv. (hex, rgb, rgba oder CSS-Farbbezeichnung)
Untermenühintergrund Hintergrundfarbe für Untermenüs. (hex, rgb, rgba oder CSS-Farbbezeichnung)
Untermenüpunktfarbe Farbe für Untermenüpunkte. (hex, rgb, rgba oder CSS-Farbbezeichnung)
Untermenüpunkt-Hover-Hintergrund Hintergrundfarbe für Untermenüpunkte beim Hover. (hex, rgb, rgba oder CSS-Farbbezeichnung)
Untermenüpunkt-Hover-Farbe Farbe für Untermenüpunkte beim Hover. (hex, rgb, rgba oder CSS-Farbbezeichnung)
Trennlinienfarbe Farbe für Trennlinien in Untermenüs. (hex, rgb, rgba oder CSS-Farbbezeichnung)

Es gibt vier Gruppen von Einstellungen

  1. Menüpunkte

    Geben Sie die Punkte ein, die im Menü erscheinen sollen. Ein durch Komma getrennter Punkt pro Zeile in dieser Reihenfolge

    Text, Icon, Titel, Ansicht

    Text: Was im Menü angezeigt wird.
    Icon: Das Icon, das neben dem Punkt angezeigt wird. Wenn Sie kein Icon verwenden möchten, verwenden Sie none.
    Titel: Der Text, der beim Hover über den Punkt angezeigt wird.
    Ansicht: Wählen Sie, auf welchen Geräten der Punkt angezeigt wird.

    ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ vdm erscheint sowohl auf Desktop als auch auf Mobilgeräten
    ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ vdo erscheint nur auf Desktops,
    ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ ‏‏‎ vmo erscheint nur auf Mobilgeräten.

    Aufgrund des begrenzten Platzes wird empfohlen, auf Mobilgeräten nicht mehr als 3-4 Punkte hinzuzufügen.

  2. Untermenüpunkte

    Geben Sie eine Liste der Untermenüpunkte ein, die Sie zu Ihrem Menü hinzufügen möchten. Ein durch Komma getrennter Punkt pro Zeile in dieser Reihenfolge

    Übergeordnet, Text, Icon, URL, Ziel, Titel

    Übergeordnet: Der Name des übergeordneten Menüpunkts, unter dem dieser Untermenüpunkt angezeigt werden soll. Verwenden Sie den Text-Wert aus der obigen Liste.
    Text: Der Text, der für diesen Untermenüpunkt angezeigt wird.
    Icon: Das Icon für diesen Untermenüpunkt; verwenden Sie none, wenn kein Icon benötigt wird.
    URL: Der Pfad, zu dem dieser Menüpunkt verlinkt. Sie können auch relative Pfade verwenden.
    Ziel: Wählen Sie, ob dieser Punkt in einem neuen Tab oder im gleichen Tab geöffnet wird. Verwenden Sie blank, um den Link in einem neuen Tab zu öffnen, oder self, um ihn im gleichen Tab zu öffnen.
    Titel: Der Text, der beim Hover über den Punkt angezeigt wird.
    Trennlinien: Sie können auch Trennlinien zwischen Untermenüpunkten hinzufügen. Um eine Trennlinie hinzuzufügen, verwenden Sie parent, divider.

Hier ein kurzes Beispiel, um die Punkte 1 und 2 abzudecken:

Nehmen wir an, ich möchte einen Menüpunkt namens Design hinzufügen und ein paar Punkte zu seinem Untermenü hinzufügen, wie folgt:

Ich würde dies zuerst als menu_item eingeben:

Design, magic, Get inspired!, vdm

Und dann diese als sub_menu-Punkte eingeben:

Design, Galleries, th, #, blank, Cool galleries for you to look at.
Design, Design process, lightbulb-o, #, blank, Learn the basics.
Design, Blog design, columns, #, blank, What makes for a great blog?
Design, divider
Design, Freebies, gift, #, blank, Everyone likes freebies!
Design, Photoshop tutorials, book, #, blank, Photoshop for beginners.
Design, Design trends, bar-chart, #, blank, Stay on top of the current trends!

Das war’s!

Das Theme wird standardmäßig mit einem Platzhalter-Menü geliefert, also werfen Sie einen Blick darauf und fragen Sie, wenn Sie Fragen haben.

  1. Layout-Optionen.

    Diese sind ziemlich selbsterklärend

  2. Farboptionen

    Diese sind standardmäßig leer, aber wenn Sie hier eine Farbe hinzufügen, überschreibt sie die Standards des Components, die auf dem aktuellen Farbschema basieren.


:discourse2: Von uns gehostet? Theme-Komponenten können in unseren Standard-, Business- und Enterprise-Plänen verwendet werden.

89 „Gefällt mir“