无法在 WordPress 的 TinyMCE 编辑器中以文本模式添加自定义元素答案

【问题标题】：Can't add custom element in Text mode in TinyMCE editor in WordPress无法在 WordPress 的 TinyMCE 编辑器中以文本模式添加自定义元素
【发布时间】：2013-04-26 11:31:29
【问题描述】：

我想在 WordPress 的 TinyMCE 编辑器中添加自定义元素。

在 Visual 模式下，它应该如下所示：

在文本模式下应该是：

元素像这样插入到页面内容中：

tinyMCE.execCommand('insertElement', false)   # 'insertElement' is defined below

当此代码在Visual模式下运行时，图像被正确插入。

但是，在 Text 模式下运行此代码不会产生任何结果（ 不会出现）。

这是为什么呢？

这是 TinyMCE 代码本身：（CoffeeScript）

(($) ->
  tinymce.PluginManager.requireLangPack('example')

  tinymce.create 'tinymce.plugins.ExamplePlugin',
    init: (ed, url) ->
      elementHTML = '<img class="example" src="http://goo.gl/eejO0" />'

      ed.addCommand 'insertElement', ->
        ed.execCommand('mceInsertContent', false, elementHTML)

      ed.onPostProcess.add (ed, o) ->
        if o.get
          $wrapper = $('<div />').html(o.content)

          $('.example', $wrapper).each ->
            $(this).replaceWith("<!-- example -->")

          o.content = $wrapper.html()

      ed.onBeforeSetContent.add (ed, o) ->
        if o.content
          o.content = o.content.replace(/<!-- example -->/g, elementHTML)
    ,
    getInfo: ->
      longname: 'Example Plugin'
      author: 'Me'
      authorurl: 'http://mysite.com'
      infourl: 'http://mysite.com'
      version: '1.0'

  tinymce.PluginManager.add('example', tinymce.plugins.ExamplePlugin)
) jQuery

【问题讨论】：

标签： wordpress tinymce

【解决方案1】：

我猜在 textmode 中没有真正的 tinymce 编辑器，而只是一个普通的 textarea。

【讨论】：

【解决方案2】：

我不确定这是否是您要找的，但这是我的解决方案。

<h1><img alt="" src="http://static.tinymce.com/tinymce/js/4.0b2/plugins/emoticons/img/smiley-yell.gif" /></h1>
&nbsp;
<h1><img alt="" src="http://static.tinymce.com/tinymce/js/4.0b2/plugins/emoticons/img/smiley-smile.gif" data-mce-selected="1" /></h1>

希望没事！

【讨论】：