Hinzufügen von benutzerdefinierten Feldern zu Anlagen

Sie sollten mit benutzerdefinierten Feldern in WordPress vertraut sein. Wir verwenden sie in einem Beitrag oder auf einer Seite, um zusätzliche Daten hinzuzufügen. In WordPress werden Anhänge auch als Beiträge gespeichert, sodass auch benutzerdefinierte Felder verfügbar sind.

Heute werden wir sehen, wie wir einige benutzerdefinierte Felder hinzufügen können, damit Anhänge mehr Informationen als nur die Standarddaten enthalten können.

Was machen wir?

Zunächst erstellen wir ein Plugin, um die benutzerdefinierten Felder von Anhängen zu bearbeiten. Es wird eine Reihe von Optionen erhalten, backen Sie sie, damit sie Bestandteil des Formulars werden, wenn Sie einen Anhang bearbeiten, und speichern Sie sie in der Datenbank.

Dafür verwenden wir zwei WordPress-Hooks:

attachment_fields_to_edit das Bearbeitungsformular bearbeiten
attachment_fields_to_save um die benutzerdefinierten Felder zu speichern

1. Erstellen Sie das Plugin

Ich werde diesen Teil schnell durchgehen, da dies nicht der Hauptzweck dieses Tutorials ist.

Erstellen Sie einen neuen Ordner im Plugins-Verzeichnis (wp-content / plugins / medienfelder / zum Beispiel) und legen Sie eine Datei (genannt plugin.php) Innerhalb. Setzen wir auch eine Datei mit dem Namen custom_media_fields.php das wird unsere Optionen halten.

Das ist was dein plugin.php Datei sollte auf den ersten Blick aussehen:

 / * Plugin-Name: Wptuts + Custom Media Fields Plugin-URI: Beschreibung: Benutzerdefinierte Felder für Anhänge erstellen Version: 0.1 Autor: Guillaume Voisin Autor-URI: http://wp.tutsplus.com/author/guillaumevoisin Lizenz: GPL2 * / required_once (plugin_dir_path ( __FILE__). '/Custom_media_fields.php'); Klasse Wptuts_Custom_Media_Fields private $ media_fields = array (); Funktion __construct ($ fields)  öffentliche Funktion applyFilter ($ form_fields, $ post = null)  Funktion saveFields ($ post, $ attachment)  $ cmf = neue Wptuts_Custom_Media_Fields ($ attchments_options);

Dies ist die Basis, die wir in den folgenden Abschnitten ausfüllen werden. Definieren wir zunächst unsere Optionen.

2. Definieren Sie unsere Optionen

Fügen Sie in der anderen Datei einige Optionen hinzu, um das Bearbeitungsformular für Anhänge zu verbessern. In diesem Tutorial werden Optionen zur Verbesserung der Bilder behandelt. Beispielsweise fügen wir Felder für Urheberrecht, Autorbeschreibung, Wasserzeichen, Bewertung und Bilddisposition hinzu.

 $ themename = "twentytwelve"; $ attchments_options = array ('image_copyright' => array ('label' => __ ('image copyright', $ themename), 'input' => 'text', 'hilft' => __ ('Wenn Ihr Bild geschützt ist durch Urheberrechte ', $ themename),' application '=>' image ',' exclusions '=> array (' audio ',' video '),' required '=> true,' error_text '=> __ (' Copyright-Feld erforderlich ', $ themename)),' image_author_desc '=> array (' label '=> __ (' Beschreibung des Image-Autors ', $ themename),' input '=>' textarea ',' application '=>' image ', 'Ausschlüsse' => array ('audio', 'video'),), 'image_watermark' => array ('label' => __ ('Bildwasserzeichen', $ themename), 'input' => 'Ankreuzfeld', 'application' => 'image', 'exclusions' => array ('audio', 'video')), 'image_stars' => array ('label' => __ ('image rating', $ themename), ' Eingabe '=>' Radio ',' Optionen '=> Array (' 0 '=> 0,' 1 '=> 1,' 2 '=> 2,' 3 '=> 3,' 4 '=> 4) , 'application' => 'image', 'exclusions' => array ('audio', 'video')), 'image_disposition' => array ('label' => __ ('image di sposition ', $ themename),' input '=>' select ',' options '=> array (' portrait '=> __ (' portrtait ', $ themename),' landscape '=> __ (' landscape ', $ Themenname)), 'Anwendung' => 'Bild', 'Ausschlüsse' => Array ('Audio', 'Video')));

Es ist im Grunde ein assoziatives Array, das diese Parameter enthält:

Etikette - Der Feldname, der angezeigt wird
Eingang - der Eingabetyp (z. B. Text, Auswahl, Radio,…)
hilft - Informationen, die dem Benutzer helfen, das Feld auszufüllen
Anwendung - welche attchment-Mime-Art angewendet werden soll
Ausschlüsse - welche attchment mime type ausschließen soll
erforderlich - ist das Feld erforderlich? (Standard falsch)
error_text - optionales Feld zur Beschreibung des Fehlers (falls erforderlich auf gesetzt wahr)
Optionen - optionales Feld für Radio und Select-Typen
show_in_modal - ob das Feld in modal angezeigt werden soll oder nicht (Standardeinstellung) wahr)
show_in_edit - ob das Feld in der klassischen Bearbeitungsansicht angezeigt werden soll oder nicht (Standardeinstellung) wahr)
extra_rows - zusätzliche Zeilen zum Anzeigen des Inhalts (innerhalb desselben "tr" Etikett)
tr - zusätzliche Zeilen ("tr" Etikett)

