トップページ設定

管理画面の【外観 > カスタマイズ > トップページ設定】では、ヘッダーアイキャッチや記事スライダー、ピックアップコンテンツなど、トップページのコンテンツに関するオプションを設定できます。

1 ローディングアニメーション（ver.1.13〜）
2 ヘッダーアイキャッチ
3 記事スライダー
4 ピックアップコンテンツ

ローディングアニメーション（ver.1.13〜）

管理画面の【外観 > カスタマイズ > トップページ設定 > ローディングアニメーション】では、ページ読み込み時の演出として表示できるアニメーションを設定できます。

ローディングアニメーションの表示	トップページまたは全ページに表示することができます。
表示時間	表示時間を指定する / 表示時間を指定しない(※)
表示時間の指定	表示する時間（1〜9秒）を指定できます。
ロード完了後のアニメーション	ローディング画面を終了する際のアニメーションを選択できます。フェードアウト / スライドアップ / 左右にスライド / 上下にスライド
背景色	ローディング画面の背景色を指定できます。

※表示時間を指定しない場合、ページの読み込みが完了するまで（最大9秒間）は表示されます。

ロード中に表示するアイテム

テキスト	ローディング画面内のテキストを入力できます。
テキストのフォント(※1)	ローディング画面内のテキストのフォントを選択できます。ベースフォント / Googleフォント(欧文)を適用
テキスト色	ローディング画面内のテキストの文字色を指定できます。
画像	ローディング画面内の画像を設定できます。
画像のサイズ	ローディング画面内の画像サイズを選択できます。 SS / S / M / L / LL / カスタムサイズ / 指定なし
画像のカスタムサイズ（PC用）(※2)	PC表示での画像サイズ（高さ）を数値(px)で指定できます。
画像のカスタムサイズ（スマホ用）(※2)	スマホ表示での画像サイズ（高さ）を数値(px)で指定できます。
ローディングスピナー	ローディング画面内に表示するスピナーを選択できます。ドット / サークル / スクエア / ループ / 表示しない
スピナー色	ローディング画面内に表示するスピナーの色を指定できます。

※1　【サイト全体設定 > フォント設定】のベースフォント、Googleフォント(欧文)で選択したフォントが反映されます。

※2　画像のサイズで「カスタムサイズ」を選択している場合のみ表示される項目です。

ローディングアニメーション（ver.1.13より追加）

ver.1.13にてローディングアニメーションを表示できる機能を追加しました。ページ読み込み時に、オープニングアニメーションのような演出として利用できます。ロ…

この機能を詳しく見る

ヘッダーアイキャッチ

管理画面の【外観 > カスタマイズ > トップページ設定 > ヘッダーアイキャッチ】では、トップページに表示するヘッダーアイキャッチに関する設定ができます。

ヘッダーアイキャッチの表示

表示する / 表示しない

アイキャッチイメージ（PC用 / スマホ用）

PC：画像	PC用のアイキャッチイメージ（画像）を設定できます。
PC：動画背景	PC用のアイキャッチイメージ（動画）を設定できます。 ※MP4形式などの動画ファイルのみ有効
SP：画像	スマホ用のアイキャッチイメージ（画像）を設定できます。 ※この項目が設定されていない場合は「PC：画像」または「PC：動画背景」が適用されます。
SP：動画背景	スマホ用のアイキャッチイメージ（動画）を設定できます。

アイキャッチテキスト

メインテキスト：大	ヘッダーアイキャッチ内のメインテキストを入力できます。(※)
サブテキスト：小	ヘッダーアイキャッチ内のサブテキストを入力できます。(※)
テキスト色	ヘッダーアイキャッチ内の文字色を指定できます。
テキストのウェイト	ヘッダーアイキャッチ内のテキストの太さを選択できます。
テキストの配置	ヘッダーアイキャッチ内のテキストの表示位置を選択できます。

※メインテキストまたはサブテキスト、何れも入力がない場合はアイキャッチイメージのみが表示されます。

リンクボタン

リンクURL	ここにリンク先URLを入力することで、ヘッダーアイキャッチ内にリンクボタンを表示できます。
ボタンテキスト	リンクボタンのテキストを変更できます。
ボタンスタイル	リンクボタンのスタイル（デザイン）を選択できます。
ボタンテキスト色	リンクボタンの文字色を指定できます。
ボタン背景色	リンクボタンの背景色を指定できます。
背景色の追加	ここで色指定を追加することで、リンクボタンの背景色をグラデーション化できます。
ボタンアニメーション	リンクボタンのアニメーション効果を選択できます。

オーバーレイ効果

オーバーレイ設定	ヘッダーアイキャッチ全体のオーバーレイ効果（フィルター）を選択できます。
オーバーレイカラー	オーバーレイ効果の色を指定できます。
オーバーレイの不透明度	オーバーレイ効果の不透明度を指定できます。

サイズ

最小の高さ（PC用）	PC用のヘッダーアイキャッチの最小の高さを指定できます。ブラウザウィンドウの縦サイズに対する割合を数値で入力します。
最小の高さ（スマホ用）	スマホ用のヘッダーアイキャッチの最小の高さを指定できます。画面の縦サイズに対する割合を数値で入力します。

ヘッダー透過

ヘッダー背景を透過する

ヘッダーアイキャッチの上にサイトヘッダーを重ねて透過表示することができます。

※ヘッダー透過時のロゴ画像やメニューテキストの色などは【サイト全体の設定 > ヘッダーエリア】のオプションで変更できます。

記事スライダー

管理画面の【外観 > カスタマイズ > トップページ設定 > 記事スライダー】では、トップページに表示する記事スライダーに関する設定ができます。

スライダーの表示	表示する / 表示しない
スライダーの横幅（PC用）	記事スライダーの表示幅を選択できます。コンテンツ幅 / 全幅（ワイド）
スライダーのタイプ	記事スライダーの表示タイプ（デザイン）を選択できます。ノーマル / オーバーレイ / ティッカー（テキストのみ）
スライダーのサイズ	記事スライダー内のサムネイル画像のサイズを選択できます。
テキスト色	記事スライダー内の文字色を指定できます。
スライド表示する最大記事数	記事スライダー内に表示する記事件数の上限を指定できます。

※任意の投稿・固定ページにpickupタグを設定して記事スライダーとして表示することができます。

※スライダーが動作するには、4件以上の投稿・固定ページにpickupタグが設定されている必要があります。

その他オプション

自動再生	記事スライダーを自動でスライドする / 自動でスライドさせない
自動再生の切り替え時間	スライドの間隔（秒数）を指定できます。
インジケーターの表示	記事スライダー下のページ送りの表示 / 非表示

ピックアップコンテンツ

管理画面の【外観 > カスタマイズ > トップページ設定 > ピックアップコンテンツ】では、トップページなどに表示するピックアップコンテンツに関する設定ができます。

ピックアップコンテンツの表示	トップページまたは全ページに表示することができます。
バナー画像のサイズ比率	ピックアップコンテンツに表示するバナー画像のサイズ比率を選択できます。それぞれサイズが異なるバナー画像を設定した場合も、ここで選択した表示比率に揃えることができます。

バナー01〜04

バナー：画像	ピックアップコンテンツに表示するバナー画像を設定できます。
バナー：リンク	バナーに設定するリンク先URLを指定できます。
バナー：テキスト	バナーに表示するテキストを入力できます。バナー画像にオーバーレイ背景を重ねて表示します。