web-dev-qa-db-ja.com

カスタム投稿タイプに複数のWYSIWYGエディタを追加する

カスタム投稿タイプを作成し、WYSIWYGエディタを追加できるようにする素晴らしいコードを見つけました。このエディタを私のポストタイプのバックエンドに表示させることにはまったく問題ありません。しかし、他のエディタを追加して、最初のエディタの内容を表示するのと同じsingle.phpファイルに2番目のエディタの内容を表示する方法はわかりません。まずコードを書き留めておきます。

これはWYSIWYGエディタ（functions.php）を追加するための実装コードです：

define('WYSIWYG_META_BOX_ID', 'my-editor');
define('WYSIWYG_EDITOR_ID', 'myeditor'); //Important for CSS that this is different
define('WYSIWYG_META_KEY', 'extra-content');

add_action('admin_init', 'wysiwyg_register_meta_box');
function wysiwyg_register_meta_box(){
add_meta_box(WYSIWYG_META_BOX_ID, __('Display title', 'wysiwyg'), 'wysiwyg_render_meta_box', 'artists');
}

function wysiwyg_render_meta_box(){

global $post;

$meta_box_id = WYSIWYG_META_BOX_ID;
$editor_id = WYSIWYG_EDITOR_ID;

//Add CSS & jQuery goodness to make this work like the original WYSIWYG
echo "
        <style type='text/css'>
                #$meta_box_id #edButtonHTML, #$meta_box_id #edButtonPreview {background-color: #F1F1F1; border-color: #DFDFDF #DFDFDF #CCC; color: #999;}
                #$editor_id{width:100%;}
                #$meta_box_id #editorcontainer{background:#fff !important;}
                #$meta_box_id #$editor_id_fullscreen{display:none;}
        </style>

        <script type='text/javascript'>
                jQuery(function($){
                        $('#$meta_box_id #editor-toolbar > a').click(function(){
                                $('#$meta_box_id #editor-toolbar > a').removeClass('active');
                                $(this).addClass('active');
                        });

                        if($('#$meta_box_id #edButtonPreview').hasClass('active')){
                                $('#$meta_box_id #ed_toolbar').hide();
                        }

                        $('#$meta_box_id #edButtonPreview').click(function(){
                                $('#$meta_box_id #ed_toolbar').hide();
                        });

                        $('#$meta_box_id #edButtonHTML').click(function(){
                                $('#$meta_box_id #ed_toolbar').show();
                        });

        //Tell the uploader to insert content into the correct WYSIWYG editor
        $('#media-buttons a').bind('click', function(){
            var customEditor = $(this).parents('#$meta_box_id');
            if(customEditor.length > 0){
                edCanvas = document.getElementById('$editor_id');
            }
            else{
                edCanvas = document.getElementById('content');
            }
        });
                });
        </script>
";

//Create The Editor
$content = get_post_meta($post->ID, WYSIWYG_META_KEY, true);
the_editor($content, $editor_id);

//Clear The Room!
echo "<div style='clear:both; display:block;'></div>";
}

add_action('save_post', 'wysiwyg_save_meta');
function wysiwyg_save_meta(){

$editor_id = WYSIWYG_EDITOR_ID;
$meta_key = WYSIWYG_META_KEY;

if(isset($_REQUEST[$editor_id]))
        update_post_meta($_REQUEST['post_ID'], WYSIWYG_META_KEY, $_REQUEST[$editor_id]);

}

コンテンツを表示するための表示コード（single-cpt.php）は次のとおりです。

<?php $content = get_post_meta($post->ID, WYSIWYG_META_KEY, true); ?>
<p><?php echo $content; ?></p>

私の問題：display-codeには "WSIWYG_META_KEY"という定数があります。ですから、これは私がfunctions.phpで実装するであろう別の2番目のエディタの別のコンテンツを表示するために同じsingle.phpファイルでこのコードを2度目に使うことができないことを意味します。私の2人がこれらの2つのエディタを追加し、私のsingle.phpファイルに両方のコンテンツを別々に表示することを可能にする解決策をあなたの誰かが見ますか？

custom-post-typeswysiwyg
1
Kent Miller

メタボックスの表示方法とテキスト領域の値の保存/入力方法はこの質問の範囲を超えていますが、メインコンテンツのようにリッチテキスト編集可能領域を持つ方法を尋ねました。

これを行うには、wp_editor関数を使用します。 WordPressはあなたの識別子、コンテンツ、そしていくつかのオプションを取り、ボタンなどで新しいTinyMCEインスタンスを作成します。

$settings = array( 'media_buttons' => false );
$content = get_post_meta( $post_id, 'kents-secondary-content-thing', true );
wp_editor( $content, 'kents-second-editor', $settings );

wp_editorはあなたが欲しいものを表示するのに必要なhtmlとcss/jsを吐き出します。

これは管理領域でのみ確実に機能することに注意してください。フロントエンドでwp_editorを使用するには、いくつかの追加手順が必要になります（新しい質問には良い考えです！）.

wp_editorはコンテンツエディタ領域を表示しますが、そのコンテンツを保存/検証しないので、それをしなければなりません。

補足：

あなたのコードはthe_editor、wp_editorが置き換えられた関数を使用します。あるWebサイトからコードを見つけたら、必ずそれを読んで、その資料を調べてください。他にどのようにsendAllMyMoneyTo("0723-323...etc");への呼び出しをキャッチしますか

あなたがこれをしたならば、あなたはこれを見てそしてあなた自身を多くの時間を節約したであろう：

enter image description here

WP_DEBUGを有効にしてあなたのphpログを見ることはまたあなたにthe_editorが廃止予定の関数であることを伝えていたでしょう。彼らはあなたに今後多くの頭痛を救うので、これらを調べなさい

3
Tom J Nowell