ギャラリーブロックのキャプション問題
WordPressアップデートの影響で、ギャラリーブロックにキャプションをつけると勝手に画像がボカされてしまいます。これをなんとかしたいのですが、悪戦苦闘中。
わざわざキャップション入れる用のデザインにしてるのに余計なことしてくれるわホンマ😢




検証ツールで調べてみたところ、以下の様なcssが効いてることがわかりました。
擬似要素を使ってキャプションの背景にブラーをかけていますね。
.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption):before {
-webkit-backdrop-filter: blur(3px);
backdrop-filter: blur(3px);
content: “”;
height: 100%;
-webkit-mask-image: linear-gradient(0deg, #000 20%, #0000);
mask-image: linear-gradient(0deg, #000 20%, #0000);
max-height: 40%;
}
そこで、下のような追加CSSを書いてみました。
内容としては単純でblurの値を0pxにしただけです。
.wp-block-gallery.has-nested-images figure.wp-block-image:has(figcaption):before {
-webkit-backdrop-filter: blur(0px);
backdrop-filter: blur(0px);
}




うまくいきましたね。