TOP|レシピ集01

設定

ベースデザインを設定する

  • メインカラーを青(#3D8DCC)に設定します
  • ボタン1の色を青のグラデーション(左:#3BA3E5 右:#3D8DCC)に設定します
  • ボタン2の色を赤のグラデーション(左:#ED648A 右:#CC3D64)に設定します
  • ボタン3の色を青(#3D8DCC)に設定します
  • タグの色を青(#199CE9)に設定します

設定

セクション カスタマイズメニューを編集する

背景画像を設定します。

  • リピート設定 「背景を完全に覆う最小サイズ」
  • 背景画像を合わせる位置 「縦:上/横:右」

複合パーツ

メインビジュアル用|キャッチコピー

img_fukugou_mv01

キャッチコピーとサブコピーを設置できます。

【利用例】
トップページ、下層ページのメインビジュアル など
【ベースデザイン設定】
なし

単体パーツ

ボタン-資料DL

img_parts_btn02

ベースデザイン設定のボタンに資料ダウンロードアイコンが入ります。

【利用例】
資料ダウンロード、資料請求ページへの誘導 など
【ベースデザイン設定】
なし

セクションパーツ

商品・サービス|画像、テキスト

img_section_service05

サービス詳細ページへのリンクとなるセクションを設置できます。

【利用例】
サービス一覧、製品一覧・キャンペーン紹介 など
【ベースデザイン設定】
英字はベースデザイン設定のメインカラーに依存
カラム間の余白はベースデザイン設定の余白設定に依存

セクションパーツ

商品・サービス|サービス詳細1

img_parts_section_service01

サービス詳細ページへのリンクとなるセクションを設置できます。

【利用例】
サービス一覧、製品一覧・キャンペーン紹介 など
【ベースデザイン設定】
カラム間の余白はベースデザイン設定の余白設定に依存

設定

セクション カスタマイズメニューを編集する

背景色を水色(#F5FAFE)に設定します

複合パーツ

見出し|英字、見出し

img_parts_fukugou_h

見出しと補足の英字テキストを設置できます。

【利用例】
見出し など
【ベースデザイン設定】
英字はベースデザイン設定のメインカラーに依存

単体パーツ

リスト|記事リスト(行制限)

img_parts_linklist03

記事リストのタイトル、本文に特定の行数で「...」が表示されます。

【利用例】
ブログ記事一覧、導入事例の一覧表示 など
【ベースデザイン設定】
なし

単体パーツ

ボタン|矢印

img_parts_btn

ベースデザイン設定のボタンに矢印アイコンが入ります。

【利用例】
アンカーリンク、サイトの回遊用のリンク など
【ベースデザイン設定】
なし

セクションパーツ

リスト|お知らせ

img_section_list01

サイトのお知らせが入ったセクションを設置できます。

【利用例】
トップ、お知らせ など
【ベースデザイン設定】
なし

設定

セクション カスタマイズメニューを編集する

背景色を水色(#F5FAFE)に設定します

複合パーツ

ボックスリンク|2列

img_parts_fukugou_boxlink01

画像と見出しをボックスリンクで設置できます。

【利用例】
サイトの回遊用のリンク など
【ベースデザイン設定】
カラム間、見出し上下左右の余白はベースデザイン設定の余白設定に依存

単体パーツ

埋め込み|共通パーツ

img_parts_embed02

複数ページで使用した際リンク先を一括で変更できないので共通パーツがおすすめです
管理画面の「共通パーツ一覧」で作成し設置できます。

注意点

共通エリア「フッター」で作成されているエリアです。 作成する場合はこちらをご参照ください。
※一部CSSで表現している箇所がございます。

デザインでお困りの方へ

「ferret Oneで思い通りのデザインができない…」そんな時は 「ferret Oneクリエイターズ」にお任せ!
バナー制作やデザイン調整など、機能を熟知したプロがサポートします。