ホームページの第一印象を決めるメインビジュアルを、WordPress管理画面から変更できる機能を標準テーマに組み込んでいます。

画像や動画の追加・並び替えだけでなく、キャプションや表示位置、切り替え時間なども設定でき、制作側ではさらに細かなデザイン調整にも対応できます。

FEATURE

更新しやすさと細かな調整を両立

クオリティWebデザインのメインビジュアル機能は、お客様が日常的に操作する設定と、制作側が行う詳細なデザイン設定を分けています。

普段の画像変更や並び替えはわかりやすく操作でき、表示方法やレスポンシブ対応などの細かな部分は制作側で調整できるため、使いやすさを保ちながら幅広いご要望に対応できます。

BASIC SETTINGS

画像・動画を管理画面から設定

メインビジュアルに使用する画像や動画は、WordPress管理画面から追加・変更できます。

複数のスライドを登録でき、ドラッグ操作や上下ボタンで表示順を変更できるため、HTMLやCSSを編集する必要はありません。

主な設定内容

画像・動画の追加、削除、並び替え、各スライドの表示位置などを設定できます。

イメージ画像:メインビジュアルの個別設定

CAPTION

キャプションも管理画面から編集

メインビジュアル上に表示する見出しや説明文、リンクなどのキャプションも管理画面から編集できます。

ビジュアルエディターを利用できるため、通常のWordPress編集画面に近い感覚で内容を変更できます。

文字の位置や配置方法についても設定でき、画像に合わせて見やすい位置へ調整できます。

イメージ画像:メインビジュアルのキャプション設定

FUNCTION

表示時間や画像効果も設定できます

スライドの表示時間や切り替え時間、画像フィルター、マスクカラーなども設定できます。

写真をそのまま表示するだけでなく、キャプションを読みやすくするために画像を暗くしたり、色味を調整したりすることもできます。

サイトのデザインや掲載する画像に合わせて、メインビジュアル全体の雰囲気を調整できます。

イメージ画像:メインメインビジュアルの機能設定

ADVANCED SETTINGS

制作側ではさらに細かな調整が可能

お客様が日常的に操作する設定とは別に、制作側ではメインビジュアルの表示方法をさらに細かく設定できます。

サイトデザインやご希望に合わせて、各端末での表示サイズやアニメーション、操作ボタンなどを調整します。

調整できる主な内容

表示幅、余白、角丸、端末ごとのアスペクト比、アニメーション、ナビゲーションボタン、スライドセレクターなどを個別に設定できます。

イメージ画像:制作側のメインビジュアル詳細設定

ANIMATION

サイトに合わせて表示方法を選択

01

フェード

画像をゆっくり切り替える、落ち着いた印象の表示方法です。企業サイトなど幅広いホームページで利用できます。

02

横スライド

画像を横方向へ切り替える表示方法です。必要に応じてセンターモードなどの調整にも対応できます。

03

ループ表示

複数の画像を連続して表示する構成にも対応し、画面サイズに応じて表示枚数を調整できます。

RESPONSIVE

スマートフォン・タブレットにも対応

メインビジュアルは、スマートフォン・タブレット・パソコンそれぞれの画面サイズに合わせて表示を調整できます。

端末ごとにアスペクト比や表示方法を設定できるため、パソコンでは横長、スマートフォンでは高さを確保するといった調整も可能です。

画像の重要な部分が見切れないよう、各スライドごとに表示位置を調整することもできます。

VIDEO

画像だけでなく動画にも対応

メインビジュアルには静止画だけでなく、動画ファイルを使用することもできます。

写真では伝えにくい店舗の雰囲気やサービスの動き、施設や商品のイメージなどを、動画を使って表現することも可能です。

動画はファイル容量が大きくなりやすいため、ホームページの表示速度や通信量も考慮して使用します。

MERIT

専用プラグインに頼らない独自実装

クオリティWebデザインでは、メインビジュアルのためだけに外部のスライダープラグインを追加するのではなく、独自テーマ側に必要な機能を組み込んでいます。

サイトに必要な機能だけを用意し、管理画面も実際の運用に合わせて構成することで、余計な機能を増やさず使いやすいホームページを目指しています。

FAQ

メインビジュアルについて
よくあるご質問

SUMMARY

更新しやすく、デザインにも柔軟に対応できるメインビジュアル

クオリティWebデザインのメインビジュアル機能は、お客様が画像や動画を更新しやすい管理画面と、制作側が細かな表示調整を行える設定を組み合わせています。

日常的な更新はわかりやすく、デザインや動作についてはサイトに合わせて柔軟に調整できるようにすることで、公開後も使いやすいホームページを目指しています。