CSSクラスをwysiwygに追加する

私はckeditorでwysiwygを使用していますが、CSSスタイルを追加して、たとえばユーザーが画像を左にフロートしたり、他の同様の変更を加えたりする方法を考えていました...？

ありがとう！

Ckeditorはこのckeditor.styles.jsファイルを使用して、[スタイル]ドロップダウンで使用可能なスタイルを定義します。そのファイルのドキュメントには次のように記載されています。

'Styles' button is not enabled by default in DrupalFull and DrupalFiltered toolbars.

ファイルを見ると、与えられた例を使用してファイルを変更するのはかなり簡単です。

このckeditor.styles.jsファイルは、Drupalがアクセスできるディレクトリにコピーして、スタイルを含めるように変更できます。次に、該当するCSSを含め、新しいファイルを指すようにCKeditorプロファイルを構成する必要があります。

にフックする代わりにckeditor.styles.js、フォーマットの設定ページで直接行うことができます。

WYSIWYG形式では、独自のスタイルを選択でき、これらの形式に基づいてcssを簡単に記述できます。

スタイルを追加する手順

• 管理者としてサイトにログインします。

• 形式の[構成]ページに移動します。（設定»コンテンツオーサリング»Wysiwygプロファイル）

  

• フォーマットを編集します。

  

• CSSフィールドセットを開きます。

  

• 下ではCSSクラスのテキストエリア、作成するスタイルを作成します。そのフォーマットは

スタイル名 = html_element.class_name

同じの例は

Static Page Title = div.static_page_title（スタイルの名前はStatic Page Titleです。これを適用すると、テキストがdivにラップされ、static_page_titleがdiv要素のクラスとして追加されます。）

それを使用する手順

• コンテンツを作成して、スタイルを追加したフォーマットを使用してみてください。
• スタイルの下に、作成したスタイル設定が表示されます。

• テストを書いて、スタイルを選択するだけです。すると、マークアップは次のようになります。

  <div class="static_page_title">Testing</div>

• したがって、static_page_titleクラスのcssを記述するだけで、すべてが期待どおりに機能します。

私の答えが役に立てば幸い