Đăng văn bản metabox tùy chỉnh bằng wp_editor


7

Tôi là người mới và đang tìm cách thêm wp_editor vào trường văn bản metabox tùy chỉnh. Tôi dường như ở khắp mọi nơi cho một ví dụ hoàn chỉnh để viết một metabox với một textarea sử dụng wp_editor. Tôi đang tìm kiếm một ví dụ hoàn chỉnh để bắt đầu.

Tôi không muốn sử dụng plugin.

Bất cứ ai cũng có một liên kết đến một ví dụ đầy đủ?

Cảm ơn

Câu trả lời:


13

Có ít nhất 1 vấn đề với việc sử dụng wp_editor trong hộp meta, như được thảo luận trong vé # 19173 (Đọc tốt về chủ đề của wp_editor và hộp meta). TinyMCE bị rối tung nếu bạn di chuyển hộp meta chứa nó (cụ thể, nếu vị trí của TinyMCE trong DOM bị thay đổi). Tuy nhiên, bạn có thể sử dụng phiên bản Quicktags (không phải tinyMCE). Một cách khác là không di chuyển hộp (què) hoặc thêm các biên tập viên của bạn bằng cách sử dụng edit_page_formhoặc edit_form_advancedmóc thay vì sử dụng add_meta_box().

Tôi đã viết một plugin nhanh chóng để chứng minh vấn đề. Đó là một ví dụ hoạt động đầy đủ về việc sử dụng wp_editor trong hộp meta. Bạn có thể định cấu hình wp_editor để làm cho nó trở nên thân thiện hơn với hộp meta bằng cách vô hiệu hóa TinyMCE và bật quicktags bằng cách sử dụng các đối số thích hợp .

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

}

Chỉnh sửa: Phiên bản này của hàm wp_editor_meta_box () từ ví dụ trên, sẽ bị tắt TMCE và bật 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 );
}

Cảm ơn mã. Bạn có phiền khi giải thích thêm một chút "vị trí của TinyMCE trong DOM đã được thay đổi" và cách tôi sẽ nói về việc "vô hiệu hóa TinyMCE và bật quicktags".
Travis Pflanz

Không vấn đề gì. Cập nhật câu trả lời với phiên bản không nhỏ. Ngoài ra, khi bạn di chuyển một hộp meta bằng cách sử dụng tính năng kéo và thả của nó, nó sẽ được di chuyển trong DOM. Nếu hộp meta chứa một thể hiện của TinyMCE, vị trí của cá thể đó trong DOM sẽ bị thay đổi, điều này gây ra sự cố. Rõ ràng có thể khắc phục những vấn đề này, nhưng nó sẽ đòi hỏi một loạt các chức năng mới, vì vậy đã quyết định rằng wp_editor (ít nhất là khi sử dụng TinyMCE) không nên được sử dụng trong hộp meta.
Dave Romsey

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.