I created a "WordPress customizer custom tinymce control" and it appears on the customizer page, but I can't show the content where it's needed on the frontend.
I tried to use **get_theme_mod()** but to no avail.
how can I do that? Used Codes Below Thank You
HTML Code:
<div class="bottom-footer">
<div class="container">
<div class="copyright">
<p>© 2020 <a href="/">CONSULTY</a> - Business & Consulting. All rights reserved.</p>
</div>
</div>
</div>
Custom TinyMCE Class for Custom Control WP CUSTOMIZER
<?php
/**
* TinyMCE Custom Control
*/
if (class_exists('WP_Customize_Control')) {
class TinyMCE_Editor_Custom_Control extends WP_Customize_Control
{
public $type = 'textarea';
/**
** Render the content on the theme customizer page
*/
public function render_content() { ?>
<label>
<span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
<?php
$settings = array(
'media_buttons' => false,
'quicktags' => false
);
$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', CONSULTY_THEME_DIR_URI . '/inc/customizer/assets/consulty-customize.js', array( 'jquery' ), rand(), true );
}
add_action( 'customize_controls_enqueue_scripts', 'editor_customizer_script' );
}
Customizer JS Code
(function ($) {
//
wp.customizerCtrlEditor = {
init: function () {
$(window).load(function () {
$("textarea.wp-editor-area").each(function () {
var tArea = $(this),
id = tArea.attr("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 () {
tArea.val(content).trigger("change");
}, 500);
});
}
tArea
.css({
visibility: "visible",
})
.on("keyup", function () {
content = tArea.val();
clearTimeout(setChange);
setChange = setTimeout(function () {
content.trigger("change");
}, 500);
});
});
});
},
};
wp.customizerCtrlEditor.init();
//
})(jQuery);
Customizer Setting & Control
<?php
/**
* TintMCE Editor
*/
$wp_customize->add_setting( 'theme[editor_content]', array(
'default' => '',
'transport' => 'postMessage',
'sanitize_callback' => 'wp_kses_post'
) );
$wp_customize->add_control( new TinyMCE_Editor_Custom_Control(
$wp_customize, 'editor_content', array(
'label' => 'CopyRights Text',
'section' => 'footer_options',
'settings' => 'theme[editor_content]',
'type' => 'textarea',
)
)
);