WordPressの画像に枠線を表示する方法は、とても簡単です。
白い背景のブログに白い画像を載せると、境界がわからなくて残念な印象だったので、薄くボーダーラインを付けました。
修正したのは2点です。
style.cssの修正
「style.css」の最後に下記のコードを追加します。
/* 画像の枠線 */
img.border {
border: solid 1px #cccccc; /* スタイル,太さ,色 */
}
線のスタイルや太さ、色はお好みで変更してください。
子テーマを編集するときは、子テーマの「style.css」を変更します。
画像の設定
枠線を付けたい画像をクリックします。
「 編集」ボタンをクリックします。
画像詳細 > 上級者向け設定
「画像CSSクラス」に「border」と記入して「更新」ボタンをクリックします。
背景と一体化してわかりにくかった画像が、
断然見やすくなりました。嬉しい。
Gutenbergエディターで枠線を付けるときには、こちらをご覧ください。
Gutenbergで画像に枠線を表示する方法【WordPress】
まとめ
2ヶ所を変更するだけで、ブログの記事がぐっと見やすくなりました。
背景と同系色の画像を挿入するときには、枠線を付けるとわかりやすくて親切ですね。
画像ごとにボーダーの表示を指定するのではなく、すべての画像に無条件で表示することもできますが、広告にも枠が付いて目立ってしまうことがあるので注意が必要です。
