MAGJAM (DigiPressさんWordPressテーマ)モバイル表示で記事タイトルが消えるトラブルを解決

おそらく ものくろぼっくす の環境だけで起きた複合的・特殊なトラブルだと思います。とはいえ、解決するまでかなり問題を切り分けして大変でしたし、誰かの役に立つかもしれないので、メモしておきます。

トラブル内容

PCからの表示は問題なく見えていますが、モバイル表示にて、記事タイトルが非表示になってしまうのがトラブルの内容です。iPhone 6Plusの実機、ならびに、Chromeの検証でのiPhone 6にて、現象を確認しました。調べると、スタイルシート(CSS)の「.wowクラスのvisibilityプロパティがhidden」となって、記事タイトルが見えなくなっていました。

WordPressのバージョンは 4.4.1・テーマ MAGJAMのバージョンは 1.1.2.3 でした。

解決策(結論)

管理画面の「DigiPressメニュー」-「詳細設定」-「サイト一般動作設定」にあるスクロールフェードインアニメーションの設定項目にて、モバイルだけを無効にしていた場合に、このトラブルが発生しました。

スクリーンショット 2016-01-16 1.15.43

PC・モバイルを両方ともに「チェックなし(アニメーションON)」もしくは「チェックあり(アニメーションOFF)」にすると、トラブルは解決しました。

表示動作の速度が速くなる方が好みなので、ともにチェックを入れた、つまり、アニメーションOFFの設定としました。

そもそもどうしてモバイルだけチェックしたのか?

PCでは表示速度よりアニメーションがある表示として、モバイルでは表示速度を優先する考えで、モバイルの片方だけをチェック入れたのですが、まさかのトラブルが起きました。

問題を解決する途中で役立ったこと

スタイルシート(CSS)まわりのトラブルだったので、Chormeの検証機能でチェックしながら、原因究明を進めました。DigiPressシリーズは、スタイルシートも管理画面にて追加設定できるため、カスタマイズしているCSSも管理しやすい点も助かりました。

加えて、バージョンは同じだけれども、クリーンインストールな状態のテスト環境のWordPressだとどうなのか?をチェックして、その場合はトラブルが発生しないことがわかったのが、解決の道中で役立ちました。

著者プロフィール

ものくろ(大東 信仁)
ものくろ(大東 信仁)
ブロガー・Web&Blogコーチ。親指シフト orzレイアウト開発者。ブログは月間65万PVを記録(2016年1月)。200回を超えるワークショップ開催・のべ1,000名のブログサポートに携わる。WordPressが得意。

詳しいプロフィールはこちら

もっと
ブログで情報発信
について読む