XO Liteslider プラグイン

概要

XO Liteslider プラグインは、レスポンシブ対応のコンテンツ スライダーです。

主な機能

  • 画面表示時(スクリプト実行時)にチラつかない
  • レスポンシブ対応
  • コンテンツ対応
  • スライドショー
  • アニメーション効果はスライド、フェード、スライド&フェードの3種類

インストール

  1. WordPress 管理画面->[プラグイン]->[新規追加] メニューより、[プラグインを追加] ページを開きます。
  2. 検索ボックスに、”XO Liteslider” と入力し検索します。
  3. XO Liteslider が見つかったら、[今すぐインストール] をクリックします。
  4. インストールが完了したら”プラグインを有効化”をクリックします。

スクリーンショット

サンプル イメージ

screenshot-1

スライド管理画面

screenshot-2

スライド ウィジェット

xo-liteslider_screenshot-3

説明

プラグインを有効にすると、管理画面に [スライダー] メニューが追加されます。 [スライダー] メニューをクリックするとスライダー一覧ページが表示されます。このページで複数のスライダーを管理することができます。 xo-liteslider-sliders まずは、スライダーを追加します。追加するには、[新規作成] をクリックします。 スライダー編集ページが表示されます。このページでスライダーを設定します。 xo-liteslider-edit-slider タイトルにスライダーの名前(「トップページ用スライダー」等)を設定します。 スライド ボックスにスライドを設定していきます。スライドを追加するには、ヘッダーの [+] をクリックします。スライドを削除するには、ヘッダーの [×] をクリックします。スライドの順番を入れ替えるにはヘッダーをドラック&ドロップして移動させます。 スライドの項目は下記のとおりです。

スライド項目

項目 説明
画像

スライドの画像です。

画像が設定されていないスライドは表示されません。

タイトル 画像のタイトルです。
リンク(URL)

スライドをクリックされたときのリンクです。

省略可能です。

コンテンツ(HTML)

画像にオーバーラップされて表示されます。

省略可能です。

パラメーター ボックスでスライドのパラメーターを設定をします。パラメーターの項目は下記のとおりです。

パラメーター項目

項目 説明
 幅、高さ

スライド(画像)のサイズ(幅、高さ) です。

省略可能です。実際の画像より小さく表示したい場合等に設定します。

効果

アニメーションの効果です。

“slide” または “fade” の2種類から選択できます。

ナビゲーション ナビゲーションを表示する場合はチェックします。
ページネーション ページネーションを表示する場合はチェックします。
スライドショー 自動でスライドをする場合はチェックします。
間隔

スライドショーの間隔です。

ミリ秒単位で指定します。

効果速度

アニメーション効果の速度です。

ミリ秒単位で指定します。

コンテンツ コンテンツを表示する場合はチェックします。
表示順

スライドの順番を指定します。

”昇順”、”降順” または ”ランダム” の3種類から選択します。

設定が完了したら [公開] ボタンをクリックします。 あとは、画面上部(または使い方 ボックス) に表示されている、ショートコードをコピーして、投稿または固定ページに貼り付けてください。 このプラグインで使用しているスライダー スクリプトの説明はこちらをどうぞ。

更新履歴

v1.3.0

  • 新しいアニメーション効果(SlideFade)を追加

v1.2.0

  • スライド編集ページの UI を更新

v1.1.0

  • タッチスワイプに対応

v1.0.0

  • 最初のリリース