Die hervorgehobenen Optionen stellen Optionen dar, mit denen wir manuell umgehen, während andere Standardeinstellungen sind, die WordPress automatisch verarbeitet.

Wenn wir es mit Bildern zu tun haben, setzen wir die Anwendung Parameter zu "Bild". Es wird tatsächlich für alle Arten von Bildern gelten, deren Mime-Typ mit"Bild" sowie image / jpeg, image / png und so weiter. Sie könnten das ausschließen gif MIME-Typ, indem Sie ihn beispielsweise in das Ausschlussfeld setzen.

Nun sind unsere Optionen festgelegt, lasst uns in die Haken greifen.

3. Die Haken

Wie bereits erwähnt, behandeln wir zwei Haken.

Wir binden unsere beiden Funktionen an diese Hooks in der Konstruktormethode.

 Funktion __construct ($ fields) $ this-> media_fields = $ fields; add_filter ('attachment_fields_to_edit', array ($ this, 'applyFilter'), 11, 2); add_filter ('attachment_fields_to_save', array ($ this, 'saveFields'), 11, 2);

Nun sehen wir uns diese Haken im Detail an.

`attachment_fields_to_edit`

Es hat zwei Parameter:

$ form_fields - Ein Feld von Feldern, die im Bearbeitungsformular für Anhänge enthalten sind
$ post - Objekt, das den Anhang selbst darstellt

Wir werden die verwenden $ form_fields Parameter, um unsere eigenen Felder zusammenzuführen und jedes dieser Felder mit den Anforderungen für den Anhang zu vergleichen (zB MIME-Typ).

 public function applyFilter ($ form_fields, $ post = null) // Wenn unser Fields-Array nicht leer ist, wenn (! empty ($ this-> media_fields)) // Wir durchsuchen unseren Optionssatz nacheach ($ this-> media_fields) as $ field => $ values) // Wenn das Feld mit dem aktuellen Anhang-Mime-Typ // übereinstimmt und nicht zu den Ausschlüssen if (preg_match ("/". $ values ['application']. "/", $ post-> post_mime_type) &&! in_array ($ post-> post_mime_type, $ values ['exclusions']))) // Wir erhalten den bereits gespeicherten Feld-Meta-Wert $ meta = get_post_meta ($ post-> ID, '_'. $ field, true); // Definiere den Eingabetyp standardmäßig auf 'text' $ values ['input'] = 'text'; // Und setze es auf das Feld, bevor du es erstellt hast $ values ['value'] = $ meta; // Wir fügen unser Feld in das $ form_fields-Array ein $ form_fields [$ field] = $ values;  // Wir geben das ausgefüllte Array $ form_fields zurück und geben $ form_fields zurück.

In diesem Schritt sollten Sie das Formular zum Bearbeiten von Anhängen mit den neuen Feldern, die wir hinzugefügt haben, verbessern lassen. Sie werden jedoch wie Texteingaben aussehen. Wir müssen nun verschiedene Arten von Eingängen berücksichtigen (Radio, Checkbox usw.)..

Lassen Sie uns also unsere Funktion bearbeiten, um damit umzugehen. Ersetze das $ values ['input'] = 'text'; mit dem folgenden Code:

 switch ($ values ['input']) default: case 'text': $ values ['input'] = 'text'; brechen; case 'textarea': $ values ['input'] = 'textarea'; brechen; case 'select': // Der Typ ist nicht vorhanden, daher wird die HTML-Datei manuell erstellt. // Dafür müssen wir den Eingabetyp auf 'html' setzen. $ values ['input'] = 'html'; // Erstellen Sie das Auswahlelement mit dem richtigen Namen (entspricht dem Element, das WordPress für benutzerdefinierte Felder erstellt). $ Html = ''; // Setzt den HTML-Inhalt $ values ['html'] = $ html; brechen; case 'checkbox': // Checkbox-Typ existiert nicht entweder $ values ['input'] = 'html'; // Aktiviere das Kontrollkästchen oder nicht, wenn ($ meta == 'on') $ checked = 'checked = "checked"'; else $ checked = "; $ html = ''; $ values ['html'] = $ html; break; case 'radio': // Radiotyp ist nicht vorhanden entweder $ values ['input'] = 'html'; $ html =" ; if (! empty ($ values ['options'])) $ i = 0; foreach ($ values ['options'] als $ k => $ v) if ($ meta == $ k) $ checked = 'checked = "checked"'; else $ checked = "; $ html. = '  ". $ v."
'; $ i ++;  $ values ['html'] = $ html; brechen;

