ヘッダー動画は、フルスクリーンで動画を表示するファーストビューです。 MP4形式の動画ファイルかYouTubeを指定できます。

ヘッダー動画の設定

WordPress管理画面にログイン後、メニュー名「外観」>「カスタマイズ」>「ファーストビュー設定」>「表示設定」をクリックします。

表示設定」レイアウトを「ヘッダー動画」に指定してください。

ファーストビュー設定」>「ヘッダー動画」をクリックし各種設定をおこないます。

動画タイプの設定

動画タイプの指定やサウンド再生ボタンの表示、YouTube動画のフィルター指定が可能です。

  • 動画タイプ:MP4か YouTubeの指定が可能です。
  • SOUNDボタン[PC]:音の再生ボタンを表示します。スマホは非表示です。
  • MP4ファイル:MP4形式の動画ファイル(アスペクト比16:9)に対応しています。
  • YouTube URL:表示したいYouTubeのURLを入力してください。
  • YouTube ぼかしフィルター:YouTube動画をぼかすします。
  • YouTube グレイフィルター:YouTube動画をグレイカラーにします。
  • YouTube セピアフィルター:YouTube動画をセピアカラーにします。
  • 背景画像[SP]:スマホ表示時に動画の代わりに画像を表示します。
  • 画面の高さ[PC]:vh:パソコン表示時に画面の高さを指定します。
  • 画面の高さ[SP]:vh:スマホ表示時に画面の高さを指定します。
  • レスポンシブ動画[SP]:スマホ表示時に横幅100%で表示します。

YouTube ぼかしフィルターとYouTube グレイフィルター、YouTube セピアフィルターを使用すると動画再生の負荷がかかるのでご注意ください。

動画ヘッダーの表示例

動画の読み込みに時間がかかるケースを想定して、ローディングアニメーション設定の有効化を推奨します。

ボタン関連

問い合わせなどに誘導するボタンを設置する機能です。ボタンの横幅サイズの指定や、ボタンのクリックを誘導するマイクロコピーの配置や、クリック時に新しいウィンドウ(別タブ)の切り替え指定も可能です。

Click IDは、Googleタグマネージャーを使ったボタンクリックを計測するのに使用します。Click IDには、他と重複しないIDを入力してください。Googleタグマネージャーでクリックを計測する設定は、専門書またはGoogle検索にてお調べください。

タイトル 文字サイズ[PC][Tablet][SP]

タイトル 文字サイズ[SP]は、スマホからWebサイトを表示した際に適用されます。
タイトル 文字サイズ[Tablet]は、タブレットサイズ(画面幅959px以下)に適用されます。
タイトル 文字サイズ[PC]は、画面幅960px以上に適用されます。

サブタイトル文字サイズ[PC][Tablet][SP]

サブタイトル 文字サイズ[SP]は、スマホからWebサイトを表示した際に適用されます。
サブタイトル 文字サイズ[Tablet]は、タブレットサイズ(画面幅959px以下)に適用されます。
サブタイトル 文字サイズ[PC]は、画面幅960px以上に適用されます。

メッセージ文字サイズ[PC][Tablet][SP]

メッセージ文字サイズ[SP]は、スマホからWebサイトを表示した際に適用されます。
メッセージ 文字サイズ[Tablet]は、タブレットサイズ(画面幅959px以下)に適用されます。
メッセージ 文字サイズ[PC]は、画面幅960px以上に適用されます。

アニメーション効果[テキスト]

アニメーション効果[テキスト]は、タイトル・メッセージなどの要素にアニメーションを付与する機能です。アニメーションは、フェードインかスライドアップのいずれかを指定できます。

ダウンアイコンの表示

ダウンアイコンは、画面スクロールが可能であることを示すアイコンです。横軸に回転するスピンアニメーションと縦軸に移動するフェードダウンアニメーションの表示が可能です。

オーバーレイ[フロントページ]

オーバーレイ[フロントページ]は、背景画像をロゴ(サイト名)やヘッダーメニューのエリアまで覆う設定です。WordPress管理画面にログイン後、メニュー名「Emanon設定」をクリックし、タブレイアウトをご覧ください。

オーバーレイ[フロントページ]

オーバーレイ[フロントページ]:無効・有効の表示例

オーバーレイ[フロントページ]:有効
オーバーレイ[フロントページ]:無効