CKEditorでカスタム段落書式を追加する方法

私のプロジェクトでは、ドロップダウンから「アドレス」や「書式設定」のような段落書式を削除し、「リンク」という新しいカスタム書式を追加するという要件がありますArial、14px、太字、赤。カスタム段落書式をCKEditorに追加することは可能ですか？CKEditorでカスタム段落書式を追加する方法

出典

2013-06-21 Jetson John

使用いくつかの新しい書式を指定するには：スタイルの詳細はどのようにCKEDITOR.styleSet作品を見る知るために

CKEDITOR.replace('editor1', { 
    format_tags: 'p;h2;h3;pre;links', // entries is displayed in "Paragraph format" 
    format_links: { 
     name: 'Links', 
     element: 'span', 
     styles: { 
      color: 'red', 
      'font-family': 'arial', 
      'font-weight': 'bold' 
     } 
    } 
});

を。また、CKEditor 4.1以降、「段落書式」からスタイルを削除すると、Advanced Content Filterに影響があります。

出典

2013-06-21 09:07:11 oleq

ここでは、このコードをckeditor.config.jsに入れる必要があります。私はそれをカスタムJavaScript設定に置いていますが、うまくいきません。場所を指定できますか？ –

これは設定できる場所がたくさんあります。インスタンスを（上記のように） 'config.js'または' customConfig'に直接作成するとき。詳細については、[docs]（http://docs.ckeditor.com/#!/guide/dev_configuration）を参照してください。 – oleq

Drupalを使用しているため、探しているファイルがckeditor.styles.jsです。これにより、「スタイル」メニューのエントリの追加/編集/削除が可能になります。

コメントアウトしたい、と新しい段落書式を追加するには、このようなものを使用していないすべてのエントリ：

{ name : 'Links', element : 'p', attributes : { 'class' : 'links' } },

をこれは、あなたが好きな段落にCSSクラスlinksを追加すると、ユーザーが定義することができますあなたのテーマスタイルシートのクラス。 CKEditorインスタンスに変更が適用されていない場合は、クラスをckeditor.cssに定義してください。

{ name : 'Links', element : 'p', attributes : { 'style' : 'font: bold 14px Arial, sans-serif; color: red;' } },

をしかし、最初の方法は明らかにクリーン/より柔軟である：

また、あなたはまた、直接インラインスタイルを適用することができます。

変更がすぐに表示されない場合は、Drupalまたはブラウザのキャッシュをクリアしてください。

出典

2013-08-01 18:21:25

contribモジュールをハックすることを示唆する答えは本当に5つのアップフォートを持っていますか？ Streuth。 –

CKEditorでカスタム段落書式を追加する方法

答えて

関連する問題