wordpress【賢威6.1】でスライドバーを設置する方法 『Easing Slider “Lite”』

この記事は約2分で読めます。

こんにちはFPヒデです。
今回はWordpressで、よくヘッダー下にある画像がスライドしているサイトを見ることがありますが、その方法を実際にお伝えしていきますね。
 
suraid8
 

『Easing Slider “Lite”』というプラグインを導入するのですが、このプラグインは操作方法も非常に簡単で、スマホで見る際にもきちんとスライド表示されるので、とても良いです。
 

それでは、まず最初に管理画面の『プラグイン』⇒『新規追加』で
『Easing Slider “Lite”』を検索してインストールします。
 suraid1
 

続いて有効化をします。
 
suraid2
 

有効化が済みましたら、ダッシュボード左下の『設定』⇒『Slideshow』がありますので、そこをクリックします。

 
suraid4
 

次に下記の画像のように、実際にスライドさせる画像の設定をしていきます。
『Add Images』をクリックします。
※Width(幅)とHeight(高さ)は大きさの設定ですが、必要に応じてサイズを設定しましょう。
 suraid3
 

次に画像を指定して行きます。記事投稿時と同様に「メディアの追加」でアップロードする画面になりますので、ここで画像の指定をしていきます。
suraid4.5
 

選択した画像をクリックします。今回は3枚スライドさせるための画像を選択してみました。
 
suraid5
 

そのうちの一枚ずつ選択してリンクの設定をしていきます。
※全ての画像にリンクをさせる場合は全ての画像にそれぞれリンク設定をいています。
 
『LINK URL』の欄に、画像をクリックした際に飛ばすURLを入れます。
※リンクさせない場合はURLを記入する必要はありません。

 
suraid6
 

完了したら『Apply Changes』をクリックして全ての画像を同じようにリンクの設定をします。

そして全て完了しましたら、『Save Slideshow』をクリックします。
 

表示させる場所を指定する。

今回はトップページのヘッダー下に表示させる場合で行って見ます。
 
「管理画面」⇒『外観』⇒『テーマ編集』⇒『メインインデックスのテンプレート』(index.php)を選択します。

そこでこちらのコードを

<?php if ( function_exists( "easingsliderlite" ) ) { easingsliderlite(); } ?>

を表示させたい部分に記述(コピー&ペースト)します。
suraid7
 

以上の設定でスライドバーの設定は終了です。

 
簡単な設定ですので、是非トライしてみてくださいね。

2 Responses to “wordpress【賢威6.1】でスライドバーを設置する方法 『Easing Slider “Lite”』”

  1. お~はっ より:

    FPヒデさん、こんばんは、お~はっと申します。
    WPはプラグインが星の数ほどあって、自由にカスタマイズできるのが魅力ですね。
    その一方で、どのプラグインを入れて、どう設定すればどうなるのか?
    プラグインの多くが英語表記だったりするので、思うように使いこなすのは難しく思います。
    FPヒデさんの今回の記事はとても参考になります。
    有益な記事をありがとうございました。
    これからの更新も楽しみにしています。
    応援ポチも忘れずにしておきますね。

    • takezousan より:

      お~はっさん こんばんは。コメントありがとうございます。またサイトをご覧いただきありがとうございます。
      本当にWPのプラグインはたくさんあって迷いますが、自分仕様にできるところがとても良いですよね。
      これからも初心者が躓くであろう、だけど必要なプラグインを中心にお伝えできるように更新していきます。
      また、是非あそびにきてくださいね。

コメントを残す

サブコンテンツ

このページの先頭へ