Webの記録

WordPressプラグイン「Easing Slider」でスライドショー簡単設置

投稿日:

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

WordPressでカッコいいスライドショーを簡単に実現出来るプラグイン「Easing Slider」があったので、メモしておきます。

有料版もあるようですが、無料版で十分キレイなスライドショーが出来たので、私は無料版のみ試してみました。

本当に設置が簡単でした。固定ページや投稿する記事に設置するのなら、特別HTML、CSS、PHPの知識がなくても出来ると思います。

※Sample表示は、以前はこのブログ内に設置していましたが、ファイル整理して現在は置いてないので「公式サイト」でご確認ください。

特徴

  • とにかく簡単!
  • 設定を選ぶ事で見せ方を変えられる(ただし英語表記。いろいろ試してみると良いかも)
  • 有料版と無料版がある。(有料版は機能が良いようですが、今回試してないです)
  • IETesterで見るとIE6も表示可能(状態によっては表示を保障出来ませんが・・・)

設置方法

先にスライドする画像を用意しておきます。

ダウンロード

プラグインをダウンロードして、有効化します。

設定

スライドさせる画像を設定します。

ダッシュボードのメニューに「Easing Slider」が表示されているので、これを開いて「Custom Images」のタブを開きます(最初に開いています)
ここで、スライドさせる画像のパスを入れるか、アップロードをします。(私はパスを入れて試してみました)
保存する時は「Save Changes」をクリックです。

「Slider Settings」のタブで、スライダー自体の設定をします。
結構項目があるので、いろいろ試してみるのも面白いです。

「Usage Settings」の設定項目。
私はあんまりココはいじっていません。

設置

スライダーを取り付けたい固定ページか投稿記事では以下のようにショートコードを記述

[easingslider]

テンプレートファイルのphpの場合(index.php、home.phpなど)は以下のように記述

<?php if (function_exists('easing_slider')){ easing_slider(); }; ?>

これで設置完了です!設置がほんの1行という、簡単さ♪
「Easing Slider」プラグインって便利です!!

-Webの記録
-, ,

執筆者:


  1. ナオヤ より:

    はじめまして☆
    Easing Sliderの紹介ありがとうございます。

    早速設定してみたのですが、表示されないです・・・
    サイトを確認すると、クルクルとずっと読み込んでおり、画像が出てこないです。

    設定画面では、ちゃんと画像は出ております。

    何か情報ありますでしょうか?
    よろしくお願い致します。

    • Motoshige より:

      ナオヤさん、はじめまして。
      コメントありがとうございます!

      状態を直接見る事が出来ないので、違うかもしれないんですが・・・。

      設定画面で画像が出てくるというのは、「Custom Images」で設定した画像のパスは合っているという事ですね。

      ・・・であれば、「Usage Settings」のタブの中で上から4番目の「Get Images From?」を「Custom Images」になっているか確認してみてください。
      もしかしたら「Custom Fields」などになっているかもしれません。

      これだったら画像が表示されなくてくるくる読み込みをしている状態になるかもしれません。

      他の原因は、今のところ見つけられてないので・・・とりあえず上記の分で確認してみてください。

      これで解決するといいですね~♪

  2. xxppxx より:

    このような記事を書いた場合、実際に動作するかを確認できるsample
    をクリック表示すべきでは?

    • Motoshige より:

      xxppxxさま

      はじめまして。コメントありがとうございます!
      ご指摘、ごもっともです。

      以前は、このブログのトップにサンプルを置いてました。
      しかし、このブログは私にとって実験ブログなのでいろいろファイルをいじってしまい、現在はサンプルを置いていません。
      サンプル表示を止めた時にこの記事を書き直すべきだったのですが、すっかり忘れていました。申し訳ございません。(本日、書き加えました)

      ひとまず、動作は公式サイトでご確認いただけると助かります!
      http://easingslider.com/

comment

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

This blog is kept spam free by WP-SpamFree.

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

関連記事

no image

苦手なJavaScriptをイチから勉強してみる【基本準備編】

この記事は約 1 分で読めます。今更なんですが、実はJavaScriptはちょっと苦手です。。。 jQueryのライブラリーを使って、部分的にいじる事はあっても・・・何となく「JavaScript」っ …

no image

lang属性に指定できる言語コード

この記事は約 1 分で読めます。 忘れた頃に海外向けの小規模な案件で、外国語のページ制作のお話があったりします。 そんな時に「lang属性に指定できる言語コード」を毎回調べるのが面倒なので、自分用のメ …

no image

初心者のアクセス解析勉強メモ【用語と計算式】

この記事は約 1 分で読めます。 Webサイトを制作し、運営していく中でアクセス解析は重要だと思っています。そのWebサイトを育て、サイト目的を達成させ、信の目的(事業)の達成をする為にも、とても興味 …

no image

MacでもWindowsでもOKな「AMPPS」でローカル環境を作ってみる

この記事は約 1 分で読めます。 以前、ローカル環境では「XAMMP」と「MAMP」の環境を作ってみました。 今回は、MacでもWindowsでも使える「AMPPS」でローカル環境を作ってみました。 …

no image

Creative Cloud デスクトップアプリケーションが「サインアウトしています」と表示し、サインインできないとき

この記事は約 1 分で読めます。 時々、Adobeのソフトは使える状態なのに、Creative Cloudにデスクトップアプリケーションにサインインできないことがあります。 私の場合は、「サインアウト …