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

記事内にプロモーションリンクが含まれる場合があります。

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

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

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

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

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

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

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

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

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

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

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

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

\今なら300部限定無料ダウンロード/

今すぐ無料ダウンロードする

いまなら、先着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】ファイルを使うようになりますね。

この記事を書いた人

よこやま良平

よこやま良平

こんにちは!18年以上ITエンジニアとして活動してきた
よこやま良平です。

4歳~85歳まで、年間1,792人名以上の方に
パソコンやプログラミング講座を行ってきました。

また18冊以上の書籍を出版しており、連続で1位を獲得しました。
オンライン講座では200件以上のレビューを頂いており
評価は4.9/5.0と高評価を得ています。

その他これまでに3000以上のサービス・システム・サイトを作成。