Erstellen Sie einen mobilen Navigations-Header mit Einstellungen Integration

Ich bin ein erfahrener Programmierer, aber ein völlig unerfahrener WordPress Entwickler. Ich versuche herauszufinden, wie man eine Kopfzeile erstellt, die nur für mobile Geräte angezeigt wird, und wie man die Eigenschaften dieser Kopfzeile im Dashboard-Einstellungsbereich ändert.

Ich wp_is_mobile(); , ich sollte die wp_is_mobile(); function zum Testen für Mobilgeräte. Ich bin nur ein bisschen grün, wie man das in WordPress implementiert. Meine Hauptfragen sind wie folgt:

  1. Ich glaube, ich muss mich in den Aktionshaken wp_head oder activate_wp_head einklinken, ist das korrekt?
  2. Ich möchte die colors für die Hintergrund- und Schriftfarben im Bereich der Dashboard-Einstellungen festlegen. Wie gehe ich dabei vor?
  3. Ist das ein Plugin? Ist es eine function? Diese Frage bezieht sich auf die Terminologie, die ich verwenden sollte.
  4. Letzte Frage, wo soll ich diesen Code hinstellen? Ich bin mir sicher, dass es auf ein paar der vorherigen Antworten ankommt, weshalb ich es zuletzt gefragt habe!

    Letzter Punkt zu machen, ich weiß, dass ich dies tun könnte, indem Sie den functionsaufruf get_header() direkt get_header() aber von dem kleinen Lesestück, das ich getan habe, glaube ich nicht, dass ich das tun möchte. Korrigiere mich, wenn ich falsch liege!


Danke für die Hilfe. Ich suche nicht , dass das für mich geschrieben wird. Ich bin gerade in einem Meer von WordPress verloren und bin auf der Suche nach einem Kompass!


So weiß ich jetzt, dass ich das als Plugin brauche, um meine Frage schnell zu überarbeiten, wie schreibe ich ein Plugin, das den Template-Kopf verändern kann, ohne dass es durch eine neue WordPress- oder eine neue Version überschrieben werden könnte Thema oder Kind Thema?

Solutions Collecting From Web of "Erstellen Sie einen mobilen Navigations-Header mit Einstellungen Integration"

Ich beantworte Ihre Fragen nicht in der richtigen Reihenfolge, sondern auf eine Weise, die es mir leicht macht, einem logischen Weg zu folgen.

Ich nehme an, ich sollte die wp_is_mobile () verwenden;

wp_is_mobile() ist ein guter Weg zu gehen. Nach meiner Erfahrung erkennt es die Mehrheit der mobilen Geräte, und wenn Sie sich nicht für ein ipotetic interessieren und sehr niedrige Prozent der Geräte nicht erkannt werden, können Sie es nehmen und weitermachen.

Letzter Punkt zu machen, ich weiß, dass ich dies tun könnte, indem Sie den functionsaufruf get_header () direkt ändern, aber von dem kleinen Lesestück, das ich getan habe, glaube ich nicht, dass ich das tun möchte. Korrigiere mich, wenn ich falsch liege!

Du hast vollkommen recht. Wenn Sie get_header() ändern, wird das nächste Mal, wenn WordPress ein Update erhält, Ihre Bearbeitung verloren gehen. Und ich wette, das willst du nicht.

Ich glaube, ich muss mich in den Action-Hook 'wp_head' oder 'activate_wp_head' 'wp_head' , ist das korrekt?

Nun, nicht. Letzteres ist völlig unabhängig, da es in Site-Aktivierungsseite ausgetriggers wird. Das erste feuert auf regulären Frontend-Seiten, aber innerhalb des Tags , (normalerweise kurz bevor es geschlossen wird), aber Sie möchten etwas ausgeben, also geht es in , so dass hook nicht helfen kann.

Unglücklicherweise gibt es keinen Standardweg, um Sachen im Körper von Schablonen zu implementieren, das ist völlig Gebiet des Themas.

Die große Mehrheit der WordPress-Themen verwendet jedoch eine get_header() und aus OP scheint, dass Ihr Thema keine Ausnahme macht.

Die Möglichkeit, auf diese functionen zu reagieren, ist mehr als eine, die erste und einfachste ist die Vorlage Datei direkt zu bearbeiten, und wo gibt es die get_header() ändern Sie es in:

  if ( wp_is_mobile() ) { get_header( 'mobile' ); } else { get_header(); } 

Wie Sie in Dokumenten sehen können , akzeptiert get_header() ein optionales Argument, das die benötigte Datei ändert. Tatsächlich benötigt get_header() das ohne Argumente aufgerufen wird, eine Datei namens header.php im Thema root, aber wenn Sie einen String übergeben, benötigen Sie eine Datei namens header-{$name}.php .

