トップページにヘッダー画像を付けました

ブログやホームページの「顔」としてトップページに

と設置されている画像を、一般滴に「ヘッダー画像」と呼びます。

 

「苺一会(いちごいちえ)」もサイトにインパクトをつけるべく!?このヘッダー画像を作成して設置してみました^^

 

トップページにヘッダー画像を設置!

「苺一会(いちごいちえ)」はWordpressというブログのシステムに、「Welcart」というカート機能を持つプラグインをインストールし、「Blanc」というテーマを使ってWordpress製のネットショップとして運営しています。

ですが、当ショップにはヘッダー画像と呼べるものがなく、シンプルな作りでやや寂しかったので、この度ヘッダー画像を作ってみました。

(一応デザイナーなのでw)

 

ヘッダー画像を複数設置するとスライダーになる

このテーマで驚いたのが、「複数画像を置くことでスライダーになる」ということでした(^_^;)

「スライダー」というのは、複数の画像をページを移動せずにペラペラ切り替えができるツールになるのですが、このテーマでは標準で付いていたということになります。

 

本来はPHPをいじったり、jQueryをインストールしたりと非常にややこしいのです。

また、Wordpressであればプラグインで実装する手もありますね^^

※ただしこのテーマの場合は自動で画像が切り替わらず、ボタンをクリック(スマホであればスワイプ)またはカーソルキー(←→)を押すことで画像の切り替えができるようになります。

 

設置したのはこの4枚

「苺一会(いちごいちえ)」のトップページに実際に設置したのは、こちらになります。

ヘッダー画像01
ヘッダー画像01

 

ヘッダー02
ヘッダー03
ヘッダー04

 

今まで作成したオルゴナイトの数が多すぎて、どの写真を使おうか非常に迷いました(^_^;)

でも、見栄えの良いオルゴナイトは「ジュピター(木星)」ですね!

ちなみにこの「ジュピター(木星)」は、プレゼント用として嫁いでいきました。

とても喜んでもらえたみたいで良かったです^^

 

というわけで、トップページを開いたらヘッダー画像も見てくださいねヽ(*´∀`)/

 

では、今回はこの辺で!

このページにキュンときたら
いいね!してくださいΣd(>∀<*)♪゚+.

Twitter で
LINEで送る
Pocket

苺一会サイトメニュー