[掲載日] この記事は約 2 分で読めます

WordPress5.9にしたら知らないglobal-styles-inline-cssが追加されて知らないカラーになったので解決方法

「WordPress5.9にバージョンアップしたら背景色設定のカラーが変わっている?」

「設定した覚えのない色になっている?」

「明日納期だ色が変わっている」

あなたは、そんなことを悩んでないだろうか?

実際にWordPress5.9にバージョンアップすると、
あたらしブロックシステムが実装されWordPressをブロック形式でデザインできる様になる。

その影響もあって、スタイルシートが勝手に追加されて知らない色が表示されるようになった。

さっそく、そのスタイルを削除する方法を解説。

無料パソコンスクール講座
WordPress・SEO・プログラミング

あなたに以下のことで 悩んでないだろうか?

  • 「フリーランスになりたいけど稼げるか不安だ」
  • 「クラウドソーシングや営業して稼げるか不安だ」
  • 「転職で必要になり困っている」
  • 「スマホはあるけどパソコンが古くて不安だ」
  • 「広告やLINEからの集客を得たい」
  • 「仕事でグラフや資料制作を思うように作れない」
  • 「プログラミングを学習して副業したいけど不安だ」
  • 「副業をはじめたが、いっこうに成果がでない」
  • 「退職してノートパソコンだけで収入を得たい」
  • 「何がわからないかわからない状態が続き何度も挫折した」
  • 「在宅で稼げるようになりたい」
  • 「副業で収入を得たい」

そんなお悩みのあなたにこそ 取得して頂きたい内容です!

このメディアを運営している制作・プログラミング相談のプロが
全て無料で相談と学習できるように
無料スクールのメルマガ講座を開設しました。

いまなら、先着300部限定で無料プレゼント付です。

global-styles-inline-cssが追加されている

head内にglobal-styles-inline-css というスタイルがオーバーライドされていました。

この設定には theme.jsonを使っていくつか変更できる様になっているのだけれど、まだ仕様がよくわからないのでいったん非表示化して、いつも通りの色に戻したい。

詳しくはここ
https://ja.wordpress.org/team/handbook/block-editor/how-to-guides/themes/theme-json/
※なぜかリンク中途半端にしか貼れない
※おそらく5.9系のバグかも

global-styles-inline-css を削除

削除する方法は簡単 function.php に下の行を足せばオーケー。

// global-styles-inline-css を削除
function remove_global_styles_inline_css() {
	wp_dequeue_style( 'global-styles' );
}
add_action( 'wp_enqueue_scripts', 'remove_global_styles_inline_css' );

これで不要なglobal-styles-inline-css

<style id='global-styles-inline-css' type='text/css'>
body{--wp--preset--color--black: #000000;~省略~
</style>

をhead内から簡単に削除することができます。

global-styles-inline-css削除まとめ

WordPressがバージョンアップされて新機能の追加は嬉しい。

しかし、後日覚えるとして今じゃないので、バージョンアップしつつ元のカラーに戻したい時などに対応可能な方法です。

ついにデザイナーでもこれから【theme.json】ファイルを使うようになりますね。

あなたは以下のことで悩んでないだろうか?

あなたは以下のことで悩んでないだろうか?
「HTML・CSSから学習したい」
「ワードプレスの勉強で使いこなせなくて困っている」
「近い将来に向けてスキルアップし収入を増やしたい人」
「エンジニアとして働きたい、転職したい」
「WordPresの学習方法がわからない」

そんなお悩みなら
あなたのお役に立てます。