Stinger5で文字色が変更できない！テーマカスタマイザーの削除で解決しました

2015/03/07 2017/02/01

こんにちは、okutani(@okutani_t)です。先日、Stinger5で文字色を子テーマのCSSで変更しようとしたところ全然反映されなくて少し焦りました。

Stinger5はデフォルトだと文字色の変更がCSSでおこなえないようです。

「テーマカスタマイザーの設定をOFF」にすることで、CSSを使った文字色等を変更できるようになります。CSSで主にサイトをデザインしている方は下記の通り設定してみてください。

まず始めに、テーマカスタマイザーについて説明していきます。

テーマカスタマイザーについて

Stinger5ではテーマカスタマイザーという、CSSを書かず直感的に文字色や背景等が変更できる機能を利用しています。

しかし、テーマカスタマイザーがオンになっていると、CSSを用いた子テーマで色の設定が反映されません。

テーマカスタマイザーを使わない人は下記設定でオフにしておきましょう。

親テーマにあるfunctions.phpを開いて下記の行をまとめて削除しましょう。こうすることでテーマカスタマイザーの機能をオフにできます。

//テーマカスタマイザーで編集しない方は削除して下さい（ここから）

…省略…

//カスタマイザーで色を設定しない方は削除して下さい（ここまで）

内部ファイルを弄ることになるので、上記のようなコードにあまり慣れていない方はバックアップをとってから作業をおこなうようにしましょう。余計なコードを削除してしまうと、最悪サイトが表示されなくなります。

上記コードを削除することで、邪魔をしていたテーマカスタマイザーを停止することができました。これでCSSを使ったレイアウトが可能になりますね。

また、上記のコードは行数が多いため、削除することでWordPressサイト自体の読み込みを速くすることにも繋がります。

Stinger5を使っている方は、本方法でCSSを使えるようにしておくと良いですね。

Stinger5開発者のENJIさんのブログでも、このやり方でテーマカスタマイザー機能をOFFにしていました。

公式ページで紹介しているやり方の通りですので、安心して設定できますね。ぜひ試してみてください。

okutani (okutani_t) のヒトコト

okutani_t

最初、色が変更出来なくて!importantとかしてました。逆に、CSSをいじらずにテーマカスタマイザーでサイトデザインを構築したい方は、無理に設定しなくても大丈夫かと思います。

フリーランスのエンジニアとして、Webシステム開発のお仕事依頼を随時募集しています。

「Ruby on Rails」「HTML5」「CSS3」「JavaScript（jQuery, Reactなど）」を用いたシステム開発、「Heroku」を用いたサーバー構築・運用、「Git」や「GitHub」を利用したソーシャルコーディングなどに対応しています。

ご依頼を検討している方は、下記リンク本ブログからのお問い合わせ、もしくはokutaniのポートフォリオからご連絡ください。