WordPressのブロックエディタ拡張:Getwidについて解説(26)Post Carousel

タナビーの高梨です。

今回はGetwidのPost Carouselブロックに関する設定を解説していきます。

全般設定についてはこちらをご覧ください

Post Carousel概要

Post Carouselブロックとは、公式ページからの引用では、

投稿、ページ、カスタム投稿タイプを簡単に表示することができるカスタムレイアウトのカルーセル

公式ページ(翻訳 by DeepL先生)

だそうです。

投稿一覧をカルーセル表示できるっぽいですが、どういった設定があるのでしょうか。

さっそく、見ていきましょう!

ブロック設定

Content Settings

Choose What to Display:一覧を表示する対象の種別を選択します。「投稿」「固定ページ」「ナビゲーションメニューの項目」など、現在のデータ状況から自動で選択肢が決まってきます。

Number of Items:表示させる記事の個数を設定します。-1を設定すると、全ての記事が表示対象となります。

Number of Posts to Pass Over:本来表示されるべき記事のうち、先頭から設定した数だけ表示しなくなります。例えば、「3」を設定すると、本来ならば4番目に表示される記事から表示が始まります。

Order:表示の順番を「Z→A, 9→1(降順)」または「A→Z, 1→9(昇順)」から選択します。

Order by:表示順の種別を「Title(タイトル名)」「Date(作成日)」「Random(ランダム)」「Author(作者)」「Last Modified Date(最終変更日)」「Menu Order(記事属性に割り付けられたオーダー順)」から選択します。

Ignore sticky Posts:チェックをオンにすると、先頭固定表示を無効にします。

Display Only the Specific Post:特定の記事だけを表示できます。記事IDを「,」区切りで設定します。

Display all posts but NOT the specified ones:表示したくない記事を設定できます。記事IDを「,」区切りで設定します。

Exclude Current Post:自分自身の記事を表示対象外にします。

Taxonomies:表示対象をタクソノミーでふるいにかける場合のタクソノミーを選択します。「カテゴリー」「タグ」「フォーマット」から選択します。

Terms:Taxonomiesで選んだ内容に応じて、項目が表示されます。Windowsの場合、Ctrlを押しながら選択することで複数選択できます。Shiftを押しながら選択すると、範囲指定で選択できます。

Terms Relation:Termsで選んだ項目の考え方。「Item should have all of selected terms(選択したもの全てを含む記事を対象とする、いわゆるANDの考え方)」「Item should have at least one of selected terms(選択したものが1つでも含まれる記事を対象とする(いわゆるORの考え方)」から選択します。

Display Settings

Post Template:表示するテンプレートを選択します。

Slides on Desktop:PCの場合に一画面に表示される記事数を設定します。

Slides on Laptop:Laptopの場合に一画面に表示される記事数を設定します。

Slides on Tablet:Tabletの場合に一画面に表示される記事数を設定します。

Slides on Mobile:モバイルの場合に一画面に表示される記事数を設定します。

Slides to Scroll:スクロールした際に何記事ずつ画面送りするかを設定します。

Enable Slideshow:オンにすると、自動でスライドします。

Slide Show Speed:Enable Slideshowをオンにすると設定できるようになります。スライドされるまでの間隔をミリ秒単位で設定します。

Infinite:オンにすると、端まで行ったときにまた先頭に戻ります。オフにすると、それ以上先に進めなくなります。

Animation Speed:スライドの動作にかかる時間をミリ秒で設定します。数値を大きくすると、ゆっくりスライドすることになります。

Center Mode:オンにすると、端の記事が見切れた表示になります。

Spacing:記事の表示間隔を「None(ピッタリひっつく)」「Small」「Medium」「Large」「Huge」から選択します。

Arrows:前後への矢印の表示位置を設定します。「Outside(一覧の外側左右)」「Inside(一覧の内側左右に重ねる)」「None(表示しない)」から設定します。

Dots:画面送りの点点の表示位置を「Outside(一覧の外側下)」「Inside(一覧の内側下)」「None(表示しない)」から設定します。

まとめ

設定個所は以上です。

投稿一覧を簡単にカルーセル表示できるのは良いですね。

お勧め記事などを画面トップに持ってくるなど、工夫次第で効果的な見せ方ができそうです。

積極的に使うと良いと思います。