Wenn Sie eine Zeichenfolge übergeben, können Sie eine benutzerdefinierte Datei laden und dort alles ausgeben, was Sie ausgeben möchten (wahrscheinlich hauptsächlich aus header.php ); und du bist fertig.

Bei diesem Ansatz müssen Sie direkt auf die Vorlagendatei reagieren. Wenn Sie der Entwickler des Themas sind, dann können Sie diesen Ansatz in Betracht ziehen, aber wenn Ihr Thema von irgendwo kommt (heruntergeladen, gekauft …), dann schlage ich vor, dies nicht zu tun, weil das Thema vom Entwickler aktualisiert werden kann, und wenn Sie haben die Originaldateien bearbeitet, das ist ein großes Problem.

Abgesehen von dem Update-Problem erfordert dieser Ansatz, dass Sie alle Vorlagen ändern müssen, die get_header() aufrufen, zB index.php , single.php … und alle anderen Vorlagen, die Ihr Theme bietet.

Als erfahrener Programmierer wissen Sie sicher, dass das Wiederholen von Dingen keine gute Sache ist.

Sicherlich besser ist das Kind Thema Ansatz.

get_header() Zeilen weiter oben, ich habe gesagt, dass get_header() header.php vom Theme-Stammordner benötigt.

Das ist nicht ganz richtig.

Wenn das aktuelle Thema ein header.php Thema ist, sucht diese function zunächst nach einer Datei header.php im header.php Wenn sie nicht gefunden wird, wird das Thema im übergeordneten Thema geladen (und falls nicht gefunden, wird eine Datei mit dem core geladen).

Das heißt, wenn Sie ein header.php Thema erstellen, können Sie eine benutzerdefinierte header.php erstellen, und dort können Sie dank eines if ( wp_is_mobile() ) verschiedene Dinge für mobile Geräte tun: Auf diese Weise ruft jede Vorlage get_header() benötigt Ihre Datei anstelle des Originals.

Wenn das übergeordnete Thema aktualisiert wird, können Sie das Update problemlos erhalten. Die verknüpfte Seite in Codex sollte genügend Informationen enthalten, damit Sie ein untergeordnetes Thema erstellen können. Es ist wirklich sehr einfach.

Dies scheint eine perfekte Lösung zu sein, aber es gibt eine Möglichkeit: Sie verwenden bereits ein untergeordnetes Thema und Sie können es nicht ändern, da es von Drittanbietern entwickelt wurde und Sie (aus guten Gründen) die Möglichkeit nicht verlieren möchten von jedem Update.

Unglücklicherweise können Sie in WordPress kein untergeordnetes Thema eines untergeordneten Themas erstellen, sodass Sie nur ein Plugin erstellen können .

Das wird nicht einfach sein, nicht weil ein Plugin schwer ist, es ist get_header() einfach, das Problem ist, dass get_header() nicht filterbar ist und deine einzige Chance ist, eine Art “falsches” Thema zu erstellen, indem du alle Templates in das Plugin legst Ordner und verwenden Sie 'template_include' Filter Hook, damit WordPress Vorlagen aus Ihrem Plugin statt aus dem Theme lädt.

Ich war gezwungen, so etwas für eine Kundenarbeit zu tun, und war frustrierend.


Bearbeiten Sie 2014/10/09

Etwas zum Erstellen eines Plugins für den Bereich.

Normalerweise sollte ein Plugin unabhängig vom aktuellen Thema sein, denn wenn der Benutzer das Thema wechselt, ist das Plugin immer noch aktiv und macht seine Arbeit weiter. Aber wenn ein Plugin, wie in Ihrem Fall, Template-Dateien enthalten muss, betrachten Sie es unabhängig vom Thema, ist ziemlich irreführend.

Der Weg zu gehen, ist zu sehen, alle Vorlagen Datei Ihre Themen hat (wie gesagt, dieses Plugin ist mit Thema verbunden), aber Sie müssen nicht auf alle Dateien, sondern nur auf Vorlagen der ersten Ebene zu sehen .

Vorlagen der ersten Ebene sind diejenigen, die direkt von WordPress geladen werden.

Schauen Sie sich das Template-Hierarchie- Schema an, Vorlagen der ersten Ebene sind die dort genannten.

Es ist sehr selten, dass ein Thema alle hat, also notieren Sie, welche Vorlagen Ihr Thema verwendet.

Dank des oben erwähnten Filters 'template_include' können Sie WordPress dazu zwingen, eine andere Datei zu laden anstatt die Datei, die normalerweise geladen wird.

Nur ein grobes Beispiel. Nehmen wir an, Sie besuchen die URL für eine einzelne Post. WordPress lädt normalerweise die Datei single.php in dein Theme, um den Inhalt single.php .

Wenn dein Plugin folgendes enthält:

 add_action( 'template_include', function( $template ) { if ( is_single() ) { $template = plugin_dir_path( __FILE__ ) . 'single.php'; } return $template; } ); 

