WordPress Cocoonのカスタマイズ③【ブログのアピールエリアを設定する】

WordPress Cocoonのカスタマイズをやってみたシリーズ第2弾は【ヘッダーメニュー・アイコンをつける】です。

WordPress Cocoonは完全無料で拡張性が高いのが特徴、ユーザーも多くテーマ利用マニュアルなど、チュートリアルも豊富なので、ボクもずっとこのCocoonを愛用しています。

この記事では、Cocoonをちょっとおしゃれにカスタマイズしたいけど、何から手を付けたら良いか分からない初心者向けの設定方法とビフォー・アフターをご紹介します。

こちらが完成形。

アピールしたい記事URLはもちろん、画像を入れるなど、カスタマイズすることが可能です

設定方法

Cocoon設定>アピールエリアを選択します

アピールエリアの詳細設定をします

アピールエリアの表示 ▶全ページ表示

高さ ▶200

エリア画像 ▶そのまま

エリア背景色 ▶ここでは、#1e73be(カラーコード) と入力

テキストエリア表示 ▶☑テキストメッセージエリアを表示する

タイトル ▶そのまま

メッセージ ▶そのまま

ボタンメッセージ ▶表示したいメッセージを入力します

ボタンリンク先 ▶リンクさせたいURLを入力します

ボタンリンクの開き方 ▶同じタブで開く(_self)

ボタン色 ▶ここでは、#1e73be(カラーコード) と入力

このように設定できたら「変更をまとめて保存」をすれば完成です。

ここからのカスタマイズは、CSSを追加して行うことになります。

実際にコピペして使えるCSSを紹介しているサイトが幾つかあるので、好きなパターンを選んでやってみることをおすすめします。

💡今日のなるほど

集客できてきたら、アピールエリアをしっかり活用しましょう。

コメント

タイトルとURLをコピーしました