gutenberg独自class用cssファイル格納場所について

  • 解決済 tocchimechin

    (@wakaranchin)


    4年、 10ヶ月前

    gutenbergで設定した文字色や背景色など書き出されるclassに対するcssファイルはどこにあるのかご存知の方がいらっしゃいましたらお教えいただければ幸いに存じます。
    ※テーマやエディター用ではなくサイト上の has-カラー英名-background-color などのWordPress独自クラス名に対するスタイルシートのことです。
    ※WordPress5.3

    【症状】
    編集画面で背景色を指定してもエディタ部では色が反映されるのですが、実際のサイト上で背景色がつかない症状に遭遇しております。

    そもそもスタイルの書かれているcssが読み込まれているのか！？
    も怪しいのですが、デフォルトテーマにしても改善しませんでした。
    ブラウザの開発者モードで確認をしても、has-カラー英名-background-color に関する部分がスタイルの箇所にはありませんでした。

    お手数おかけしますが宜しくお願いします。

    • このトピックはtocchimechinが4年、 10ヶ月前に変更しました。
7件の返信を表示中 - 1 - 7件目 (全7件中)
  • 천궁 메텔

    (@digitmaetel)

    4年、 10ヶ月前

    「編集画面で背景色を指定してもエディタ部では色が反映されるのですが、実際のサイト上で背景色がつかない症状」は具体的にどのような例でしょうか。
    「編集画面」の背景色、文字色は、block-library/style.cssに色のクラスが設定されているのではないですか。

    https://developer.wordpress.org/block-editor/developers/themes/theme-support/#block-color-palettes

    ishitaka

    (@ishitaka)

    4年、 10ヶ月前

    「編集画面」の背景色、文字色は、block-library/style.cssに色のクラスが設定されているのではないですか。

    テーマによります。ブロックエディター対応のテーマ（デフォルトテーマも）はカラーパレットの色をカスタマイズしている場合が多く、この場合、block-library/style.css ではありません。
    テーマ名をお知らせください。

    デフォルトテーマにしても改善しませんでした。

    デフォルトテーマにない、カラーパレットの色が指定されたのではないでしょうか？

    천궁 메텔

    (@digitmaetel)

    4年、 10ヶ月前

    （デフォルトテーマも）とはTwentyTwentyと認知していいですか。

    ishitaka

    (@ishitaka)

    4年、 10ヶ月前

    （デフォルトテーマも）とはTwentyTwentyと認知していいですか。

    TwentyTwenty も独自のカラーパレットを持ちます。

    トピック投稿者 tocchimechin

    (@wakaranchin)

    4年、 10ヶ月前

    메텔様
    ishitaka 様

    お忙しいところご返信いただきまして誠にありがとうございます。
    お二人のご返信がヒントになり問題は解決いたしました。
    ありがとうございます。
    いくつか勘違いと思い込みが重なり背景色が表示されなかった事が解りました。

    1.まずテーマは数年前に購入したものをカスタマイズし続けておりgutenbergへの特別な対応はしていないテーマであったこと。

    2.add_theme_support の editor-color-palette で独自のカラーを追加した事。（functions.php）
    この時参考にしたサイトのデフォルトの色のクラス名が現在のものと異なるものが適用されていました。
    ※has-vivid-red-background-color であるべき箇所が has-red-background-color になっていたなどです。

    3.段落等の文字の一部に対し文字色と背景色を適用できるプラグインを使用していたこと。
    ※Advanced Rich Text Tools for Gutenberg
    これを入れたら、独自に追加したカラーが適用になったので、独自に追加したカラー用のCSSを用意しなくても適用になるものと勘違いしておりました。

    独自に追加したカラー用のCSSを用意し、デフォルトカラーも独自カラーも無事適用されるようになりました。
    お二人には感謝申し上げます。
    ありがとうございまいした。

    • この返信は4年、 10ヶ月前にtocchimechinが編集しました。
    トピック投稿者 tocchimechin

    (@wakaranchin)

    4年、 10ヶ月前

    追記：デフォルトテーマで背景色が適用にならなかったのはおそらくキャッシュのせいだと思われます。

    천궁 메텔

    (@digitmaetel)

    4年、 10ヶ月前

    見事に導き出されましたね。うまい具合に返信がかみ合って展開できました。おふたりともありがとうございます。

7件の返信を表示中 - 1 - 7件目 (全7件中)
  • トピック「gutenberg独自class用cssファイル格納場所について」には新たに返信することはできません。