Wordpress:"插入阅读更多标签"的工作原理如何？

Question

我想在新帖子页面上为tinyMCE编辑器添加一个按钮.有了这个功能,我设法让按钮完美运行,但有些东西我无法弄清楚.当您插入"更多"标签时,图像将附加到具有适当"背景图像"的html.见截图:

但是当你切换到'文字'模式时,会有一个像这样的html评论:<!--more-->.

我可以在html中添加图像,但在"文本"模式下有一个img标记.

我想要这样的东西: <!--my-custom-tag-->

wordpress如何设法做到这一点？或者我怎样才能在tinyMCE编辑器上附加自定义标签？

Answer 1

我找到了答案。您需要在编辑器对象上添加BeforeSetContent和PostProcess事件（正如我之前提到的，首先按照此教程添加您的按钮）：

tinymce.create('tinymce.plugins.MyPlugin', {
    init: function(editor, url) {
        // Code to add the button...

        // Replace tag with image
        editor.on( 'BeforeSetContent', function( e ) {
            if ( e.content ) {
                if ( e.content.indexOf( '<!--my-custom-tag-->' ) !== -1 ) {
                    e.content = e.content.replace( '<!--my-custom-tag-->', '<img src="' + tinymce.Env.transparentSrc + '" ' + 'class="wp-my-custom-tag mce-wp-my-custom-tag" title="My Tag..." data-mce-resize="false" data-mce-placeholder="1" />');
                }
            }
        });
        // Replace image with tag
        editor.on( 'PostProcess', function( e ) {
            if ( e.content ) {
                if ( e.content.indexOf( '<!--my-custom-tag-->' ) !== -1 ) {
                    e.content = e.content.replace( '<!--my-custom-tag-->', '<img src="' + tinymce.Env.transparentSrc + '" ' + 'class="wp-my-custom-tag mce-wp-my-custom-tag" title="My Tag..." data-mce-resize="false" data-mce-placeholder="1" />';
                }
            }
        });

    }
});