トップページにもメンバーズリストを表示させるため、通常のloop以外に、カスタム投稿用のloopを追加します。
カルーセルを実装してレイアウトしてみます。
という訳で、カルーセルの中でも特に評判のいい「slick」を使用してみます。
slickは以下からダウロードしてください。
https://github.com/kenwheeler/slick/
slickの説明は
http://kenwheeler.github.io/slick/（英語）
slickの設定をheader.phpに追記
jQuery('.responsive').slick({
dots: true,
infinite: false,
speed: 300,
slidesToShow: 5,
slidesToScroll: 5,
responsive: [
{
breakpoint: 600,
settings: {
slidesToShow: 3,
slidesToScroll: 3
}
},
{
breakpoint: 480,
settings: {
slidesToShow: 2,
slidesToScroll: 2
}
}
// You can unslick at a given breakpoint now by adding:
// settings: "unslick"
// instead of a settings object
]
});
breakpointは600と480でセットし、それぞれ写真を3枚、2枚を表示させるようにしました。
ここらへんの数値はお好みで