妻がアイキャッチ画像を丸くしたいと言い出した
「ねえねえ、アイキャッチ画像が丸かったら可愛くてオシャレじゃない？」と妻が言い出した。
アイキャッチ画像って何？妻に聞くと、
妻が参考に買った『本気で稼げる アフィリエイトブログ』を渡された・・・
アイキャッチ画像は、「記事の顔」です。タイトルのすぐ下（もしくは上）に来る画像で、記事の中で最初に目につく画像になります。また、FacebookやTwitterなどのSNSで記事をシェアしたときに、目を引いて読者を誘導する役割もあります。
もしアイキャッチ画像が設定されていなかったら、はてなブログやWordPressの初期画像が表示されてしまうので、記事がシェアされたときにインパクトがなくなってしまいます。
と書いてある。
なるほど、これは大切だな。「よしアイキャッチ画像を丸くしよう！」
まずは、インターネットで検索。「アイキャッチ画像 丸くする・・・」
たどり着いたのがこのサイト↓
【Stinger5カスタマイズ】WordPressのアイキャッチ画像を丸く切り抜く | ZOC
最初はアイキャッチ画像の大きさなどを「function.php」で変更するのかな？と思いましたが、
色々と調べると単純にcssを編集すれば良いみたい。
までは理解できたが、その後の内容はボクの理解力ではついて行けなかった。
どうしよう・・・CSSを編集すればいんだよな。ってCSSって何だっけ？
妻が参考に買った（ちなみに妻はまったく読んでいない）『ゼロからわかるHTML＆CSS超入門』によると、
CSSとはCascading Style Sheetsの略称で、単にスタイルシートとよばれることもあります。スタイルシートは、文字の大きさや背景の色、全体のレイアウトなどwebページの見た目（スタイル）を定義する視覚表現のためのしくみで、・・・・
ということらしい。
つまり、アイキャッチ画像を丸くするためのCSSを編集すれば良いんだ。
『ゼロからわかるHTML＆CSS超入門』によると、編集する内容は、border-radiusプロパティという部分で、ボーダーの角の丸さを定義するものらしい。
★丸くする場合の編集内容 border-radius:100%
次に、これをアイキャッチ画像に反映する方法を考える。
まず、アイキャッチ画像のCSSの現在の記述を把握する方法をインターネットで検索。
たどり着いたのがこのサイト↓
Chromeブラウザの検証機能でCSSスタイルの確認や変更をテストする方法
border-radius:100%と編集してみたら、アイキャッチ画像が丸くなった！
このCSSをコピーして、妻のwordpressのテーマの編集にあるスタイルシート（style.css)に貼り付け更新したら、妻のブログサイトのアイキャッチ画像が丸くなったのであった。
