CkEditor Smileyにクラスまたはインラインスタイルを追加しました。

Question

私は電子メールテンプレートを作成するプログラムでCkエディタを使用しています。すべての電子メールテンプレートには、コンテンツブロック内のテキストを上書きする独自のスタイルがあります。

現在、Ckエディタでテキストブロックにスマイリーを追加すると、テンプレートスタイルは浮動小数点を左に追加し、ブロックをテキストブロック内の画像に表示します。

これは、すべてのスマイリーが左に浮かぶことを意味します。

が、それはこのようになりますように、私は挿入の実際の笑顔の画像にインラインスタイルを追加することができます方法はあります：

<img alt="cool" height="23" src="/vendors/ckeditor/plugins/smiley/images/shades_smile.png" title="cool" width="23" style="float: none; display: inline-block;"> 

は、事前にありがとうございます。

Answer 1

あなたはそれがsrc属性は、例えば、「スマイリー」のような文字列が含まれている場合に要素を挿入するときにチェックしてみてください、その後の要素にクラスまたはインラインスタイルを追加することができます

CKEDITOR.replace('editor1', { 
 
    on: { 
 
    insertElement: function(e) { 
 
     if (e.data.getName() !== 'img') return; 
 
     if (e.data.getAttribute('src').indexOf('smiley') > -1) { 
 
     e.data.addClass('smiley-class'); 
 
     } 
 
    } 
 
    } 
 
});

<script src="https://cdn.ckeditor.com/4.7.3/full-all/ckeditor.js"></script> 
 
<textarea name="editor1"></textarea>