WordPress mit eigenen Funktionen erweitern
WordPress & Co

WordPress, benutzerdefinierte Felder und die Meta-Box

Da ich jetzt wieder viel mehr mit WordPress arbeite, finde ich auch immer wieder auf kleine Eigenarten. Die stören mich zwar nicht sonderlich, aber dem/der AnwenderIn (besonders im Dashboard) können sie schon sehr einschränken. Für uns Profis ist es ja noch nicht so schwer, immer wieder ein bestimmtes benutzerdefiniertes Feld auszuwählen und dann den passenden Wert einzugeben. Warum sollten wir das überhaupt? Ja da programmierst du ewig an einem Theme herum und brauchst immer einen bestimmten Wert, sei es jetzt eine zweiter Autor, oder eine Linkliste oder einen unterschiedlichen Titel für den Post. Alles ist darauf abgestimmt und würde auch perfekt angezeigt, aber der Wert wird nie richtig eingegeben.

Ich höre schon: „Ach da unten, das auswählen habe ich wieder übersehen.„, oder: „Das Auswählen ist so kompliziert und dann immer dieses viele klicken. Nein das interessiert mich nicht!

Da wäre es doch praktisch, wenn diese benutzerdefinierten Felder in einer eigenen Meta-Box – wie der Auszug des Posts oder auch die Schlagwörter – sind und der/die Post-AutorIn nur mehr schnell was einträgt. Und genau das werden wir hier machen.

Ja nun programmieren wir wieder! Ist ja bei mir ziemlich beliebt, denn dadurch können wir unseren AnwenderInnen das Leben einfach leichter machen. Am Anfang steht wie immer die berühmte functions.php. Wenn du ein eigenes Theme hast, dann kannst du natürlich direkt rein schreiben. Verwendest du aber ein Theme von jemanden anderen, wirst du sicher immer wieder Updates machen. Dann ist es schlauer wenn du dir ein Child-Theme anlegst und dort die Theme-Funktionen erweiterst.

Dann legen wir los. Die Lösung für unser Problem ist dreiteilig. Zuerst brauchen wir eine Meta-Box, dann müssen wir den Inhalt in diese Box bringen und am Ende wollen wir das ganze auch noch speichern.

Die Meta-Box anlegen

Stellen wir uns vor, dass wir eine Meta-Box für eine Liste von Bookmarks am Ende des Posts haben wollen. Dazu brauchen wir zuerst die Box selber, welche wir mit add_meta_box() anlegen können.

// Erzeugen der Meta-Box fuer eine Linkliste
function tmdn_meta_bookmarks_add() {
  add_meta_box('tmdn-meta-bookmarks',      // ID der Meta-Box
               'Interessante Bookmarks',   // Titel fuer die Meta-Box
               'tmdn_meta_bookmarks_cb',   // Name der CallBack-Funktion
               'post',                     // Welcher Bereich erhaelt die Meta-Box
               'normal',                   // Position der Meta-Box (in der Mitte oder Seitenleiste)
               'default');                 // Reihenfolge/Wichtigkeit der Meta-Box
}
// Hinzufuegen der Meta-Box mit einem Hook
add_action('add_meta_boxes', 'tmdn_meta_bookmarks_add');

Wenn Du jetzt dein Dashboard aufrufst, siehst du eine leere Meta-Box. Natürlich solltest du vorher die Datei functions.php auf deinen WebServer übertragen. Oder besser noch, du entwickelst diese Dinge alle in einer lokalen Installation von WordPress.

Die Inhalte für die neue Meta-Box

Jetzt haben wir zwar ein nettes Element in unsere Beitragsseite, aber noch absolut keinen Inhalt. Diese fügen wir mit der CallBack-Funktion hinzu. Damit können wir Informationen, Eingabefelder und auch ein Sicherheitsfeld (Nonce-Field) einfügen. Damit wir bereits eingetragene Werte in unserem neuen Eingabefeld sehen, müssen wir sie mit get_post_custom() abrufen. Diese WordPress-Funktion ermittelt ein Array (eine Sammlung von variablen Werten) mit allen Custom-Fields (benutzerdefinierte Felder) eines Posts.

