ショートコード

「投稿の表示」ショートコード

「投稿の表示」ショートコードを使用すると、ブログ投稿のリストを別のページに追加できます。「引数」を使用すると、特定の投稿をそのカテゴリーまたはタグに基づいて表示できます。

ショートコードは WordPress 用に設計されたコードの小さなスニペットで、これを使用するとサイトやブログにさまざまな機能を追加できます。ショートコードについての詳細は、こちらにあります

目次

「投稿の表示」ショートコードの概要
ショートコードの追加
表示の引数
カスタム化の例
画像配置
(高度) 複合タクソノミークエリ
制限事項

[display-posts] ショートコードは、プラグインを使用する WordPress.com ビジネス、またはこれより上位のプランのサイトでは機能しません。さまざまなプラグインが同様の機能を提供しています。

ショートコードを追加してから「ビジネス」またはその上位プランにアップグレードした場合、そのコードは維持されます。「投稿の表示ショートコード」プラグインをインストールすると、コードはコンテンツを再びレンダリングします。


「投稿の表示」ショートコードの概要

「投稿の表示」ショートコードを使用する理由は多数あります。

  • 自分のホームページの投稿の短いリストを表示する必要があり、おすすめ投稿オプションは自分のテーマの一部でないか、投稿が希望する方法で表示されていない。
  • 投稿者のページを作成して、投稿者の自己紹介、およびサイトで公開した最新の投稿の一部を表示する必要がある。
  • ページで、お知らせなど特定の投稿を強調表示する必要がある。
  • 投稿の特定のリストをサイドバーまたはフッターのウィジェットに追加する必要がある。
  • その他のさまざまな理由。

↑ 目次 ↑

ショートコードの追加

ページ投稿テキストウィジェットの編集についてご説明します。次のコードを追加してエディターに表示されるのは、コードのプレースホルダーのみです。ただし、ページを公開すると、ショートコードが適用された結果がわかります。

  1. ページ、投稿、またはテキストウィジェットを編集します。
  2. 投稿またはページにショートコード [display-posts] を追加します。
  3. ページまたは投稿を公開またはアップデートします。

WordPress ブロックエディターを使用している場合、ショートコードブロックを追加して「投稿の表示」ショートコードを追加することもできます。

新しい投稿と既存の投稿への更新は、ショートコードの位置にかかわらず、反映されるまでに最長1時間を要します。

「投稿の表示」ショートコードライブ
「投稿の表示」ショートコードは、「Twenty Seventeen」テーマを使用したライブページにこのように表示されます。

「投稿の表示」ショートコードは、デフォルトで、10件の最新投稿を箇条書きでリスト表示します。投稿の数やスタイルおよびリストに表示される投稿の要素の種類 (タイトル、アイキャッチ画像、抜粋など) をカスタマイズできます。


↑ 目次 ↑

表示の引数

引数を使用して投稿の表示方法をカスタマイズできます。「投稿の表示」ショートコードに追加できる一般的な引数と、その追加した引数でのショートコードの表示例のリストを、以下に示します。

author
投稿の作成者を特定します。
デフォルト :空白
例 :[display-posts author="bill"]

category
カテゴリースラッグ (またはカテゴリースラッグのカンマ区切りリスト) を指定します。このショートコードはこちらの実例サイトでどのように反映されるかを確認できます。
デフォルト :空白
例 :[display-posts category="fishing,hiking"]

date_format
include_date が true に設定されている場合に使用する日付形式を指定します。詳細については、Codex の「Formatting Date and Time」をご覧ください。
デフォルト :'(n/j/Y)’
例 :[display-posts include_date="true" date_format="F j, Y"]

id
表示する特定の投稿 ID (または複数の投稿 ID) を指定します。
デフォルト :空白
例 :[display-posts id="9, 10"]

image_size
アイキャッチ画像を表示するサイズを指定します (投稿でアイキャッチ画像を使用している場合)。image_size は、サムネイル、中サイズ、大サイズ (いずれも「設定 > メディア」で管理) に設定できます。
デフォルト :空白
例 :[display-posts image_size="thumbnail"]

Content Options をサポートするテーマを使用していて、ページ上でアイキャッチ画像を表示しないように設定している場合、image_size 引数もそのサイトのページで使用されるショートコードには影響しません。つまり、アイキャッチ画像は、ショートコードが表示するよう指示していてもショートコードを介して追加された投稿には表示されません。

include_content
タイトルの後に投稿内容のすべてを含めます。
デフォルト :空白
例 :[display-posts include_content="true"]

include_date
投稿タイトルの後に投稿の日付を含めます。デフォルトの形式は (7/30/12) ですが、’date_format’ 変数を使用して形式をカスタマイズすることもできます。
デフォルト :空白
例 [display-posts include_date="true"]

include_excerpt
投稿タイトルの後に投稿の抜粋を含めます (日付が指定されている場合は日付も含めます)。
デフォルト :空白
例 :[display-posts include_excerpt="true"]

offset
除外する投稿の数
デフォルト :0
例 :[display-posts offset="3"]

order
投稿を降順 (DESC) または昇順 (ASC) のどちらでリストするかを指定します。
デフォルト :DESC
例 :[display-posts order="ASC"]

orderby
投稿の順序付けの基準を指定します。使用可能な変数については、こちらをクリックしてください。
デフォルト :日付
例 :[display-posts orderby="title"]

