WordPress

【WordPress】ウェブサイトにスライダーを追加するWP Header image slider and carousel

October 30, 2018

WP Header image slider and carousel
WP Header image slider and carouselは、ウェブサイトにキャプションを含むヘッダー画像スライダーを追加するためのプラグイン。レスポンシブ対応、タッチ/スワイプサポート、ブラウザサポート:Firefox、Chrome、Safari、iOS、Android、IE7+

WP Header image slider and carouselプラグインを導入

ダッシュボード >> プラグイン >> 新規追加 >> WP Header image slider and carouselを検索
有効化にするとHeader Image Sliderが追加されます。

Header Image Slider

WP Header image slider and carousel
アイキャッチ画像でスライダー用の画像を選択します。

ショートコード

表示させたいスタイルのショートコードをコピペします。

  1. [sp_imageslider] – キャプション付き/キャプションなしの画像スライドショー
  2. [sp_imagecarousel] – 画像カルーセル
  3. [sp_imagethumbnail_pager] – サムネイルページャー

WP Header image slider and carousel

キャプション付き/キャプションなしの画像スライドショー

WP Header image slider and carousel
画像カルーセル

WP Header image slider and carousel
サムネイルページャー

パラメーター

使用できるパラメーター。

  1. Limit [sp_imageslider limit="10"] [sp_imagethumbnail_pager limit="10"]
  2. Effect [sp_imageslider effect="fade"] [sp_imagethumbnail_pager effect="fade"]
  3. Captions [sp_imageslider captions="true"] [sp_imagethumbnail_pager captions="true"]
  4. Autoplay [sp_imageslider autoplay="true" ] [sp_imagethumbnail_pager autoplay="true" ]
  5. Autoplay Interval [sp_imageslider autoplay_interval="3000" ] [sp_imagethumbnail_pager autoplay_interval="3000" ]
  6. Speed [sp_imageslider speed="2000"] [sp_imagethumbnail_pager speed="2000"]
  7. Auto Controls [sp_imageslider auto_controls="true" ] [sp_imagethumbnail_pager auto_controls="true" ]
  8. Infinite [sp_imageslider loop="true"] [sp_imagethumbnail_pager loop="true"]
  9. Start Slide [sp_imageslider start_slide="1"] [sp_imagethumbnail_pager start_slide="1"]
  10. Random Start [sp_imageslider random_start="true"] [sp_imagethumbnail_pager random_start="true"]
  11. Dots [sp_imageslider "true"]

画像:フリー写真素材ぱくたそ