web-dev-qa-db-ja.com

ウェブサイトのCSSを使用したCKEditor

ここで確認できるように、CKEditorはWebサイトのcssを使用します。 enter image description here

それは以下と同じではありません: enter image description here

CSSの使用量を減らしています。他のすべてのcssファイルを一緒にインポートするメインのless cssファイルを定義しようとしました。これはうまくいきませんでした。また、drupalによって自動的に生成されたcssファイルには、CSSファイルパス設定の下のCKEditor CSS設定に配置するための確実なパスがありません。

エディターでWebサイトと同じスタイルを使用する方法はありますか?

5
Rafael

1。あなたのdrupalウェブサイトのランダムなページに移動します

2。ページのソースを調べます。Drupal自体(奇妙な長いname.css)によって生成されたCSSファイルがあるはずです)をクリックします。

CKEditor.cssという名前のCSSファイルを作成し、テーマのルートフォルダーに配置します。

4。一時CSSファイルからすべてのCSSをコピーし、新しく作成したCKEditor.cssという名前のCSSファイルに貼り付けます

5。 CKeditor CSS設定の下のCKEditor構成で、CKEditor.cssのCSSファイルパスを貼り付けます

6。ブラウザのキャッシュをクリアすると、準備が整います。

0
Rafael

SASSのようなLESSは、実際のCSSファイルにコンパイルする必要があります。

コンパイラーがCSSファイルをどこに置くか調べてください。 css-aggregationを無効にして、サイトのソース出力を確認します。
cssファイルのパスをCKEditor設定に追加します。

2
Wolf