Wordpressで投稿記事の並び替えをする方法について

Wordpressの投稿記事や固定ページの表示順を並べ替える場合、日付や順序を使います。

プラグインで並べ替える場合は、ドラッグ&ドロップで順番を変更できる「Intuitive Custom Post Order」プラグインがおすすめです。

手動で並べ替える時は、並び順のキー（order）と昇順降順（ASC・DESC）を入れます。カスタムフィールド名で並べ替える時は、orderbyに「meta_value」orderに「カスタムフィールド名」を入れましょう。

投稿記事の順番を並べ替える

Wordpressの記事やコンテンツは、基本的には「日付順」に並ぶ仕様になっています。

普通に投稿記事を入れていけば、通常は「日付の新しい順番」に並ぶ訳です。

並び順

日付が違う場合の、記事の並び方を紹介しましょう。

記事の日付が違う場合

上記の様に日付が新しいものが上に並ぶようになりますね。

では同じ日付の記事の場合を紹介しましょう。

同じ日付の場合

同じ日付であっても後から投稿した記事の方が「投稿時間が後」になります。

ですので後からの記事の方が上に来ます。

この様に日付と時間で、投稿記事はある程度自由に並べ替える事ができる訳です。

固定ページの順番を並べ替える

固定ページは投稿ページと違い、作成した日付の概念が含まれません。

固定ページの管理画面上の並びは「タイトルの昇順」になります。

「順序」の要素に番号を入れる

固定ページには、編集画面の右欄「ページ属性」のところに「順序」という項目があります。

新エディタ右欄のページ属性欄

ここに番号を入れる事で、管理画面上もその順に表示される様になっています。

順序を入れた並び順

※本来はこの数値の入れ方はよくありません。これは後述します。

クイック編集からも変更できる

固定ページのページ数が多いと、全ての固定ページの編集画面を1枚ずつ開いてこの「順序」の欄を入れるのは大変です。

「順序」は「固定ページ一覧」の「クイック編集」欄に表示されるので、ここで迅速に順番を変更する事ができます。

固定ページ一覧の画面から編集が可能という事ですね。

割り込みについて

割り込み時に一番重要になるのは、ページの「割り込み」です。

後から作った記事やページが、従来の並びの間に割り込むケースがたくさん出てきます。

投稿記事の場合

投稿記事の「割り込み」の場合、記事と記事の間に入る「日付時刻」を設定します。

A記事の時刻とB記事の時刻の「間の時刻」をC記事に設定するだけです。

秒単位で設定できるので、並べ直せない事は無いと思います。

固定ページの場合

固定ページに「割り込み」が出てくる場合、「順序」の数値を調整する事になります。

もし順序を先程の様に1、2、3と設定していた場合、ここに「1.5」とか「2.3」の様な小数点設定をする事はできません。

数字を連続させていると、いざ割り込みさせる際に間に入れる事ができなくなります。

となれば、全ての固定ページの順番を変更し直す必要が出てくる訳ですね。

順序には「飛ばし番号」を入れる

ですので「順序」は、最初から10、20、30などある程度間隔を飛ばして設定するのがセオリーです。

これなら割り込みページが出てきても、その間の数字を入れる事で対応できますね。

他の固定ページの順序を変更する必要がなくなります。

用語集などの特殊なコンテンツ

例えば用語集などのコンテンツの場合、基本は「あいうえお順」並びです。

投稿の日付が全く意味をなさないコンテンツですよね。

常に割り込みが発生する

例えば１・２・３・４・５の順番で用語集の記事を5つ投稿していたとしても、２と３の間や１の前など、随時割り込みがされていきます。

これらが頻繁に発生するなれば、常に並べ替えをするのは面倒な作業です。

Intuitive Custom Post Orderプラグイン

そのために便利なプラグインがあります。

「Intuitive Custom Post Order」は、ドラッグ&ドロップで管理画面上の投稿の並び替えができるプラグインです。

導入も簡単ですし、もちろん無料です。

プラグインのインストール

まずはWordpressの管理画面で、「プラグイン」メニューから「新規追加」をクリックします。

プラグインの追加画面で「Intuitive Custom Post Order」で検索しましょう。

プラグインが表示されたら、今すぐインストールをして「有効化」します。
これでプラグインが使える様になりました。

