⬇️ Dropdown-Header

Hallo Keegan, ich versuche, hier einen Hintergrund hinzuzufügen, damit es wie ein Button aussieht, aber wenn ich mehrere Header-Links habe, die mit der Sicherheitseinstellung ausgeblendet sind, sehe ich immer noch einen Rest des ausgeblendeten Menüs. Gibt es eine Möglichkeit, dies zu vermeiden? Danke!

Bearbeiten: Ich habe herausgefunden, dass dies durch das Hinzufügen von Padding geschah, um es wie einen Button aussehen zu lassen. Ich kann darauf verzichten, wenn es keine einfache Lösung gibt.

.custom-header-links .top-level-links .custom-header-link {
    padding: 10px 20px;
    border-radius: 5px;
    background: var(--tertiary);
}

image

Bearbeiten 2:
Egal, ich musste nur kreativ werden!

.custom-header-links .top-level-links .custom-header-link {
    padding: 10px 0px;
    border-radius: 5px;
    background: var(--tertiary);
}

.custom-header-links .top-level-links .custom-header-link-caret svg {
    padding-right: 10px;
}

.custom-header-links .top-level-links .custom-header-link-icon {
    padding-left: 10px;
}
2 „Gefällt mir“

Hallo Keegan, wenn ich versuche, die Sicherheitsfunktion mit den folgenden Einstellungen zu verwenden, verschwinden die letzten beiden Links einfach, selbst wenn ich sie von einem Konto aus anzeige, das berechtigt ist, die Links anzuzeigen (d. h. zur Benutzergruppe „company_staff“ gehört).

Verwende ich die Funktion falsch?

Danke.
@keegan


Hallo @kenjdarhan,

Es sieht so aus, als ob die headerLinkId für die letzten beiden Links auf 1 und 2 zeigt. Ich denke, sie sollte 0 sein, wenn sie im selben Dropdown erscheinen soll.

Hallo, ich habe die Dropdown-Header-Komponente verwendet und sie war unglaublich benutzerfreundlich und für uns äußerst hilfreich. Es wäre jedoch noch besser, wenn sich die Links im Dropdown-Menü in neuen Tabs öffnen würden. Ich freue mich auf Ihre Antwort.

1 „Gefällt mir“

PR willkommen oder kontaktieren Sie uns, um die Arbeit zu sponsern.

Hallo, ich bin neu bei Font Awesome und habe Schwierigkeiten, die Icons angezeigt zu bekommen.
Das ist es, was ich bisher habe. Kann mir bitte jemand helfen?

Haben Sie die ungewöhnlichen zu dieser globalen Einstellung hinzugefügt?:

Oh mein Gott, danke! Ich habe sie immer wieder im <i>-Format angehängt und es hat nichts gebracht. Danke dafür.

2 „Gefällt mir“

Grüße!

Könnten Sie erläutern, welcher Aspekt Ihrer Vorlage die Positionierung von Symbolen/Schaltflächen ermöglicht hat, die auf alternative Seiten auf Ihrer Website verlinken?
image

Ich war besonders bezaubert von der Präsentation dieser Schaltflächen in der mobilen Version – sie sind in der mobilen Iteration hervorragend oberhalb des Titels in Form von Symbolen angeordnet.

:+1:

1 „Gefällt mir“

Hallo, danke für deine Antwort :blush:.

Um die Navigation zwischen allen Bereichen meiner Website (einschließlich des Forums) flüssiger zu gestalten, habe ich mich entschieden, einen HTML-Code mit dieser responsiven Navbar zu erstellen und die Dropdown-Komponente zu eliminieren.

Wie du auf diesen anderen Seiten, die Teil derselben Website sind, sehen kannst, habe ich denselben Code eingefügt, um alle Links nur einen Klick entfernt zu haben :grin:

https://oii.francescomancuso.it/

https://oii.francescomancuso.it/risorse/

http://oii.francescomancuso.it/contest/

https://oii.francescomancuso.it/ranking/

1 „Gefällt mir“

Wie behebt man das eigentlich, ich kann das Symbol immer noch nicht anzeigen lassen :smiling_face_with_tear:

@merefield Tolles Component!
Das Menü ist auf Mobilgeräten nicht sichtbar. Wenn die Links rechts positioniert sind, erscheint das Caret-Symbol, aber es zeigt nur die Dropdown-Links, aber nicht die Menü-Links. Was übersehe ich hier?
Ich habe Screenshots der Desktop-Ansicht, der mobilen Ansicht und der aktuellen Einstellungen beigefügt.


Mobile Ansicht:


Ich wäre Ihnen für Ihre Hilfe sehr dankbar!
Danke.

1 „Gefällt mir“

Hallo @Joe_Nguyen, ich habe diese Komponente gerade installiert und sie funktioniert wie erwartet, sowohl in der mobilen als auch in der Desktop-Ansicht. Könnten Sie vielleicht Screenshots von Ihren Einstellungen posten, wenn Sie auf die Schaltflächen „Editor starten“ in den Komponenteneinstellungen klicken? Ich bin mir nicht sicher, was dort vor sich geht, Sie sollten in der mobilen Ansicht mehr sehen :thinking:

2 „Gefällt mir“

Bei mir funktioniert es genauso wie bei Lily.

Mir ist aufgefallen, dass Sie die responsiven Fenster in Chrome verwenden. Wenn Sie dies tun, laden Sie die Seite mindestens einmal neu (F5), da Sie sonst die mobile Ansicht nicht sehen.

Sie können auch sicherstellen, dass Sie die mobile Ansicht verwenden, indem Sie ?mobile_view=1 an die Forum-URL anhängen.

3 „Gefällt mir“

@Lilly Hier sind meine Einstellungen:

@Arkshine - Wenn ich ?mobile_view=1 zur URL hinzufüge, sehe ich den Dropdown-Pfeil.

Danke!

2 „Gefällt mir“

Sind Sie sicher, dass Sie auf Ihrem Handy nicht im Desktop-Modus sind?

1 „Gefällt mir“

Hallo @Lilly! Ich sehe jetzt das Dropdown-Menü auf dem Handy. :grinning: Ich muss herausfinden, wie ich die Links in einem neuen Fenster öffnen kann.

1 „Gefällt mir“

Das ist etwas, das ich normalerweise die Benutzer in ihren Präferenzen/Oberflächeneinstellungen einrichten lasse, da Menschen, die Screenreader verwenden, durch das Überschreiben und Öffnen von Links in neuen Fenstern oder Tabs nachteilig beeinflusst werden.

Nochmals vielen Dank @Lilly @Arkshine für Ihre Hilfe!

1 „Gefällt mir“

Gern geschehen, ich freue mich, dass es geholfen hat.

@Arkshine hat die ganze Arbeit gemacht, ich habe nur Kommentare gepostet LOL :laughing:

2 „Gefällt mir“