wordpress

Smart Sliderのプラグインで画像に網掛け

投稿日:

スマートスライダー

 

スライダー画像に網掛けをする

 

簡単にフェードアウトやスライダーができるWordPressのプラグインで有名な【Smart Slider】を使って、画像に網掛けをしたいと思います。

プラグインのインストール方法は今回省略します。

 

網掛けしたい画像を選択

 

画像選択

1.WordPress管理メニューから「Smart Slider」をクリック

2.Smart Sliderの画面(Dashboard)から作成したスライダーをクリック

3.上図のように登録した画像が表示されます。

4.各画像の上にマウスを持っていくと、「EDIT」が表示されるのでクリック

 

選択された画像が表示されます

 

選択画像

 

この状態で、左のメニュー(赤枠の部分)をクリック

 

レイヤー画像を選択

 

画像レイヤー

 

1.レイヤー画像を選択できるように別枠のメニューが表示されます。

2.Imageのところで、画像を選択するか、アップロードします。

今回は、黒っぽい透過された画像にしてみました。

わかりやすく、写真画像と同じサイズの透過された画像(gif形式かpng形式)を用意するといいですね。

 

レイヤー画像の調整

 

レイヤー画像調整

 

あとは、レイヤー画像の位置等を細かく調整することも可能です。

 

上図のように、画像にマウスを持っていくと、左上に「LAYER」が表示され、さらに「LAYER」にマウスを持っていくと、矢印などが表示されます。

その矢印をクリックすることでレイヤー画像の調整も可能です。

 

最初はレイヤー画像の周りに隙間ができていて、少し悩みましたが、上図のPaddingのところを調整することで直りました。

 

 



-wordpress
-, , , ,


comment

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

関連記事

秒後に切り替わる

WordPress 指定したページにジャンプさせる方法しかもフェードインで滑らかに表示

【自動で切り替わる】【何秒後に切り替わる】【指定したページにジャンプさせたい】 たぶんこれを使う理由としては、 ・新しくWebサイトを作り直した時に、古い方のURLにアクセスした人に自動で新しいURL …

ヘッダー画像変える

ヘッダー画像やスライダーをページ毎に変える方法

  WordPressで作成したページで、ヘッダー画像やスライドショーをページごとに変えたい! 今回やってみたことは、条件分岐でヘッダーの画像部分を振り分けるといった方法です。 プラグインな …

選手一覧メンバー一覧

WordPress テーマLIQUID PRESSでメンバー紹介や選手一覧などを作ってみた⑤

  1.選手一覧、メンバー一覧表示   選手登録を、とりあえず5名登録したら、今度は一覧表示で見てみたいです。 そこで、前回説明した「archive-member.php」を使って …

メンバー紹介選手紹介

WordPress テーマLIQUID PRESSでメンバー紹介や選手一覧などを作ってみた①

  WordPressでスポーツチームやサークルのメンバー紹介や選手紹介または、企業やショップなどの人物紹介などのページを作るときに行う方法として、Web製作者それぞれやり方はあると思います …

ワードプレスにアメブロ

ワードプレスにアメブロ

  ワードプレスの固定ページにアメブロの記事を読み込む WordPressでホームページを作りたいけどアメブロを止めたくない ブログを作成するなら有名なアメブロが簡単で始めやすいので、今も更 …