プラグイン設定

ではWordpess管理画面メニューから「設定」→「並び替え設定」へと進みます。

この画面でチェックをつけた項目が、管理画面上から自由に並べ替えできるようになる訳ですね。

並び替え設定の主なジャンルは2つです。

対象のジャンル

カスタム投稿タイプにチェックをつけると、通常の投稿記事はもちろんカスタム投稿として作った記事も自由に並べ替えできます。

カスタムタクソノミーにチェックをつけると、記事や固定ページに付属している「カテゴリやタグ」を並べ替えできます。

チェックは複数付ける事ができます。チェックをつけたら保存ボタンを押しましょう。

並べ替え操作

では実際に並びを変更してみます。

上記でチェックをつけた（画像は投稿一覧）の投稿をマウスでドラッグして移動させることができる様になります。

任意の順番位置にドロップさせれば、実際のページ上の記事の並びもその様に変わります。

ドラッグ&ドロップを行った時点で、自動的に並び順は更新される様になっています。

手動で並べ替えの命令を設定する

Wordpressの設定やプラグインに頼らず記事や固定ページを並べ替える場合は、各テーマファイルに直接並べ替えの命令を入れます。

並べ替えの際に使われるのが、「order」と「orderby」です。

いくつか例をご紹介しましょう。

投稿記事を古い順に並び変える

通常の投稿記事は日付の新しい順に並びますよね。

これを逆に「古い順」で並び替えるには、以下のコードをテーマファイルのfunction.phpに入れましょう。

functions.php内記述例

function change_asc( $query ) { $query->set('order', 'ASC'); $query->set('orderby', 'date' ); } add_action( 'pre_get_posts', 'change_asc' );

ASCとする事で、通常とは逆の日付の古い順に並ぶようになります。

カスタム投稿を並び替える

次はカスタム投稿タイプの記事を並べ替える命令です。

コード例（カスタム投稿の日付の昇順で並び変える場合）

$args = array( 'post_type' => 'news', 'order' => 'ASC', 'orderby' => 'date', ); $custom_query = new WP_Query( $args );

並び順を変更するには「order」に昇順か降順を入れ、「orderby」に並び順のキーとなるフィールド名を入れます。

カスタムフィールドの値で並び変える場合

これまでは「日付」など、標準で用意されていた項目をキーとした並べ替えでした。

それ以外に自分で作った「カスタムフィールド」の値を並べ替えのキーとする事もできます。

用語集専用のカスタムフィールド

例えば用語集ページに、専用のカスタムフィールド「yougo-order」を設定しているとしましょう。

こうする事で日付などの影響を全く受けず、yougo-orderの順番に並べる事ができます。

カスタムフィールド名yougo-orderをキーにする場合

下がカスタムフィールドの値で並び替えしている例です。

$term_object = get_queried_object(); // タームオブジェクトを取得 $term_slug = $term_object->slug; // タームスラッグ $args = array( 'post_type' => 'yougo', 'taxonomy' => 'yougo-cat', 'term' => $term_slug, 'orderby' => 'meta_value', //①カスタムフィールドを並び順のキーにする 'meta_key' => 'yougo-order', //②対象とするカスタムフィールド名 'order' => 'ASC' //③昇順 ); $custom_query = new WP_Query( $args );

カスタムフィールドのキーが「yougo-order」で、その値に基づいて「昇順」に並び替えています。

並べ替えには、上記①②③の3つが必要です。

meta_value（meta_value_num）とmeta_key

ここで非常に重要な点をご紹介しましょう。

カスタムフィールドの値で並び替えする場合、「orderby」に直接「yougo-order」を設定しても並びは変えられません。

orderbyに「meta_value」、meta_keyに「カスタムフィールド名」

代わりにmeta_valueとmeta_keyとを組み合わせて使います。

orderbyに「meta_value」と入れ、meta_keyに「カスタムフィールド名」を入力するのです。

設定ルール

以上のようにする事で、カスタムフィールドの値で並べ替えができる様になります。

常にカスタムフィールドの値には気を配る必要がありますが、こういった方法でも並べ替ができますね。

※上記で紹介したプラグインの方が便利かもしれませんが、コード表示の仕方は知っておくべきでしょう。

一押し人気コーナー紹介