Die functionen hooking ‘template_include’ (eine anonyme function, oben) erhalten als Argument die Vorlagedatei, die WordPress lädt, und was auch immer es zurückgibt, wird von WordPress geladen.

Im obigen Ausschnitt habe ich überprüft, ob die aktuelle Abfrage für einen einzelnen Post ist und in diesem Fall die Datei 'single.php' aus dem Plugin-Ordner laden.

Wenn Sie für alle Abfragetypen wiederholen müssen ( is_page() , is_archive() , is_search() usw.), ist das überwältigend, aber wenn Sie in Ihrem Plugin-Ordner eine Version aller Vorlagen der ersten Ebene haben, die Ihr Thema verwendet, Sie können etwas tun wie:

 add_action( 'template_include', function( $template ) { $template = plugin_dir_path( __FILE__ ) . basename( $template ); return $template; } ); 

Diese wenigen Codezeilen überschreiben die Theme-Dateien vollständig und zwingen WordPress dazu, immer die Templates zu laden, die auf die gleiche Weise benannt sind, aber in Ihrem Plugin-Ordner statt in Theme One.

Nun, was sollten diese Dateien in Ihrem Plugin-Ordner enthalten? Dort solltest du versuchen, so wenig wie möglich zu schreiben, aber es hängt wirklich von deinem Thema ab.

Nehmen wir an, die single.php Ihres Themes enthält nur:

 get_header(); get_template_part( 'navigation' ); get_template_part( 'content', get_post_type() ); get_sidebar(); get_footer(); 

Das ist eine sehr gute Sache für Sie, denn Sie können es in Ihren Plugin-Ordner kopieren und so modifizieren:

 if ( wp_is_mobile() ) { require_once . plugin_dir_path( __FILE__ ) . 'mobile-header.php'; } else { get_header(); } get_template_part( 'navigation' ); get_template_part( 'content', get_post_type() ); get_sidebar(); get_footer(); 

Daher werden fast alle Inhalte immer noch aus dem Thema geladen, da get_header() get_template_part() , get_sidebar() und get_footer() Vorlagen aus dem get_footer() laden und Sie nur die Kopfzeile für mobile Geräte außer Kraft setzen.

Wenn Ihre Theme-Vorlagendateien jedoch eine Menge HTML-Markup enthalten, können Sie das Markup nur in Plugin-Vorlagen kopieren und einfügen.

Die schlechten Dinge sind:

  • Wenn Sie das Thema wechseln, müssen Sie Ihr Plugin komplett neu schreiben, oder wenn das neue Thema, das Sie installieren, kein untergeordnetes Thema ist, ist es besser, das Plugin zu löschen und ein Kind-Thema zu wählen .

  • Wenn das Thema aktualisiert wird, wird Ihr Plugin in keiner Weise berührt, aber wahrscheinlich, wenn das Update das Markup von Theme Templates geändert hat (das ist nicht sicher, viele Male Thema Updates sind für Bugs in functions.php ) werden Sie Wahrscheinlich müssen Sie das Markup auch in Ihren Plugin-Vorlagen aktualisieren.

Ja, es ist annoting, und jetzt kennen Sie den Grund meiner Frustration, die ich oben erwähnt habe.


Letzte Frage, wo soll ich diesen Code hinstellen? Ich bin mir sicher, dass es auf ein paar der vorherigen Antworten ankommt, weshalb ich es zuletzt gefragt habe!

Wenn Ihr aktuelles Thema kein header.php Thema ist oder ein von Ihnen selbst erstelltes header.php Thema ist, wird das einfache Hinzufügen oder Bearbeiten von header.php einen Großteil der Arbeit erledigen.

In Bezug auf den Teil, der die Optionen visualisiert und speichert, kann dies in einer oder mehreren Dateien erfolgen, die von child theme functions.php wenn Sie sich für den Child Theme Weg entscheiden, ansonsten können es nur eine oder mehrere Dateien des Plugins sein.

Ich möchte die colors für die Hintergrund- und Schriftfarben im Bereich der Dashboard-Einstellungen festlegen. Wie gehe ich dabei vor?

Ich kann nur die WordPress Einstellungs-API vorschlagen. Auf der verknüpften Seite in Codex sollten Sie genügend Informationen finden, um mit der Kodierung beginnen zu können, schauen Sie sich auch die Links im Abschnitt “Externe Referenzen” an , Sie finden Beispiele und Erläuterungen.

Nachdem Sie es geschafft haben, dass Ihre Einstellungsseite funktioniert, können Sie alle Einstellungen für Ihre Kopfzeile mit einem einzigen get_option() Aufruf abrufen und diese verwenden, um Ihre benutzerdefinierte Kopfzeile zu erstellen.