tinymce - TinyMCE のパディング用の現在のプラグイン

Question

「padding: 5px」のようなものを画像に追加するプラグインを見つけるために何時間も探していました。誰もがプレーンhtmlを介してこれを行いますか? 当社のお客様は、ボタンまたは右クリックのコンテキスト メニューを使用して簡単にこれを追加する方法を必要としています。提案/解決策はありますか、それとも自分で開発する必要がありますか?

TinyMCE 以外の製品に関する提案は必要ありません。

Answer 1

最も簡単に使用できるのは、パラメーター ( content_css )として設定するだけでよいカスタム スタイルシートを追加することです。tinymce 構成のコード スニペットの例:

...
theme: 'advanced',
content_css: "http://my_server/my_css/my_custom_css_file.css",
...

この css には、次のようなものが含まれている必要があります。

img {
    padding-left: 5px;
}

tinymce ボタンのコードはもう少し複雑です (ただし、賢明であれば投稿することもできます)。css は次のように設定されます。

$(ed.get('my_editor_id').getBody()).find('img').css('padding-left','5px');

更新:ボタン コード:

tinyMCE.init({
   ...
   setup : function(ed) {
      ed.onInit.add(function(ed, evt) {
          ed.addButton ('wrap_div', {
            'title' : 'my title',
            'image' : 'my_image.png',
            'onclick' : function () {
                ed.getBody().find('img').css('padding-left','5px');
            }
        });
      });
   }
});