SWELLのテーマにて作成しているこのサイト。最初はデフォルトで使用していましたが、慣れていくうちにだんだんと「ああしたい」「こうしたい」の欲が出てきました。自分の思い描いたサイトにするにはやはり「カスタマイズ」に挑戦するしかないですね。
今回挑戦するには、スラーダーを任意の場所に設置する方法です。
SWELLのスライダーはトップページの一番上にしか設置出来ないようで、私としては、色んな所に設置したいとの思いから色々とググってみました。
SWELLを色々研究なさっているブロガーさんがたくさんいらっしゃるので、すぐに参考になるサイトをみつけました。
こちらです。
参考サイト:https://tecchan.jp/entry/200610-swiper/
(SWELLカスタマイズ】任意の場所へのスライダー(Swiper.js)の実装方法)
STEP
メディアライブラリに画像をアップしておきます
スライドしたい画像をあらかじめメディアライブラリにアップロードします。
STEP
カスタムHTMLブロックにスライダーのHTMLを書きます
カスタムHTMLブロックを使用して、スライダーのHTMLを書きます

STEP
Swiper基本設定のJavaScriptを書く
【SWELL】カスタムCSS & JSのJSの部分に、下記の通りにSwiper基本設定のJavaScriptを書きます。
(参考サイトより抜粋)

以上です
上記サイトを参考にやってみました。が・・・うまくいきません・・・
この画像がスライドしてほしいのだが・・・
暫く研究してみます。






コメント