【The Thor】ギャラリーの枠線を消去するCSS

パソコンをする子犬

色々と高機能で便利なThe Thor。しかし、微妙に使い勝手が悪いことがありますよね?

特に気になるのがギャラリー使用時のグレーの枠線。(この記事をご覧の方は分かっていると思いますが、WordPressのギャラリーボックスではなく、クラシックエディター使用時のギャラリーです。)

この機能、非常に便利なのですが、どうしても強制的に表示される枠線が気になる。

「The Thor」のギャラリー機能で表示される枠
このうっすら見える枠です

ということで、今回はCSSを利用してこのグレーの枠線を消す方法を解説します。

非常に簡単なので、サクッといきます!

ギャラリーの背景色をCSSで変更する

一番簡単な解決法は、ギャラリーの背景色を記事の色と同じにすることです

ということで、以下のCSSをスタイルシートに貼り付けてやりましょう。
貼り付け場所 :  外観 > テーマエディター > style-user.css

.content dt{background-color:#fff; }

※”#fff “の部分は記事の背景色を入れてください
メインカラムにフレームを設定しているなら白(#fff)、当ブログのようにフレームを設定していなければブログの背景色ですね。

以下のように枠線が消えていればOKです。
ちなみに、記事の編集画面にはCSSが適用されないので、プレビューで確認してみてください。

以上で解決!みんな解散!

ここからは蛇足ですが、一応CSSを簡単に解説しますね。

ギャラリーには灰色の背景色が設定されているようなんです。
イメージとしては、灰色の四角形の上に画像を載せているような形ですね。これをbackground-colorで塗り替えているというわけです。

やりたい人は居ないと思いますが、カラーコードの部分を黄色にして目立たせることも可能ですよw

Easy Fancy Boxとの併用もオススメ

Easy Fancy Box

ギャラリー機能は画像が小さく表示されるのが欠点ではありますが、”Easy Fancy Box” というプラグインを組み合わせれば、「画像クリックで拡大」というアクションも付け加えられます。

申し訳ないのですが、当ブログには導入していないので気になる方は実際に導入してみてください。
導入方法はテックアカデミーさんが詳しく解説してくれています。

すごく便利ですよ!

まとめ

非常に短い記事になってしまいましたが、元々のテーマが小さいから仕方ないですねw(執筆時間15分)

この記事を書いたのも、誰も簡単な解決方法を書いていなかったからというだけです。プラグインを入れて解決する方法とかはあったんですけどね。

ということで、以上です!

ツイッターでは普段からこんな感じでブログ・デザインに関することなんかをつらつらとツイートしてますので、よければ絡んでくださいね!