portfolio_type
投稿タイプとしてポートフォリオを使用している場合は、この変数を使用して特定のポートフォリオタイプから項目を取得します。

post_parent
特定のページの子ページを表示します。ID または ‘current’ のいずれかを指定できます。 ‘current’ を指定した場合は、現在のページの子が表示されます。
デフォルト :空白
例 :[display-posts post_type="page" post_parent="8"]

post_status
特定の投稿ステータスに関連付けられた投稿を表示します。
デフォルト :公開
例 :[display-posts post_status="publish, future"]

post_type
使用する投稿タイプを指定します。デフォルトの投稿タイプ (投稿またはページ) を使用できます。ポートフォリオの場合は、「jetpack-portfolio」を使用します。 同様に、推薦文の場合は「jetpack-testimonial」を使用します。
デフォルト :投稿
例 :[display-posts post_type="page"]

posts_per_page
表示する投稿の数を指定します。
デフォルト :10
例 :[display-posts posts_per_page="5"]

tag
タグスラッグ (またはタグスラッグのカンマ区切りリスト) を指定します。
デフォルト :空白
例 :[display-posts tag="tag1, tag2"]

taxonomy、tax_term、tax_operator
これらのパラメーターを使用すると高度なタクソノミーのクエリを行うことができます。クエリ対象のタクソノミーを指定するには「taxonomy」を使用します。検索キーワードスラッグ (または検索キーワード) を含めるには「tax_term」を使用し、それらの検索キーワードをどのようにクエリで使用するかを変更するには、「operator」を使用します (このフィールドが必要になる可能性はほとんどありません)。
デフォルト :’taxonomy’ = 空、’tax_term’ = 空、’tax_operator’ = ‘IN’
例 :[display-posts taxonomy="color" tax_term="blue, green"]

wrapper
リストを表示するために使用する HTML のタイプを指定します。番号なしリスト (ul) 、番号つきリスト (ol)、または DIV (div) を指定できます。 div を指定した場合は自分でスタイルを設定できます。
デフォルト :ul
例 :[display-posts wrapper="ol"]


↑ 目次 ↑

カスタム化の例

ショートコードを複数の引数と組み合わせて投稿の特定のリストを表示する例をいくつか示します。

[display-posts tag="advanced" posts_per_page="20"]

この例では、「advanced」タグが付いた直近の20件の投稿がリストされます。

[display-posts tag="advanced" image_size="thumbnail"]

この例では、「advanced」タグが付いた直近の10件の投稿がリストされ、投稿の画像が「サムネイル」サイズで表示されます。

[display-posts category="must-read" posts_per_page="-1" include_date="true" order="ASC" orderby="title"]

この例では、「必読」カテゴリーに属するすべての投稿がアルファベット順でリストされ、投稿名の末尾に日付が付加されます。

[display-posts wrapper="ol"]

この例では、すべての投稿が番号つきリストとして表示されます。オプションとして、番号なしリストを指定する ul (デフォルト)、番号つきリストを指定する ol、または DIV を指定する div のいずれかを指定できます。

[display-posts id="14,3"]

この例では、ID が14および3の投稿だけが表示されます。


↑ 目次 ↑

画像の位置

一般的なリクエストのうちの1つとして、タイトル、抜粋、サムネイルを右揃えにして投稿のリストを表示する場合があります。その場合は、以下のようなショートコードを使用します。

[display-posts include_excerpt="true" image_size="thumbnail" wrapper="div"]

上記のショートコードは、投稿の抜粋を含めて、「サムネイル」サイズの画像を追加し (画像サイズは「管理」→「設定」→「メディア」でカスタマイズできます)、箇条書きの黒丸なしでリストを表示するように指示しています。

画像が右側に表示されるようにするには、以下のショートコードをカスタム CSS ファイルに追加します (この場合、WordPress.com プレミアムまたは WordPress.com ビジネスへのアップグレードが必要になります)。

.display-posts-listing .alignleft {
    float:right;
    margin:0 0 5px 5px;
}


↑ 目次 ↑

(高度) 複合タクソノミークエリ

ほとんどの場合は単一のタクソノミークエリだけで必要を満たせますが、このショートコードは複数のタクソノミーを使用したクエリをサポートします。数に制限はありません。たとえば、「おすすめ」カテゴリーに属し、かつ、「ホームページ」タグが付いているすべての投稿を取得する必要があるとします。その場合、以下のようなショートコードを使用します。

[display-posts taxonomy="category" tax_term="featured" taxonomy_2="post_tag" tax_2_term="homepage"]

カウントを2で始めることで、このようにして、いくつでもタクソノミーをつなげていくことができます。以下にリストするフィールドでは、(count) を実数で置き換えてください。

使用可能なフィールドは次のとおりです。

taxonomy_(count)
クエリ対象のタクソノミー
デフォルト :空

tax_(count)_term
含めるべき検索キーワード (複数の場合は、カンマで区切ります)
デフォルト :空

tax_(count)_operator
検索キーワードをクエリする方法 (IN、NOT IN、またはAND)
デフォルト :IN

tax_relation
複数のタクソノミークエリ間の関係を指定します (結果がすべてのクエリと一致することを条件とするか、いずれかのクエリと一致するだけでよいか)。使用可能なオプションは以下のとおりです。AND および OR
デフォルト :AND


↑ 目次 ↑

制限事項

「投稿の表示」ショートコードで表示できる投稿の数は100に制限されています。