Jetzt können wir gängige HTML-Elemente erstellen. Schauen wir uns unser Formular zur Bearbeitung von Anhängen an. Es sollte genau so aussehen:

Formular zur Bearbeitung von Anhängen mit benutzerdefinierten Feldern

Die benutzerdefinierten Felder werden, je nachdem, ob Sie für ihre modalen Optionen "true" festgelegt haben, auch im modalen Medienformular angezeigt, wenn Sie einen Beitrag bearbeiten.

Benutzerdefinierte Felder in modal

Jetzt werden unsere Felder in unserem Formular zur Bearbeitung von Anhängen angezeigt. Wir müssen sie in der Datenbank speichern. Dafür verwenden wir den zweiten Haken.

`attachment_fields_to_save`

Dieser Haken hat auch zwei Parameter:

$ post - Array welche die Attachment-Entität darstellt
$ Anhang - enthält alle Felder, die an den Anhang angehängt sind

Füllen wir nun die Funktion aus saveFields Wir sind im vorherigen Abschnitt gegangen.

 function saveFields ($ post, $ attachment) // Wenn unser Fields-Array nicht leer ist if (! empty ($ this-> media_fields)) // Durchsuchen Sie diese Felder füreach ($ this-> media_fields) als $ field => $ Werte) // Wenn dieses Feld übergeben wurde (ist in der $ attachment-Variablen vorhanden) if (isset ($ attachment [$ field]))) // Wenn das übergebene Feld leer ist // Wir fügen Fehler in das Postobjekt ein Den "error_text" -Parameter setzen wir in den Optionen if (strlen (trim ($ attachment [$ field])) == 0) $ post ['errors'] [$ field] ['errors'] [] =] __ ($ Werte ['error_text']); // Andernfalls aktualisieren wir das benutzerdefinierte Feld, sonst update_post_meta ($ post ['ID'], '_'. $ Field, $ attachment [$ field]);  // Andernfalls löschen wir es, falls es bereits existiert. Else delete_post_meta ($ post ['ID'], $ field);  return $ post;

Ok, jetzt sind unsere benutzerdefinierten Felder in der Datenbank gespeichert und stehen für das Frontend zur Verfügung.

Seien Sie vorsichtig, wenn Sie den Post-Parameter in beiden Hooks bearbeiten. Es ist ein Objekt im ersten und einem Array in der zweiten.
Spitze: das update_post_meta erstellt das Meta, falls es nicht existiert.
Spitze: Dem benutzerdefinierten Feldschlüssel wird ein Unterstrich vorangestellt "_"damit sie nicht in den Metaboxen der benutzerdefinierten Felder auf Nachbearbeitungsseiten aufgeführt werden.

Fehlerüberlegungen

Seit Version 3.5 scheint es immer noch keine Fehler in Anhangbearbeitungsformularen zu geben. Ich habe versucht, den Kerncode zu untersuchen, und obwohl der Fehler behoben sein sollte (http://core.trac.wordpress.org/ticket/13810), scheint es nicht.

Für den Ajax-Sicherungsvorgang ist es sicher, dass es noch nicht wie in der ajax-actions.php Datei:

 $ errors = $ post ['errors']; // @todo kehre zurück und zeige mich!

Im Moment funktionieren Fehler jedoch nicht richtig, aber der Code ist so gemacht, dass, wenn diese Fehler behoben sind, dies funktioniert.

Vorderes Ende

Um diese benutzerdefinierten Felder in Ihren Vorlagen zu verwenden, müssen Sie nur Post-Metas auf dieselbe Weise abrufen wie bei regulären Posts. Vergessen Sie nicht, das "_"Präfix zu den Schlüsseln der benutzerdefinierten Felder.

Zum Beispiel könnte man das so machen:

 Echo ""; Echo" Urheberrechte ©: ". get_post_meta (get_the_ID (), '_image_copyright', true)."
"; Echo" Bewertung: ". get_post_meta (get_the_ID (), '_image_stars', true)."
"; Echo" Beschreibung des Autors: ". get_post_meta (get_the_ID (), '_image_author_desc', true)."
"; Echo" Bilddisposition: ". get_post_meta (get_the_ID (), '_image_disposition', true)."
"; Echo" Wasserzeichen? ". (get_post_meta (get_the_ID (), '_image_watermark', true) ==" on "?" yes ":" no ")."
"; Echo"
";

Benutzerdefinierte Felder im Frontend anzeigen

Weiter gehen

Je nach Ihren Bedürfnissen gibt es mehrere Verbesserungspunkte:

Ihre Einstellungen könnten sich in der Datenbank befinden, damit Sie sie flexibler hinzufügen, bearbeiten und entfernen können
Sie können einen Standardwert festlegen, der für alle neuen Anlagen festgelegt wird, wenn kein Wert festgelegt ist
Sie sollten einen Stil für das modale Formular festlegen, damit die benutzerdefinierten Felder richtig angezeigt werden

Fazit

Zögern Sie nicht, uns Ihre Ideen mitzuteilen, wie Sie dieses Plugin verbessern können und was Sie von solchen Funktionen erwarten würden.

Code