Facebookの投稿からスライドショー、スライダー、カルーセルを作成する

カスタムFacebookフィード・ワードプレス・プラグインのProバージョンを使用している場合、私たちの カルーセル拡張機能を使うと、Facebookのコンテンツからスライドするカルーセルを作成できます。

無料のWordPressプラグイン、またはPHPスタンドアロン版を使用している場合は、以下の方法で基本的なスライドショーを実現できます:

----

1)スライドショーに変換したいフィードのショートコードにクラスを追加する:

Comments Box SVG iconsUsed for the like, share, comment, and reaction icons
Load more

2)表示する投稿の数を、スライドショーに含めたい投稿の数に設定する(例えば10)。これは、'num' ショートコードオプションを使うことで可能です:

Comments Box SVG iconsUsed for the like, share, comment, and reaction icons
Load more

3) 以下のJavaScriptをサイトに 追加する。これはカスタムJavaScriptプラグインを使用して手動で行うことができます。詳しくはドキュメント こちら.上記のショートコードのclassオプションを "slideshow "以外に変更する場合は、以下のスニペットの1行目を変更してください

var shortcodeClass = 'slideshow',
    cffSpeed = 5000, 
    $cff = $('#cff.'+ shortcodeClass);
    $cffItem = $cff.find('.cff-item'),
    cffNum = $cffItem.length,
    cffCur = 0;
$cffItem.hide();
setTimeout(function(){ $cff.find('.cff-item').eq(0).show(); }, 200);
setInterval(function(){
    $cff.find('.cff-item').eq(cffCur).fadeOut( "fast", function() {
        if( cffCur == cffNum-1 ) cffCur = -1;
        cffCur++;
        $cff.find('.cff-item').eq(cffCur).fadeIn();
    });
}, cffSpeed);

4)スニペット上部のcffSpeed = 5000を編集することで、トランジションのスピードを変更できます。5000は5秒(5000ms)に相当します。

サポート

ドキュメントに答えが見つからない?

サポート

この記事は役に立ちましたか?