#08 ヘッダー画像の設定


 

前回、 記事のカテゴリー分けをしてサイトメニューも制作し、かなりWebサイトらしくなってきました。

詳しくはこちら「素人ホームページ制作!8つの基本!#07 カテゴリー分けしてサイトメニューを作ろう」をご覧ください。

今回はヘッダー画像の設定を行いたいと思います。

 

ヘッダー画像の設定

ヘッダー画像って何?

たくさん有るWebサイトを色々覗いてみると、大体のWebサイトは画像がサイトイメージとして使用されているのを目にします。

ヘッダー画像はトップページだったり、サイトメニューの上や下に使用されているイメージ画像のことです。

 

ヘッダー画像って必要なの?

ヘッダー画像の無いWebサイトもたくさん有ります。

しかし私は、画像でWebサイトのイメージを伝えることができる視覚的情報は大事だと思います。

本来Webサイトは、情報を伝えるものです。

情報がしっかりしていれば、問題は有りませんが画像を使用する事で、見て貰える機会が増えるのではないかと思います。

 



 

ヘッダー画像の設定方法

私が使用しているテーマ「Lightning」では、サイズ幅 1900×500pxが推奨している画像サイズです。

高さは500pxでなくても、幅が1900pxであれば大丈夫です。

ただ高さの数値が大きすぎると、画面いっぱいヘッダー画像になってしまい、逆に記事を読んで貰えない可能性が高くなるので要注意です。

テーマ「Lightning」では、スライド機能も備わっているので、画像を数枚用意し、スライド表示させることもできます。

私は4枚の画像をスライドさせています。

 

では、設定してみましょう!

用意する画像は自分が気に入ったもので構わないのですが、ご自身のWebサイトのコンセプトを表現できるような画像を使うようにしましょう。

あまりにWebサイトのコンセプトとイメージがかけ離れていると、Webサイトに訪れた方は「???」となってしまうこと間違いなしです。

 

メニューの外観からカスタマイズをクリック。

カスタマイズ画面からLightningトップページスライドショーをクリック。

Lightning標準の画像が入っているので、「削除」ボタンをクリックして設定画像を消します。

もしくは、「画像の変更」ボタンをクリックして、画像を差し替えます。

スライド画像1だけを設定すれば、ヘッダー画像は固定画像になります。

スライド画像2,3,4と追加していくと、スライド形式で表示されます。

スライド画像1の下の「画像を選択」ボタンをクリック。

メデイアページが開くのでヘッダー画像用に準備した画像をドラッグ&ドロップして選択します。

 

スライド画像タイトル

画像のタイトルを入力します。

検索ワードの対象となりますので、入力しておきましょう。

 

スライド画像リンク先URL

スライドされるヘッダー画像をクリックした時に、表示されるページのURLを入力します。

入力しなければ、リンク先の設定はされません。

 

右の確認エリア画面で、スライドが表示がされていれば、「保存して公開」ボタンをクリック。

これでヘッダー画像の設定は以上です。

 

という事で今回はここまで。

最後まで読んで頂きありがとうございました。

 


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です