web-dev-qa-db-ja.com

TinyMCEカスタムスタイルはスタイルを切り替えるときにクラスを削除します

tiny_mce_before_initフィルタフックを使ってTinyMCEエディタにいくつかのカスタムスタイルを追加しました。それらはブロックレベルの要素にクラスを追加することによって動作します。以下のコードを見てください。

function byron_mce_before_init($settings) {
    $style_formats = [
        [
            'title' => 'Lead',
            'block' => 'p',
            'classes' => 'lead',
        ],
        [
            'title' => 'Tagline',
            'block' => 'h5',
            'classes' => 'tagline',
        ],
    ];
    $settings['style_formats'] = json_encode($style_formats);
    return $settings;
}
add_filter('tiny_mce_before_init', 'byron_mce_before_init');

私が抱えている問題は、上で定義されたスタイルを切り替えるときにクラスが削除されないことです。代わりに、新しいクラスは古いクラスに置き換えられますが、置き換えられます。スタイルを切り替えるときに古いクラスを削除する方法を理解できないようです。任意の助けは大歓迎です。

functionstheme-developmentwp-admintinymce
2
Connor

質問がcommunity.tinymce.comで尋ねられたようであり、答えはここにあります： https://community.tinymce.com/communityQuestion?id=90661000000IiyjAAC

定義したスタイルで以前のクラスを削除することはできませんが、ドロップダウンリストからスタイルを選択して再度適用すると、そのクラスがタグから削除されます。 。ドロップダウンリストから別のスタイルを選択すると、そのスタイルに関連するクラスがタグに追加されます。

1
Nat

私は同様の問題を抱えていた

doNotRemoveFormat = falseとします。

tinymce.init({
style_formats:  [
              {title: 'Footer - 11px', inline: 'span', classes: 'admin-footer'},
              {title: 'Standard - 14px', inline: 'span'},
              {title: 'Heading 1 - 19px', inline: 'span', classes: 'admin-heading-1'},  
              {title: 'Heading 2 - 22px', inline: 'span', classes: 'admin-heading-2'}  
            ],
setup: function (ed) {
  ed.on('ExecCommand', function checkListNodes (evt) {
if (cmd === 'mceToggleFormat') {
    if(!doNotRemoveFormat) {  
      let val = 'runThis|' + evt.value;
      this.execCommand('RemoveFormat', false, val);
    } else {
      doNotRemoveFormat = false;
    }
} else if (cmd === 'RemoveFormat') {
  let value = evt.value.split("|");
  if(value[0] === 'runThis') {
    doNotRemoveFormat = true;
    this.execCommand('mceToggleFormat', false, value[1])
  }
});
0
Chris