So erstellen Sie eine benutzerdefinierte Navigationsleiste (WordPress)

Ich habe eine Anforderung zum Erstellen einer benutzerdefinierten Navigationsleiste, um die vorhandene auf einer WordPress-Website zu ersetzen. Ich bin anständig bei CSS, bin aber noch nie auf so etwas gestoßen.So erstellen Sie eine benutzerdefinierte Navigationsleiste (WordPress)

Ich habe mehrere Möglichkeiten gefunden, die vorhandene Navigationsleiste zu entfernen, so dass es kein Problem ist, aber das Hinzufügen der Svg mit Links, die relativ zu der Svg sind.

Die Navigationsleiste soll etwas so aussehen navigation bar

Quelle

2016-12-23 Rey Garcia

Willkommen bei Stack-Überlauf! Um Ihnen eine gute Antwort zu geben, könnte es uns helfen, wenn Sie einen Blick auf [fragen] haben, falls Sie das nicht bereits getan haben. Es könnte auch nützlich sein, wenn Sie ein [mcve] bereitstellen könnten. Was hast du bis jetzt gemacht? – Mat

Wussten Sie, dass es eine Stack Exchange-Site für [wordpress] (http://wordpress.stackexchange.com/) gibt, könnte es sein, dass Ihre Frage dort besser funktioniert, wenn Sie die [help center] (http: // wordpress) aufrufen .stackexchange.com/help/on-topic) –

@RobertLongson Ich wusste nicht, dass es existiert. Danke, Mann! –

Ich glaube, Sie dies aus zwei verschiedenen Winkeln nähern können.

1 - Sie wollen nicht/kann nicht PHP

Sie können ein benutzerdefiniertes Menü durch Admin-Panel Wordpress erstellen.

Fügen Sie spezifische Klassen zu Schaltflächen hinzu (indem Sie das CSS-Klasseneigenschaftsfeld auf den Menüschaltflächen mithilfe der Option "Bildschirmoptionen" aktivieren: in der rechten oberen Ecke der Seite).

Dann sould Sie 2 Klassen müssen:

eine Klasse für die Links auf der ersten Zeile (wer/was/wie)
eine andere Klasse für den Link in der zweiten Reihe (Kontakt)

und passen Sie die CSS-Regeln so an, dass Links wie gewünscht angezeigt werden.

Endlich würde ich die "Wolke" Svg als Hintergrund des gesamten Menüs anzeigen.

Das eigentliche Problem ist, dass Wordpress Ausgabe alle Menüpunkte wie li in einem ul, so sollten Sie vielleicht 2 differents Menü erstellen (eine pro Zeile), und zeigt die beiden Menüs in einem eigenen Behälter.

2 - Sie wollen/können/bevorzugen PHP

Diese Alternative von Wordpress nimmt Menu Walker Vorteil zu nutzen, indem Sie eine benutzerdefinierte Gehhilfe zu schaffen es

Die Idee erstreckt, ist, dass durch Customizing Mit dieser PHP-Klasse können Sie angeben, wie WordPress Ihr Menü (oder Ihre Menüs) rendern soll, indem Sie die HTML-Ausgabe definieren.

Hier einige Links, Ihnen zu helfen tun:

https://gist.github.com/kosinix/5544535

https://code.tutsplus.com/tutorials/understanding-the-walker-class--wp-25401

http://jamescollings.co.uk/blog/wordpress-custom-walker-output-section-of-menu/

Sobald Sie benutzerdefinierte Menü Ausgang ist OK, man muss nur wenn die erzeugte HTML anpassen CSS.

Hinweis: der zweite Ansatz kann ein Abenteuer sein, wenn Sie nicht komfortabel genug, um mit PHP sind

Quelle

2016-12-23 13:59:21 Dexter0015