customize【備忘録】WordPressギャラリーにつく枠線を消す方法(CSSのみで対応)

blanc note.のカスタマイズ

WordPressのギャラリー、便利ですよね。
でもね、ボーダーがついてしまうのです……。しかも微妙なボーダー。

そこで、CSSだけでボーダーが消せないかなと思い、成功したので備忘録を残しておきます。

検索したら、こんな方法がありました

WordPress標準のギャラリーのCSSをカスタマイズする方法


こちらは、functions.phpでギャラリー用のCSSを上書きし、ご自身でcssを書く方法。
しっかりデザインしたいならおすすめ!

(メモ)WordPressギャラリー画像のグレーの枠線を消すには


こちらは、大元のwp-include/media.phpを編集して、ボーダーを消しちゃおうという骨太な解決方法。
WordPress本体をアップデートすると、設定しなおしになるのが玉に瑕でしょうか。
もうちょっと楽できる方法はないかな〜と検索を続けていたら、もっと素敵なアイデアを発見。
http://xirasaya.com/?m=detail&hid=465
「連番のIDやクラスをまとめて指定する書き方」があったんです! 知らなかった!

お使いのCSSに下記を足せば解決

WordPressのギャラリーは、「#gallery-連番」というIDが振られる仕様。
ID=”#gallery-1″
ID=”#gallery-2″
ID=”#gallery-3″
ID=”#gallery-4″
ID=”#gallery-5″
WordPress側で、IDに対してスタイルを指定しています。
そこで、「#gallery-ナンタラ」という接頭辞でIDが始まったときは、borderをナシにするように、指定し、important!で上書きしているのです。

適応すると……。ねっ、線が消えました〜!

以上でした。

UX/UI Designer luelue

イラストレーター→デザイナー→Webデザイナー→Webディレクターとして働く小学一年生のママ。
出産前に描いた「仕事と子育てとの両立」についての見通しが甘く、出産してはじめて、今までのようには働けないのだと気づきました。
好きな仕事だからこそ諦めることが悔しくて、以来、今の自分にできる最善な働き方を求め行動しています。
どんな立場であれ、女性は人生のステージが変わるたびに「生き方が180度ひっくり返ってしまう」と感じた経験から、人生の転機に少数精鋭で働くことを選んだ女性オーナー様を、起業とは切っても切れない 「自分メディアづくり」で応援しています。

コメントは受け付けていません。

ブログ一覧へ戻る