有一种更简单的方法，根本不必为页面操心。
相反，将内容存储在选项或主题模块中，并使用设置API/customiser编辑内容。
转动textarea 将表单中的内容保存到完整编辑器中，使用wp_editor 函数获取所见即所得编辑器，其外观和工作方式与编辑页面屏幕类似。使用get_option 或get_theme_mod 检索前端上的内容，并通过the_content 筛选要使用的oembeds短代码和段落。
例如，下面是如何将可编辑页脚内容区域添加到自定义程序（taken from here )
add_action( \'customize_register\', \'your_customizer\' );
function your_customizer( $wp_customize ) {
$wp_customize->add_section(
\'appearance_settings\',
array(
\'title\' => __(\'Appearance Settings\'),
\'description\' => __(\'Modify design options\'),
\'priority\' => 120,
)
);
$wp_customize->add_setting( \'footer_content\',
array(
\'default\'=>\'default text\'
));
$wp_customize->add_control(
new Example_Customize_Editor_Control(
$wp_customize,
\'footer_content\',
array(
\'label\' => \'Footer content\',
\'section\' => \'appearance_settings\',
\'settings\' => \'footer_content\'
)
)
);
}
以下是编辑器内容控件：
if(class_exists(\'WP_Customize_Control\')){
class Example_Customize_Editor_Control extends WP_Customize_Control {
public $type = \'textarea\';
public function render_content() {
?>
<label>
<span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
<?php
$content = $this->value();
$editor_id = $this->id;
$settings = array( \'media_buttons\' => true, \'drag_drop_upload\'=>true );
wp_editor( $content, $editor_id, $settings );
?>
</label>
<?php
}
}
}
以下是一些用于更新预览窗格的JS：
jQuery(document).ready(function($){
$(\'textarea[name="footer_content"]\').attr(\'data-customize-setting-link\',\'footer_content\');
setTimeout(function(){
var editor2 = tinyMCE.get(\'footer_content\');
if(editor2){
editor2.onChange.add(function (ed, e) {
// Update HTML view textarea (that is the one used to send the data to server).
ed.save();
$(\'textarea[name="footer_content"]\').trigger(\'change\');
});
}
},1000);
})
下面是一些PHP来加载js：
function your_customize_backend_init(){
wp_enqueue_script(\'your_theme_customizer\', get_template_directory_uri.\'/customizer/customizer.js\');
}
add_action( \'customize_controls_enqueue_scripts\', \'your_customize_backend_init\' );
