我在定制器上使用TinyMce(出于obv原因)。但我遇到了一个我似乎没有答案的问题。首先,让我与您分享我的关键代码:
Functions.php
// text editor
if ( ! class_exists( \'WP_Customize_Control\' ) )
return NULL;
/**
* Class to create a custom tags control
*/
class Text_Editor_Custom_Control extends WP_Customize_Control
{
/**
* Render the content on the theme customizer page
*/
public function render_content()
{
?>
<label>
<span class="customize-text_editor"><?php echo esc_html( $this->label ); ?></span>
<input class="wp-editor-area" type="hidden" <?php $this->link(); ?> value="<?php echo esc_textarea( $this->value() ); ?>">
<?php
$settings = array(
\'textarea_name\' => $this->id,
\'media_buttons\' => false,
\'drag_drop_upload\' => false,
\'teeny\' => true,
\'quicktags\' => false,
\'textarea_rows\' => 5,
);
$this->filter_editor_setting_link();
wp_editor($this->value(), $this->id, $settings );
?>
</label>
<?php
do_action(\'admin_footer\');
do_action(\'admin_print_footer_scripts\');
}
private function filter_editor_setting_link() {
add_filter( \'the_editor\', function( $output ) { return preg_replace( \'/<textarea/\', \'<textarea \' . $this->get_link(), $output, 1 ); } );
}
}
function editor_customizer_script() {
wp_enqueue_script( \'wp-editor-customizer\', get_template_directory_uri() . \'/inc/customizer.js\', array( \'jquery\' ), rand(), true );
}
add_action( \'customize_controls_enqueue_scripts\', \'editor_customizer_script\' );
Customizer.php
// content 1 text
$wp_customize->add_setting(\'home_content1_text\', array(
\'default\' => \'Here goes an awesome title!\',
\'transport\' => \'postMessage\',
));
$wp_customize->add_control(new Text_Editor_Custom_Control( $wp_customize, \'home_content1_text\', array(
\'label\' => __(\'Text content 1\', \'DesignitMultistore\'),
\'section\' => \'home_content_1\',
\'description\' => __(\'Here you can add a title for your content\', \'DesignitMultistore\'),
\'priority\' => 5,
)));
//slider text 1 control
$wp_customize->add_setting(\'slider_text_1\', array(
\'default\' => _x(\'Welcome to the Designit Multistore theme for Wordpress\', \'DesignitMultistore\'),
\'transport\' => \'postMessage\',
));
$wp_customize->add_control(new Text_Editor_Custom_Control( $wp_customize, \'slider_text_1\', array(
\'description\' => __(\'The text for first image for the slider\', \'DesignitMultistore\'),
\'label\' => __(\'Slider Text 1\', \'DesignitMultistore\'),
\'section\' => \'Designit_slider_slide1\',
\'priority\' => 3,
)));
Customizer.JS
( function( $ ) {
wp.customizerCtrlEditor = {
init: function() {
$(window).load(function(){
var adjustArea = $(\'textarea.wp-editor-area\');
adjustArea.each(function(){
var tArea = $(this),
id = tArea.attr(\'id\'),
input = $(\'input[data-customize-setting-link="\'+ id +\'"]\'),
editor = tinyMCE.get(id),
setChange,
content;
if(editor){
editor.onChange.add(function (ed, e) {
ed.save();
content = editor.getContent();
clearTimeout(setChange);
setChange = setTimeout(function(){
input.val(content).trigger(\'change\');
},500);
});
}
if(editor){
editor.onChange.add(function (ed, e) {
ed.save();
content = editor.getContent();
clearTimeout(setChange);
setChange = setTimeout(function(){
input.val(content).trigger(\'change\');
},500);
});
}
tArea.css({
visibility: \'visible\'
}).on(\'keyup\', function(){
content = tArea.val();
clearTimeout(setChange);
setChange = setTimeout(function(){
input.val(content).trigger(\'change\');
},500);
});
});
});
}
};
wp.customizerCtrlEditor.init();
} )( jQuery );
Now the problem
一切似乎都很好。我确实有一个TinyMce编辑器。它并没有表明有什么东西被改变了。当我更改其他内容并将其与更改一起保存时,也不会保存。是否有人提供了RTE或TinyMce编辑器的工作示例,可以替换自定义程序上的textarea?
Update
只有我在customizer中定义的最后一个实例。php工作正常。到目前为止,我有14个文本区域。文本区域在14号可以正常工作,但在1-13号不行UPDATE 2
似乎对于每个剩下的区域,他都在该区域内创建了那个数量的tinymce。因此,第一个区域有14个tinymce重叠。第二个13;第三个14等,直到最后一个只有1个,因此工作