
WordPress 標準の画像ギャラリー機能は便利で使いやすいのですが、
THE THOR というテーマに設置すると、こんな感じでグレーの枠が表示されてしまいます。
このグレーの枠を消すべく、ネットで色々と調べてみました。
そこで発見したのが、
PHP ファイルを編集して画像ギャラリーの CSS を無効にし、新たに CSS でデザインをし直す
というものだったのですが、これを試しても何も表示が変わらない...
で、色々と試してみる事数時間、なんとか綺麗に表示させることに成功!
僕の他にも、同じような症状で困っている方がいるようだったので、
個別で記事を作っておこうと思った次第です。
THE THOR の画像ギャラリー問題は FooGallery で解決!
先に答えを言ってしまうと、FooGallery というプラグインを使うことで
グレーの枠を表示させることなく、ギャラリーを設置することができるようになりました。
FooGallery の使い方は、こちらのページで解説してます。
参考ページWordPressに自由度の高い画像ギャラリーを設置できるプラグイン:FooGalley
しかし、実際に FooGallery で画像ギャラリーを表示させてみると、またもう1つ問題点が出てきました。
もちろん、すべてのテーマで試したわけではないですが
これも他のテーマで見られなかった、THE THOR 特有の症状です。
もう見なかったふりをしてしまおう(笑) とも思いましたが
やっぱり画像が1つだけ飛び出しているのは、どう考えてもかっこうが悪い。
ということで、CSS をあれこれいじってみて、これもなんとか解決する事ができました!
やり方は簡単で、以下の CSS を THE THOR に記述するだけです。
/* Foogallery並び整列 */
.fg-item {
vertical-align: initial !important;
}
記述する場所は、
管理画面 > 外観 > カスタマイズ > 追加CSS または、
管理画面 > 外観 > テーマエディター > style-user.css のどちらかに記述しましょう。
これで、画像がきれいに整列して表示されるようになります。
これで THE THOR テーマでの画像ギャラリー設置に
なんの問題もなくなったはずなので、思う存分ギャラリー機能を満喫しちゃいましょう!
同じような状態で悩んでいる方に、参考にしていただけたら幸いです。
注目の記事WordPressのウィジェットの間隔を自由に調整できる「余白ウィジェットプラグイン」
注目の記事EWWW Image Optimizer の設定方法と使い方【画像を圧縮して表示速度を改善】