AFFINGER5 JET｜『JET管理』の変更内容がトップページに反映されないときの対処法

セイタ

こんにちは、セイタです。

先日AFFINGER5 JETのTOPページをカスタマイズしようとしたところ、JET管理でカスタマイズが変更されないという事象が発生しました。

結論として解決した方法としては、親テーマと子テーマを再度アップロードし直したところ改善されました。

しかし、テーマをアップロードし直すと少なからずカスタマイズや配色の設定をし直さなければいけないので、面倒な事が多くなってしまいます。

そのため、本記事では最終的に改善させる方法としては、テーマの再アップロード。その他改善出来る可能性が高い方法を解説します。

AFFINGER5 JETでトップページのデザインが反映されないときの対処法

それでは、AFFINGER5 JETの『JET管理』で変更した内容が反映されないときの対処方法を紹介します。

キャッシュの削除を試す

キャッシュの削除を行なうことによって症状が改善される可能性があります。

このキャッシュの削除パターンは2つです。

プラグインの削除方法は使用しているプラグインソフトによって異なるので、今回解説することは割愛させていただきます。

ブラウザでキャッシュを削除する方法

例としてGoogleChromeを使って解説していきたいと思います。

Chromeの場合は、下記の手順でキャッシュの削除が可能です。

キャッシュの削除を行った後にトップページへ移動し、ページを再度読み込みを行いページの状態を確認。

スーパーリロードを試す

スーパーリロードという通常のページ更新とはまた違ったリロード方法があります。

効果としては、ブラウザのキャッシュを使わず、最新の情報を読み込んでページを表示する事が可能です。

この方法を使用すればキャッシュを使用せずにページの最新の状態を確認することが出来るので、キャッシュの削除を行わなくても改善する可能性があります。

親テーマと子テーマの再アップロードを試す

親テーマと子テーマの再アップロードを試す事によって、CSSやfunctuin.phpなどのデータが初期化されるので、デザインデータが復活します。

サイトのキャッチフレーズやWordPress本体にそのまま設定されている内容に関しては、改変されることはないのでご安心ください。

しかし、『AFFINGER5 管理』などで個別に設定していた内容に関しては、再度設定をし直さなければいけないので、その点だけ注意が必要です。

『JET管理』の内容が反映されない原因と思われる可能性

ここまでは『JET管理』の内容が反映されないときの対処方法を解説してきました。

次に、トラブルが再度発生した際に知識を応用できるように、内容が反映されない原因として考えられる可能性を解説します。

トラブルが発生した原因をある程度自分の中に知識として覚えておくことによって、何か別のトラブルが発生した際に応用が効かせられるようになるので、是非覚えておくと良いでしょう。

Autoptimizeが原因となっている

WordPressのプラグインで代表的なものでAutoptimizeというものがありますが、その中の機能で『インラインの CSS を連結』というインライン化を行う機能が存在します。

このインラインを行なうと、デザインを構成しているCSSを改行なしのひと繋がりのコードにするため、デザインが崩れる場合があります。

また、ひと繋がりになることによってデザインの変更を行った際にうまく反映されない場合があるので、こちらの機能が原因となっている可能性が考えられます。

実際に試したところ、デザインの変更を行った際にトップページや会話吹き出しのデザインが崩れるという状況になったときもあるので、デザイン上で何か不具合が発生した際はこの機能のチェックを外してみましょう。

WP Fastest Cacheが原因となっている

こちらも、Autoptimizeと同様で『HTML・CSSの圧縮』や『CSSやJSの結合』などの機能が設定画面で選択できるようになっています。

チェックが入っている場合には、Autoptimizeと同様でデザインの変更が効かなくなる可能性があるので注意が必要です。

他のキャッシュ系のプラグインでもCSS系の設定項目がある場合には、その項目のチェックを外すことによって改善される可能性が出てきます。

テーマのPHPファイルを不用意に変えすぎた

テーマのPHP（主にfunction.php）などを変更する場合には最新の注意が必要ですが、ページスピードの改善などを行った場合にレンダリングを避けるためフッターにコードを移したり、JavaScriptの改変を行なうコードを追加したりする場合があるかと思います。

しかし、そのコードの入手経路は主にネットになるため、環境によってはその効果が発揮されない場合があります。

もし、手に入れたコードがあなたの環境に合わなかった場合、サイトの挙動がおかしくなるときがあるので、通常表示されるものが表示されなくなったりする時もあります。

WordPressテーマのカスタマイズの中で異変に気がついたら、直近にコードの書き換え等を行っていないかを確認し、書き換えを行った記憶があればそのコードを削除することによって現状を復旧できる可能性が高いです。

一番手っ取り早いのはテーマの再アップロード

WordPressテーマのカスタマイズを行なう際の解決能力を高めるために、少し余談をしましたが今回のテーマで一番早い解決方法はテーマの再アップロードです。

テーマをアップロードする際にいくつか注意点がありますので、その点についても解説していきます。

アップロード前にCustomizer Export/Importは使用しない

テーマをアップロードする前にCustomizer Export/Importでカスタマイズデータをバックアップしておきたいと思うかも知れませんが、今回に関してはバックアップは取らないでください。

なぜかというと、今回の目的としてはテーマの内部コードを正常な状態に戻すことになるので、Customizer Export/Importでバックアップを取ってしまうと結局治らないということになってしまいます。

そのため、Customizer Export/Importでカスタマイズのバックアップを取る場合は、テーマをアップロードした後に正常な状態と確認ができてからカスタマイズデータのバックアップを取得するようにしてください。

カスタマイズし直さなければいけない点が出てきてしまいますが、ここは辛抱です。

Simple Custom CSSは必ず使用する

Simple Custom CSSに関しては、そのまま使用しても大丈夫です。

これは実際に試してみたのですが、追加CSSに追加しているコードをバックアップとしてとっておくのは問題ないようです。

親テーマにCSSを直接書き込んでしまっていた場合は、そのCSSをバックアップしてしまうと復旧できない可能性があるので、追加CSSのコードのみをバックアップしておくようにしてください。

せっかく集めてきたCSS追加コードを失ってしまって、また見つけるのは膨大な時間がかかって大変なので、この機会に定期的に追加CSSのバックアップと親テーマのCSSはバックアップを定期的に取っておいたほうが良いかも知れませんね。

STINGER系テーマアップデーター5は必ず使用する

テーマアップデーター5は必ず使用してください。

なぜかというと、アップロードする際に手順が増えて面倒になってしまうからです。

テーマアップデーターを使用することによって、今まで使用していたテーマに自動的に名前を追加して最新のものが判別できる様になっているので、自動的にテーマの変更を行ってくれる仕組みになっています。

そのため、別の無料テーマなどを有効にして、AFFINGERのアップロードが終わったら再度有効にし直して、という手順を踏まなくても良くなるので、時間削減という意味でも必ず使用するようにしましょう。

プラグインを有効にしておけば自動的に機能してくれるものになっているので、特別設定等は必要にならないのでご安心ください。

CSSのカスタマイズ・インライン化は慎重に

今回は、JET管理での変更内容が変更されないという状況を改善するべく、改善方法について解説させていただきました。

AFFINGER5 JET自体はとても良いテーマとなっていて、マガジン系のテーマを使用したくなった場合には是非使いたいテーマです。

JETに限らず、更に上位のEXもありますが、そちらはもはや最強。

新しくWordPressテーマを購入する必要もなくなるほど。

是非今回の記事を参考に、WordPressの知識とAFFINGER5の知識を増やして、快適なブログライフを送りましょう！