MENU

【簡単】cocoonで人気記事のスライドショーを実行する方法

2020 2/25
【簡単】cocoonで人気記事のスライドショーを実行する方法
クラール
クラール

下にあるのがサイトのホーム画面になります。

中心に人気記事のサムネイル画像(赤枠)のスライドショーを展開していますが、今回はこのやり方を解説します。

目次

テーマはcocoonを使用

WordPressを使う時に、テーマはかなり重要です。

ボクは、cocoonを使用しているのですが、無料のテーマの割に有料級のエディットが簡単に出来るので、初心者から上級者まで幅広く愛用出来ると思います。

更にこのテーマは無料です。

Cocoon

cocoon設定を開く

カルーセルを選択

設定をしていく

カルーセル表示

ボクと同様の位置に表示するのであれば、【投稿・固定ページ以外で表示】を選んで下さい。

スマートフォンで表示のチェック欄は必ずチェックを入れましょう。自動的にサイズを最適化して表示されます。

他にも、以下の表示方法があります。

カルーセル設定

「全ページで表示」        「フロントページのみで表示」

「投稿・固定ページのみで表示」  「投稿ページのみで表示」

「固定ページのみで表示」

表示内容

こちらは、人気記事をスライドしたいのであれば、一番上にある人気記事にチェックを!表示したい期間も設定が出来ますが、全期間にします。

更に、カテゴリーからも選べるので、表示したいカテゴリーだけ表示する事も出来ます。

カルーセルの並び替え

ボクは投稿日(降順)に設定しましたが、他にも以下の項目が選べます。

カルーセル並び替え

「ランダム」        「更新日 (降順) 」

最大表示数

デフォルトで18、最小で12で設定出来ます。

ボクの場合は、より読まれている記事だけを表示したかったので、最小の12を選びました。最大は120まで設定出来ます。

枠線の表示

サムネイルの間際を枠線で区切る事が出来ます。

背景色など、いろんなバリエーションで、あった方が分かり易いor分かりにくいがあるので一概にどちらともいえませんが、ボクはチェックを入れています。

オートプレイ

最大表示数で設定した数のサムネイルをスライドショーで交互に自動で表示させていく際にチェックを入れます。

オートプレイインターバル

自動的にスライドした後、次の動作までの時間を設定出来ます。

デフォルトで5秒でしたが、ボクは直ぐにスライドが変わるのが煩わしく見えるので10秒~15秒くらいで設定しています。

最後に変更をまとめて保存を行って終了。

サイトを表示で実際に確認

非常にシンプルに設定が出来るので、とても便利なcocoonの設定です。

この記事を書いた人

klar(クラール)はドイツ語で快晴、北欧諸国でも準備が出来たなどの意味を持つそうです。そんなブログを書けれる様、全力投球☀アラフォーリーマンで妻と幼稚園にいく子供の3人家族。ブログ始めて4カ月で5桁達成!➤6桁目指し中☀手付かずだったTwitterも今月より本気で取り組み中☀『1人でも多くの人に元気と自信を』☀

コメント

コメントする

12 + eleven =

目次
閉じる