WordPress 使用 wp_editor 釋出自定義 metabox textarea

問題描述

我是一個新手，並希望將 wp_editor 新增到自定義的 metabox textarea 欄位中。我看起來似乎無處不在，用於編寫一個使用 wp_editor 的 textarea 的 metabox 的完整示例。我正在尋找一個完整的開始到結束的例子。

我不想使用外掛。

任何人都有一個完整的例子的連結？

謝謝

最佳解決方案

在一個元框中使用 wp_editor 至少有一個問題，如 ticket #19173(關於 wp_editor 和 meta 框的主題的閱讀) 所討論的。如果你移動包含它的元框 (特別是如果 TinyMCE 在 DOM 中的位置被改變)，TinyMCE 就會被弄亂了。但是，您可以使用 Quicktags 版本 (非 tinyMCE) 。另一個選擇是不要移動框 (跛腳) 或使用 edit_page_form 或 edit_form_advanced 鉤子新增編輯器，而不是使用 add_meta_box()。

我寫了一個快速外掛來演示這個問題。這是一個完美的例子，在一個元框中使用 wp_editor 。您可以透過停用 TinyMCE 並使用 appropriate args 啟用 quicktag 來配置 wp_editor 使其更易於使用元框。

<?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'] );
  }

}

編輯：此版本的 wp_editor_meta_box() 功能從上述示例中將停用 TMCE，啟用 Quicktags：

/* 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 );
}

參考文獻

Post custom metabox textarea using wp_editor

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。

WordPress 使用 wp_editor 釋出自定義 metabox textarea