先日、Wordpressの新しいテーマ「SANGO」を購入させて頂きました。
フラットなデザインで装飾から色合まで細部にわたり綺麗に設計されており惚れました。
ブログを今風なオシャレにしたいって方はオススメですよ。
さて、そんなWordpressのテーマ「SANGO」をテーマ設定にしカスタマイズしてました。ブログのデザインを変える時って新しい気持ちになるから楽しいですね〜。前のテーマも良かったけど、常に新しく先端をいく存在は気になりますから。
↓前のWordpressテーマ
WordPressテーマを変更！「ハミングバード」は完璧すぎるテーマだ！
SANGOのデザインが崩れる
テーマに変えたら「カスタマイズ」でトップからサイド、フッターまで一通り設定します。テンプレートでも自分なりにデザインを変えれば他の人とは全く別のデザインになるのでこの辺りは入念に設定。
そこから必要な部分をちょいちょい変更してたんですが、途中である部分のデザインが崩れていることに気づきます
モバイル用フッター固定メニューのアイコンがズレる
SANGOの「ver1.3」から利用できるようになったモバイル用フッター固定メニュー。
ウィジェット用メニューボックスも崩れる
とりあえず、先に全体のカスタマイズを仕上げてからアイコンのズレ原因を解明しようと思い、ウィイジェット用メニューボックスをセットしてみたらこちらも見事にアイコンがズレてました。
うーん、他のアイコンは大丈夫。メニュー関係でデザイン崩れの原因となっていそうですね
解決法 とりあえずプラグイン停止しよう
CSSやPHPをいじっていたなら、そちらに原因があるかもしれませんがそうでなければ”ほぼプラグインに原因がある“と思います
なので、まずはWordpressにあるプラグインを全て「停止」させましょう
プラグインを全部停止してブログをチェックしたら、やはりアイコンのズレが戻っていました！
と、なると原因はプラグインにあることが確定したのでプラグインの中から犯人探しです。勘が鋭い人は「これじゃね？」で当てずっぽうでも良いですが、プラグインが多くどれか検討が付かないって人はプラグインを5個ずつ停止させていきましょう。5個停止して、ブログ確認、デザインが崩れているならそのプラグイン達は無罪なので再度有効化に戻す。それを繰り返す。
どこかでヒットするはずなので、後はその5個から停止、ブログ確認を繰り返していく。
僕の場合「WordPress Visual Icon Fonts」が原因でした
アイコンフォントが使えるようになるプラグイン。恐らくこれが有効化されていたのでフォントのデザインがおかしくなっていたんでしょう。SANGOがあれば使わないプラグインなので停止してついでに削除しておきましょう。
確認してみるとしっかりアイコンのズレはなくなっていました
ありがとう！
WordPressのテーマを変えて、いきなりデザインが崩れていたりしたら原因はプラグインにある可能性が高いので、この方法試してみてください。
以上、SANGOのモバイルフッターのアイコンずれの原因と対策…でした
コメントを残す