web-dev-qa-db-ja.com

CKEditorはインライン属性を取り除きます

私はしばらくの間CKEditorを使用してきましたが、うまくいきました。私はほとんどすべての問題を取り除きましたが、これは私には理解できないようです。 style = "color: #ff0;"タグのインスタンス<p></p>の要素にインライン属性を追加すると、wysiwygからソースビューに切り替えるときに属性が削除されます。保存や送信は行われず、ckeditorが自分のスクリプトである自分のサイトに追加されました。これを引き起こすものについてのアイデア。私が見つけることができるすべての検索結果はDrupalで発生しているこの問題に対応していますが、Drupalはすべての場合でエディターではなく問題であるようです。ありがとうございます!

25
tiantang

Advanced Content Filter(ACF) が付属しているCKEditor 4.1+を使用しているようです。その場合は、config.allowedContentおよび configure it を指定して、物事を機能させる必要があります。 config.extraAllowedContent にも興味があるかもしれません。

詳細は this answer を参照してください。

34
oleq

ACFを完全に無効にすることなく、CKEditorで追加のマークアップを有効にする方法に関する簡単なサンプルを探している人のために、短いスニペットを次に示します。

CKEDITOR.replace( 'editor1', {
    extraAllowedContent: 'style;*[id,rel](*){*}'
} );

extraAllowedContent ここで<style>要素は、すべての(角括弧内の)2つの追加属性を許可します(*はワイルドカードです)既に許可されている要素で、任意のクラス名を使用できます(*)それらのために、あらゆるインラインスタイルの使用を許可します{*}

10
Wiktor Walc

こんにちはACFを簡単に停止できます。デフォルトでは、構成は---

function ckeditor($name,$value='',$height=300){
    return '<textarea name="'.addslashes($name).'">'.htmlspecialchars($value).'</textarea>
<script>$(function(){CKEDITOR.replace("'.addslashes($name).'",{});});</script>';
} 

中かっこでこれを追加するだけです:

allowedContent: true

今あなたの設定は次のようになります:

function ckeditor($name,$value='',$height=300){
    return '<textarea name="'.addslashes($name).'">'.htmlspecialchars($value).'</textarea>
<script>$(function(){CKEDITOR.replace("'.addslashes($name).'",{allowedContent: true});});</script>';
}
5
Chayon Shaah

私は同じ問題に直面し、以下の答えが私の問題を解決しました:

config.allowedContent = true;
config.extraAllowedContent = '*(*);*{*}';
config.extraAllowedContent = 'span;ul;li;table;td;style;*[id];*(*);*{*}';
4
Rakhi Prajapati

同じ方法で、このメソッドを使用しているときにckが一部の属性だけでなく、ブロック要素(pの中にいくつかの属性が貼り付けられているdiv)内のブロック要素を貼り付けるときに、要素全体を削除していました。

editor.insertHtml(html);

問題を解決したのは、代わりにこの回避策を使用することでした。

editor.insertElement(CKEDITOR.dom.element.createFromHtml(html));
1
st'sahib