Veröffentlichen Sie einen benutzerdefinierten Metabox-Textbereich mit wp_editor


7

Ich bin ein Neuling und möchte den wp_editor einem benutzerdefinierten Metabox-Textfeld hinzufügen. Ich habe anscheinend überall nach einem vollständigen Beispiel für das Schreiben einer Metabox mit einem Textbereich gesucht, der den wp_editor verwendet. Ich suche ein vollständiges Beispiel von Anfang bis Ende.

Ich möchte kein Plugin verwenden.

Hat jemand einen Link zu einem vollständigen Beispiel?

Vielen Dank

Antworten:


13

Es gibt mindestens ein Problem bei der Verwendung von wp_editor in einer Meta-Box, wie in Ticket Nr. 19173 beschrieben (Gute Lektüre zum Thema wp_editor und Meta-Boxen). TinyMCE wird völlig durcheinander gebracht, wenn Sie das Meta-Feld verschieben, das es enthält (insbesondere, wenn der Speicherort von TinyMCE im DOM geändert wird). Sie können jedoch die Quicktags-Version (nicht tinyMCE) verwenden. Eine andere Alternative besteht darin, die Box einfach nicht zu verschieben (lahm) oder Ihre Editoren mithilfe der edit_page_formoder edit_form_advanced-Haken hinzuzufügen, anstatt sie zu verwenden add_meta_box().

Ich habe ein schnelles Plugin geschrieben, um das Problem zu demonstrieren. Es ist jedoch ein voll funktionsfähiges Beispiel für die Verwendung von wp_editor in einer Meta-Box. Sie können wp_editor so konfigurieren, dass es metafeldfreundlicher wird, indem Sie TinyMCE deaktivieren und Quicktags mit den entsprechenden Argumenten aktivieren .

<?php
/**
 * Plugin Name: WP Editor in a Meta Box
 * Plugin URI: 
 * Description: Demonstration of WP Editor in a meta box.
 * Version: 1.0
 * Author: goto10
 * Author URI: 
 * License: 
 */

// file name: wp_editor-in-meta-box-test.php 

/* Meta box code based on http://codex.wordpress.org/Function_Reference/add_meta_box */

/* Define the custom box */
add_action( 'add_meta_boxes', 'myplugin_add_custom_box' );

/* Do something with the data entered */
add_action( 'save_post', 'myplugin_save_postdata' );

/* Adds a box to the main column on the Post and Page edit screens */
function myplugin_add_custom_box() {
  add_meta_box( 'wp_editor_test_1_box', 'WP Editor Test #1 Box', 'wp_editor_meta_box' );
}

/* Prints the box content */
function wp_editor_meta_box( $post ) {

  // Use nonce for verification
  wp_nonce_field( plugin_basename( __FILE__ ), 'myplugin_noncename' );

  $field_value = get_post_meta( $post->ID, '_wp_editor_test_1', false );
  wp_editor( $field_value[0], '_wp_editor_test_1' );
}

/* When the post is saved, saves our custom data */
function myplugin_save_postdata( $post_id ) {

  // verify if this is an auto save routine. 
  // If it is our form has not been submitted, so we dont want to do anything
  if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE ) 
      return;

  // verify this came from the our screen and with proper authorization,
  // because save_post can be triggered at other times
  if ( ( isset ( $_POST['myplugin_noncename'] ) ) && ( ! wp_verify_nonce( $_POST['myplugin_noncename'], plugin_basename( __FILE__ ) ) ) )
      return;

  // Check permissions
  if ( ( isset ( $_POST['post_type'] ) ) && ( 'page' == $_POST['post_type'] )  ) {
    if ( ! current_user_can( 'edit_page', $post_id ) ) {
      return;
    }    
  }
  else {
    if ( ! current_user_can( 'edit_post', $post_id ) ) {
      return;
    }
  }

  // OK, we're authenticated: we need to find and save the data
  if ( isset ( $_POST['_wp_editor_test_1'] ) ) {
    update_post_meta( $post_id, '_wp_editor_test_1', $_POST['_wp_editor_test_1'] );
  }

}

Bearbeiten: In dieser Version der Funktion wp_editor_meta_box () aus dem obigen Beispiel ist TMCE deaktiviert und Quicktags aktiviert:

/* Prints the box content */
function wp_editor_meta_box( $post ) {

  // Use nonce for verification
  wp_nonce_field( plugin_basename( __FILE__ ), 'myplugin_noncename' );

  $field_value = get_post_meta( $post->ID, '_wp_editor_test_1', false );

  // Settings that we'll pass to wp_editor
  $args = array (
        'tinymce' => false,
        'quicktags' => true,
  );
  wp_editor( $field_value[0], '_wp_editor_test_1', $args );
}

Danke für den Code. Würde es Ihnen etwas ausmachen, etwas mehr zu erklären, "TinyMCEs Position im DOM wurde geändert" und wie ich "TinyMCE deaktivieren und Quicktags aktivieren" würde.
Travis Pflanz

Kein Problem. Aktualisierte Antwort mit Nicht-Tiny-Version. Wenn Sie eine Meta-Box mithilfe ihrer Drag & Drop-Funktion verschieben, wird sie im DOM verschoben. Wenn das Meta-Feld eine Instanz von TinyMCE enthält, hat sich die Position dieser Instanz im DOM geändert, was zu Problemen führt. Anscheinend ist es möglich, diese Probleme zu überwinden, aber es würde eine Reihe neuer Funktionen erfordern. Daher wurde entschieden, dass wp_editor (zumindest bei Verwendung von TinyMCE) nicht in einer Meta-Box verwendet werden sollte.
Dave Romsey

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.