首页 文章

Wordpress:'Insert Read More tag'如何运作?

提问于
浏览
5

我想在新帖子页面上为tinyMCE编辑器添加一个按钮 . 随着this toturial我设法让按钮完美运行,但有些东西我无法't figure out. When you insert a 1179275 tag, an image will appended to the html with appropriate ' background-image' . 见截图:
more tag

但是当你切换到'Text'模式时,会出现如下的html注释: <!--more--> .
enter image description here

我可以在html中添加图像,但在'Text'模式下有一个 img 标记 .
enter image description here

enter image description here

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

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

2 回答

  • 0

    我找到了答案 . 您需要在编辑器对象上添加 BeforeSetContentPostProcess 事件(如前所述,首先按照this toturial添加按钮):

    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" />';
                    }
                }
            });
    
        }
    });
    
  • 3

    或者你可以做一个短代码 . 我总是使用它你可以写你自己的代码让你理解它 . 很少甚至没有从tinymce写jQuery!

    example

    function oex_toggle_ul($atts, $content = null){
    extract(shortcode_atts(array(
        ),$atts));
    
    
       return '<ul>'.do_shortcode( $content ).'</ul>';
    
    }
    
    function oex_toggle($atts, $content = null){
        extract(shortcode_atts(array(
            'titel' => '',
            'open' => 'closed'
            ),$atts));
    
        return '<li class="'.$open.'"><a href="#">'.$titel.'<span></span></a><ul class="'.$open.'">'.do_shortcode( $content ).'</ul></li>';
    }
    

    https://codex.wordpress.org/Function_Reference/add_shortcode

相关问题