トップページの設定方法

トップの「CBの代わりに固定ページの本文を表示するオプション」は無くしますね。フリースペース（パターン）でつくれるため。
コンテンツ幅は自由入力式に変更してもらいます（初期値、プレースホルダー追加）。

サイトの玄関口となるトップページを設定していきます。

サイト内の各コンテンツへの導線となりますので、下層ページ（詳細ページ）をある程度準備してからの方が設定しやすいです。

下層ページとは、以下のことを指しています。　>>投稿タイプの使い分けについて

• 投稿ページ：集客ブログやコラム
• お知らせページ：告知など
• 季節の行事ページ：投稿・お知らせとは別のコンテンツとして利用
• 固定ページ：時系列をもたない独立した記事。アクセスぺージなど

各投稿タイプの利用は必須ではありませんが、当記事では、各種下層ページとそのカテゴリーなどを作成している前提で、トップページの設定方法を解説いたします。

設定できる内容

トップページは以下の項目に分かれています。

設定箇所

トップページは、ダッシュボード内のTCDテーマ > トップページで設定します。

ヘッダーコンテンツ

サイトのファーストビューであり、「掴み」になります。ここにはイチオシの画像や動画を設定していただければと思います。

ヘッダーコンテンツには、次のオプションが用意されています。

• ヘッダーバー
• スライダー
• ニュースティッカー

それぞれ詳しく見ていきましょう。

ヘッダーバー

まず最初にヘッダーバーの背景を選択できます。スライダーに設定する画像・動画が明るい色の場合は「普通」を選択すると、メニューの文字リンクが読みやすくなります。

スライダー

コンテンツタイプ（キャッチコピーorロゴ）によって設定できる項目がかわります。

「背景」の設定項目は以下のようになっています。

• 背景タイプ（画像/動画/YouTube）
• アニメーション（フェード/ズームイン/ズームアウト）（※「画像」時のみ）
• オーバーレイのカラーと透過率
• 縦幅（原寸サイズorフルサイズ）

背景上の文字が読みづらい、ロゴが同化するという場合は背景にオーバーレイをかけて可読性を高められます。

ニュースティッカー

記事が1件ずつ切り替わるニュースティッカーを表示できます。

以下の項目を設定するだけです。

• ニュースティッカーの表示/非表示
• 投稿タイプ（投稿orお知らせ）

ヘッダーコンテンツの設定が済んだら、お使いの端末で実際の表示を確認しておきましょう。

• 全体的なバランスは？
• メニューなどの文字は読みやすい？
• 背景は意図した表示になっている？

バランスが取れていないように感じる場合は、ロゴやヘッダーも確認してみるといいですね。

メインコンテンツ

メインコンテンツには以下のアイテムが用意されています。

• 投稿一覧
• お知らせ一覧
• 季節の行事一覧
• ラージバナー
• バナーリスト
• フリースペース

お好きなアイテムを追加して、ドラッグ&ドロップで自由に並び替えができます。表示・非表示もワンクリックで変更可能です。

これらのアイテムを使わず、完全オリジナルでトップページを作成したい場合は固定ページの内容を表示することも可能です。リンク先をご確認ください。

投稿一覧

投稿記事を一覧表示します。

お知らせ一覧

お知らせ記事を一覧表示します。画像なしのシンプルなレイアウトになっています。

季節の行事一覧

季節の行事記事をスライダー形式で一覧表示します。

ラージバナー

画面幅いっぱいの背景画像とテキストを表示します。コンテンツタイプ（見出しorキャッチフレーズ）によって設定できる項目が切り替わります。

デモサイトでは、「知る」で『見出し』を設定したラージバナーを表示しています。

見出し設定時は以下のような設定項目が表示されます。

キャッチフレーズ設定時の設定項目はこちら。ボタンリンクを表示できます。

バナーリスト

タイトル・画像・リンク先を設定したバナーを最大4つ表示できます。設定項目は上の画像でわかるようにシンプルです。

画像を削除するとそのアイテムは表示されなくなります。

フリースペース

HTMLタグまたはパターンを使ってお好きな内容を表示できます。

• 見出し（他のコンテンツと同じ体裁の見出しを表示できます。）
• 横幅（他コンテンツと同じorフル幅）
• コンテンツ（HTMLタグorパターン）

パターンの活用方法
「パターン」では、外観 > パターンで作成したコンテンツを表示できます。当デモサイトのこの箇所は「パターン」を使って表示しています。

あなたのダッシュボードで外観 > パターンを開くと、「縦向きテキスト」というパターンが登録されているはずです。こちらを書き換えて利用することでデモサイトと同じ体裁のコンテンツを再現することができます。

固定ページ（フロントページ）で作成する

トップページとして設定されている固定ページのエディタの内容を表示できます。完全オリジナルでトップページを制作したい方は、こちらの機能をご利用ください。

表示するコンテンツの横幅を選択できます。

• フルサイズ（横幅100%）
• カスタムサイズ（任意の数値入力）

これでトップページの設定は完了です。お疲れ様でした！大事なページですので、必ずお使いの端末で実際の表示を確認しておきましょう。

• コンテンツは意図したように表示されている？
• 表示する記事の数はちょうどいい？

トップページは「サイトの玄関口」にあたり最も大切といってもいいぺージです。定期的に見直して運用していきましょう。