Menüpunkte durch Bilder ersetzen

[Coulyo]

Hey, Folks!

Ich arbeite gerade für einen Kunden an einer Wordpress-Webseite.
Wie bei Webseiten so üblich gibt es eine Navigation Diese soll hier allerdings nicht aus Text bestehen, sondern aus Symbolen. Das Menü soll jedoch weiterhin dynamisch über das WP-Backend generiert werden und nicht hardcoded sein, damit der Kunden später Seiten hinzufügen und wegnehmen kann. Damit der Kunde später Menüpunkten auch selbst Symbole hinzufügen kann, muss ich jetzt eine Lösung finden den Text der Menüpunkte durch Bildchen zu ersetzen, ohne dass man den Quellcode anrühren muss.
Das einfachste was ich bisher gefunden habe ist die Methode die hier unter 3. beschrieben wird. Selbst das ist einem vollkommenen Laien aber nur schwer beizupulen, vor allem wenn er das nur einmal alle Jubeljahre macht.
Was ich mir eigentlich vorstelle ist ein Auswahldialog mit einem Button "Datei auswählen", wo man dann aus der Mediathek ein Bildchen auswählen kann und der Text wird automatisch dadurch ersetzt. Gibt es dafür vielleicht ein Plug-In? Oder kann man das in ein Wordpress-Theme reinprogrammieren?

Bin gespannt auf Vorschläge

 

[Pixelaner]

Heyho,

um das so einfach wie möglich für den Endkunden zu machen hätte ich folgenden ersten Lösungsansatz im Kopf:

Du kannst über das Plugin Advanced Custom Fields und den Erweiterungen Optionspage und Repeaterfeld eine Optionsseite namens Navigation erstellen. Darin enthalten ist ein Repeaterfeld mit den Subfeldern "Icon, Seitenauswahl, Linktitel".

Das Subfeld Icon ist ein ganz normaler Bildwähler (Typ Bild). Da kannst du dir die ID als Rückgabewert zu nutze machen ( Bild holen: wp_get_attachment_image($id, 'full') ).

Das Subfeld Seitenauswahl ist vom Typ Relationship und darüber kannst du dir die ID des Artikels oder der Seite zurückgeben lassen und später mittels get_permalink($id) im Menü darauf verweisen.

Das Letzte Feld "Linktitel" ist vom Typ Text und sollte selbsterklärend sein.

Nun kannst du das Repeaterfeld der Optionsseite im Frontend auslesen und mittels Schleife durchlaufen lassen. Nu erstellst du dein Markup wie du es brauchst drückst F5 und fängst an zu lächeln weil die Lösung so sexy ist

Allerdings sind die Zusatzaddons von ACF nicht kostenlos. Ich glaub da bezahlst du n Appel und n Ei für. Aber um dir viele Stunden zu sparen würde ich darauf setzen.

Beste Grüße und einen schönen dritten Advent.

ACF Plugin
Codex:
Codex:

 

[Coulyo]

Danke! Das hört sich auf den ersten Blick ziemlich vernünftig an. Ich werds mal ausprobieren

 

[lachender_engel]

Wenn Du die Icon nur bei Seiten machst, ist das MEnü nicht mehr dynamisch. Denn Du kannst auch andere Menü-Einträge einrichten.
Daher mein Tipp (so hatte ich das in einem Projekt gemacht) ist, den Bildnamen in Abhägigkeit vom Slug des Menüeintrages zu wählen. Das heißt, wenn Der Slug des Menüeintrages /autofahren/ lautet gibst Du z.B. das Bild autofahren.jpg aus.
Der Vorteil dabei ist, es ist egal ob der Menüeitrag durch eine Seite, eine Kategorie, einen Beitrag, oder was auch immer entsteht.

 

[Pixelaner]

Allerdings müsste er bei der Variante schon vorher wissen, welche Slugs der Kunde in Zukunft anlegt und dementsprechend die Icons vorbereiten. Mit der Dynamik gebe ich dir in jedem Fall recht. Das müsste in meinem Lösungsansatz zu jeder Seite / Beitrag nachgetragen werden.

Eventuell hier noch ein Nachtrag zu meinem vorhergehenden Post.

 

[dn3d_fanboy]

Wenn du es über ein Plugin lösen willst, ist vielleicht das hier interessant: https://wordpress.org/plugins/nav-menu-images/

Läuft auch unter WP 4.0.1 problemlos.

 

[lachender_engel]

Allerdings müsste er bei der Variante schon vorher wissen, welche Slugs der Kunde in Zukunft anlegt und dementsprechend die Icons vorbereiten.

Nein. Der Kunde legt den Menüeintragt an, kennt den Slug und lädt über den Medienmanager ein entsprechendes Bild hoch. Das war es!
Nicht zu kompliziert denken sondern einfach machen ;-)