cocoonで画像に枠線を入れる・消す方法

今回はワードプレスの無料テーマである
Cocoonで作成したブログの記事内へ

挿入した画像へ「枠線を付ける方法」と「消す方法」

を解説していきたいと思います。

枠線を付けることで
画像と文章の区切りが出来るので
見やすいブログになります。

例

枠線が無い場合↓

枠線がある場合↓

このように枠線があると無いとでは
見やすさの違いがあることが分かると思います。

Cocoonを使用していれば
簡単に枠線を表示させることが
できるようになります。

それでは行きましょう。

Cocoonで枠線を表示・非表示にする設定

まずワードプレスのダッシュボードよりCocoon設定をクリックします。

そして次に画像をクリックします。

そうすると本文画像設定という項目が出てくるのでスクロールして画像の囲み効果にあるチェックをなしから４つのバリエーションの中から選択してチェックを入れます。

後は変更をまとめて保存をクリックすれば画像の枠線が反映されます。

Cocoon画像枠線４つバリエーションの表示され方

Cocoonには画像枠線の種類が４つ用意されています。ここでは４種類が実際の記事でどのように表示されるかを紹介します。

ボーダー２種

シャドー２種

実際の記事ではこのように表示されます。

cocoonで画像に枠線を入れる・消す方法まとめ

Cocoonでは、個別の画像ごとに
枠線を変えたり無くしたりは出来ませんが
簡単に記事内の画像へ枠線を表示させることができます。

参考にしてみてください。

挿入画像に設定することでSEO効果を上げる方法とは？

記事へ導入した画像へ記事に関係している適切なキーワードを入れることで、画像検索からのアクセスを呼び込むことが出来るようになります。

その方法をこちらの記事で解説していますので参考にしてみてください。

【画像SEO】alt属性の設定方法とは？