前回の記事「てがきノート活用記、ラベル色とカルーセルでサイトに動きを」では、トップ画面上部にあるアピールエリアについて触れました。そこで今回は、かめコンパスさんのブログ「【Cocoon】アピールエリアの設定方法｜おしゃれなデザインでPV数・収益力UP！」を参考にしながら、実際にアピールエリアを設置してみることにしました。
まずは、自分の大好きな画像を使うことにしました。アピールエリアに設置するために、画像の大きさ（横幅：1920px、高さ：800px）に合わせてCanvaで作成。参考にした記事にCanvaでの作り方も載っていたので、操作はとてもスムーズで、あっという間に仕上げることができました。
次に、Cocoon設定の［アピール］タブを開き、必要な項目をいくつか選択しました。今回は以下のように設定しています：
- フロントページのみで表示する
- 高さ：800
- エリア画像：アピールエリアの背景画像を固定する
- 「テキストメッセージエリアをクリックする」を選択
- タイトルは空欄にして、メッセージとボタンメッセージを設定
シンプルながらも、トップページの雰囲気をぐっと引き締めてくれる仕上がりになりました。
この中でも特に秀逸だと感じたのが、アピールエリアの背景画像を固定する設定。
上下にスクロールしても背景画像が動かず、まるでおしゃれなウェブサイトでよく見かける演出のような見せ方ができました。これは想像以上にサイト全体の印象をグッと高めてくれるので、おすすめの設定です！