// CallBack-Funktion fuer den Inhalt der Meta-Box
function tmdn_meta_bookmarks_cb($post) {
  // den aktiven (gerade in Arbeit) Post aktivieren
  global $post;
  // die Werte der Custom-Fields abrufen
  $values = get_post_custom($post->ID);  
  // Nur wenn bereits Werte vorhanden sind, diese in einer Variablen speichern
  // sonst die Variable mit einem leeren String belegen
  $text = isset( $values['bookmarks'] ) ? esc_attr( $values['bookmarks'][0] ) : "";
  // das versteckte Feld fuer die Sicherheit ausgeben
  wp_nonce_field('tmdn_meta_bookmarks_nonce', 'meta_box_nonce_bookmarks');
  // denn echten Inhalt fuer die Meta-Box als HTML ausgeben
  ?>
    <p>
      Alle interessanten Bookmarks erfassen.<br />
      Jeden Hyperlink in einer eigenen Zeile, als li-Element 
      eintragen.
    </p>
    <label for="tmdn_bookmarks">Bookmarks</label><br />
    <textarea name="tmdn_bookmarks" id="tmdn_bookmarks" 
              rows="8" cols="80" style="width:100%">
    < ?php echo $text; ?>
    </textarea>
  < ?php
}

Geschafft! Wir sehen in unserem Dashboard bei einem Post die neue Meta-Box. Auch eine kleine Erklärung wie die Werte eingegeben werden sollen ist dabei. Dann kommt auch noch ein ausreichend großes Eingabefeld (ist ja bei den benutzerdefinierten Feldern oft nicht der Fall) zum Eingeben der Linkliste.

Die Eingaben der Meta-Box speichern

Jetzt können unsere Anwender zwar die Links einfach eingeben, aber gespeichert werden diese aber noch nicht. Dazu brauchen wir eine eigene Funktion und einen Hook zum Aufrufen der Speicher-Routine. Aber einfach so speichern ist nicht! Wir müssen schon ein wenig auf die Sicherheit achten, dass nicht alles mögliche in unsere Datenbank eingetragen wird und wir auch vor Hackern ein wenig sicher sind. Dazu prüfen wir zuerst das nonce-Feld. Dann sollte der aktive, angemeldete Benutzer auch die passenden Rechte zum Speichern eines Posts haben. Wenn jetzt Eingaben vorhanden sind, müssen wir die Meta-Werte (benutzerdefinerten Felder) des Posts speichern. Aber nicht gleich direkt die Eingaben in die Datenbank übernehmen, sondern zuerst prüfen ob keine verbotenen Elemente vorhanden sind.

function tmdn_meta_bookmarks_save($post_id) {
  // Falls das automatische Speichern aktiv ist, lassen wir es
  if(defined('DOING_AUTOSAVE') && DOING_AUTOSAVE) {return;}
  // Falls kein nonce-Feld vorhanden ist, oder es nicht richtig ist, lassen wir es
  if(!isset($_POST['meta_box_nonce_bookmarks']) || 
     !wp_verify_nonce($_POST['meta_box_nonce_bookmarks'], 
                      'tmdn_meta_bookmarks_nonce')) {return;}
  // Falls der User zuwenig Rechte hat, lassen wir es
  if(!current_user_can('edit_post', $post_id)) {return;}
  // Welche HTML-Elemente und Attribute duerfen verwendet werden.
  $allowed = array('a' => array('href' => array(),
                                'title' => array()),
                   'ol' => array(),
                   'ul' => array(),
                   'li' => array(),
                   'em' => array(),
                   'strong' => array());
  //Falls etwas in das Feld eingegeben wurde, speichern wir es
  if(isset($_POST['tmdn_bookmarks'])) {
    update_post_meta($post_id, 'bookmarks', 
                     wp_kses($_POST['tmdn_bookmarks'], $allowed));
  }
}
add_action('save_post', 'tmdn_meta_bookmarks_save');

Damit haben wir alles erledigt und du kannst probieren ob alles funktioniert. Ich hoffe die kleine Anleitung hat dir geholfen und macht deine WordPress-Welt wieder etwas komfortabler?

Hinterlasse eine Antwort

Deine eMail-Adresse wird nicht veröffentlicht. Pflichtfelder sind mit * markiert.