まるかじり！しが

注目キーワード
  1. 私が女優になる日
  2. THE FIRST
  3. 小室圭

WordPressの記事を好きな順番に並び替える方法

WordPress
WordPressの記事を好きな順番に並べ替たい！公開日時を修正するしか、方法はないの？

WordPressの記事は、通常、新しい物から手前で、どんどん古い物が後ろという形で表示されます。しかし、特定の記事を手前に持ってきたり、特定の順番に並べ替えたい時があります。そんな時、簡単にできる方法が、動かしたい記事の公開日時を変更することです。しかしながら、動かしたい記事が、多数あるならば、変更作業もなかなかの手間となってしまいます。また、順番を間違ったりしてしまう可能性も出てきます。

当記事では、記事の表示順を、もっと簡単に変更、正確に変更する方法に迫っていきたいと思います。

目次

WordPress記事の並び替えは、「Intuitive Custom Post Order」や「Simple Custom Post Order」が一番？答えは、ノー！

ドラッグ＆ドロップで簡単に記事の並び替えができる「Intuitive Custom Post Order」「Simple Custom Post Order」

WordPressの記事の表示の順番を好きな順番に並び替えたいと思って方法をネットで探すと一番に出てくるのが、「Intuitive Custom Post Order」や「Simple Custom Post Order」などのプラグインを使っての並び替えの方法かと思います。

「Intuitive Custom Post Order」や「Simple Custom Post Order」のプラグインをインストールすると、投稿一覧などで記事をドラッグ＆ドロップで簡単に並び替えができてしまうというのが、これらのプラグインの便利なところです。

「Intuitive Custom Post Order」や「Simple Custom Post Order」が使えないテーマが増えている？！

しかし、最近のWordpressのテーマの中には、これらのプラグインをインストールしても並び替えができない、動作が不安定になる場合も多いようです。ネットでも、自分の環境では、「Intuitive Custom Post Order」や「Simple Custom Post Order」が動作しなかったという記事を、2018年以降くらいに書かれた記事で、いくつも見掛けました。当サイトが使っている「THE THOR（ザ・トール）」も、公式サイトに相性の悪いプラグインとしてまだ報告が上がっていませんが、「Intuitive Custom Post Order」や「Simple Custom Post Order」は使えません。

「Intuitive Custom Post Order」や「Simple Custom Post Order」のプラグインに共通することが、 JavaScript を使って並び替えを行っているようですが、これが原因で、並び替えが上手く機能しない、動作が不安定になるWordpressのテーマが存在するようです。

現在でも、「Intuitive Custom Post Order」や「Simple Custom Post Order」が正常に機能するテーマも存在し、筆者も正常に機能するテーマを見つけました。記事の並び替えの機能が欲しかったので、正常に機能するテーマに切り替えようかとも考えましたが、「Intuitive Custom Post Order」や「Simple Custom Post Order」などのドラッグアンドドロップによる並び替えを使っての記事の管理の限界も見つけたので、テーマの切り替えは止め、別の方を方法を探すことにしました。

Intuitive Custom Post Order」や「Simple Custom Post Order」などのドラッグアンドドロップによる並び替えを使っての記事の管理の限界

「Intuitive Custom Post Order」や「Simple Custom Post Order」などのドラッグアンドドロップによる並び替えを使っての記事管理の限界とは、並び替えする記事が増えたときに管理が大変、今後、テーマの仕様変更により突然使えなくなるという可能性もあるということです。

WordPressの記事を五十音順に並べたい！

悪戦苦闘の結果・・・

筆者が作りたいと思ったのは、「滋賀弁・近江弁の方言辞典」で、辞典ということで、記事を五十音順に並べる方法を探しました。しかし、なかなか見つからない・・・。

「Intuitive Custom Post Order」や「Simple Custom Post Order」のプラグインも多くのサイトで見つけましたが、私の使用する環境では、先にも書いた通り、テーマ「THE THOR（ザ・トール）」との相性で使えませんでした。

次に「Knowledge Base for Documents and FAQs」という用語集や辞典を作ることの出来るプラグインを試してみたけれど・・・・、

「Knowledge Base for Documents and FAQs」のデザインがいまいちで当サイトのデザインになじみにくい・組み込みにくい、

そして、致命的だったのが、表示を並び替えができるのが、「Knowledge Base for Documents and FAQs」のメニュー画面内のみ（しかも、手動による並べ替えのみ）で、メニュー画面から１つでも別のページへ進めば並び方はWordPressの仕様の新しい順に並べるという方法に戻ってしうということでした。

と使い物にならない状態でした。

そして、たとえ、「Intuitive Custom Post Order」や「Simple Custom Post Order」や「Knowledge Base for Documents and FAQs」が上手く使えたとしても、手動で並び替えをしなければならないということに、将来的な限界を感じました。辞典である以上、手動で簡単に手直しができるだけの数を管理するだけでは辞典としての価値がない！、しかし、莫大な数を管理するならば、手動でなく法則に基づく自動で並べないとダメと改めて考えました。

色々さがした結果・・・・、

WordPressのシステム上の記事を並び替えることはあきらめ、新しいページに自分が希望する順番で並び替えた結果を一覧で表示させる方法を見つけました。それを実現できるプラグインは、「WP Show Posts」です。

「WP Show Posts」で記事の並び替えが自由自在に！

WordPressだけは自由がない、不便！

「WP Show Posts」は、自動で記事一覧を作れるプラグインです。記事一覧を作る過程で、記事の並び替えもできるという優れものです。WP Show Postsは、多様な並び替えができ、その中に、五十音順での並び替えもできることを見つけました。

以下は、WordPressの投稿記事の一覧画面（画像をクリックすると、大きな画像が現れます）です。タイトル名の先頭に「あ」「か」「ん」「４」「＠」などと記入しています。そして、WordPressの仕様通りの公開日時が新しい物が上に来ています（公開日時を２０１５年に設定しているのは、これらの記事で、最近の公開の新しい記事が埋もれてしまうことを避けるためです）。

この状態を、WordPressの仕様のままで表示すると、もちろん公開日時が新しい物が一番で表示されてしまいます。当記事では、上記の記事たちに、testpageというタグを設定しました。よって、testpageというタグのアーカイブ（https://biwa.shiga.jp/tag/testpage）を開くと以下の通り、公開日時が新しい物から表示されます。画像をクリックすると、実際のtestpageというタグのアーカイブ（https://biwa.shiga.jp/tag/testpage）のページが開きます。

 

この表示は、もちろん筆者の希望する五十音順にはほど遠い物です。

「WP Show Posts」で五十音順を実現

しかし、WP Show Postsというプラグインを利用することで、筆者の希望する五十音順を遂に実現することができました。画像をクリックすると実際のページ（https://biwa.shiga.jp/wordpress/short-title-descending-order.html）を見ることができます。

公開日時がバラバラの状態で、五十音順に並んでいます。新たなページも、タグに「testpage」を設定するだけで、自動的に五十音に従って一覧に追加されます。
自動整列の優先順位は、先頭が記号、次に数字、その次にアルファベット、その後に平仮名（五十音順）となります。

上記の表示は、当サイトが利用するWordPressのテーマの仕様に近い表示を実現するために、３列４行で１ページ内に１２ページのサムネイルを表示する設定にしました。

以下は、別バージョンで作成したので、参考までに・・・。

２列５行の１ページ内１０ページのサムネイルを表示
画像をクリックすると実際のページ（https://biwa.shiga.jp/wordpress/short-title-descending-order.html）を見ることができます。

１列５行の１ページ内に５ページへのリンクと抜粋などのみの文字のみ表示（「滋賀弁・近江弁辞典」で実際に利用）
画像をクリックすると実際のページ（https://biwa.shiga.jp/wordpress/short-title-descending-order.html）を見ることができます。

滋賀弁・近江弁辞典での実際の運用の裏

当サイトの滋賀弁・近江弁辞典では、滋賀弁・近江弁辞典の全ての記事を「滋賀弁（shigaben）」というカテゴリー（Category）に所属させ、更に地域（湖北弁（kohoku-ben）・湖東弁（koto-ben）・湖南弁（konan-ben）・甲賀弁(konan-ben)・湖西弁（kosei-ben））をタグ（Tag）で分類しています。このような状態から、通常、滋賀弁のカテゴリーアーカイブを開かれてしまったら、五十音順でない公開日時順の一覧が表示されてしまいます。地域別についても、湖北弁・湖東弁・湖南弁・甲賀弁・湖西弁それぞれのタグアーカイブを開けば、五十音順でない公開日時順の一覧が表示されてしまいます。公開日時順のページを開かれてしまうことを避けるために、「Redirection」というページの自動転送を可能にするプラグインを使用し、カテゴリーやタグアーカイブのページを開こうとしたら、作成した五十音順のページへ強制的に自動転送する設定にしました。結果、どんな場合も、五十音順の一覧が表示できるようにしています。
以下は、湖北弁のタグアーカイブ（公開日時順）を、作成した五十音順の湖北弁一覧へ自動転送するルール画面

「WP Show Posts」を使って、もっと自由に並び替えたい！！

近日公開予定

 

「WP Show Posts」の使い方

  1. WordPressの「プラグインの追加」から「WP Show Posts」と検索して、「今すぐインストール」をクリックしてプラグイン「WP Show Posts」のインストールを行う
  2. プラグイン「WP Show Posts」のインストール完了後、「有効化」をクリックして、プラグイン「WP Show Posts」を利用可能な状態にする
  3. プラグインをインストール＆有効化すると、サイドメニューに「WP Show Posts」の項目が追加されるので「新規追加」をクリックする
  4. 開いた画面で、まず「タイトル」を入力し、以後、各種設定を行っていく（ここでは、一番最初に書いた、五十音順でサムネイル付きで３列６行の設定の作成をもとに、書き進めていきます。）
  5. 「タイトル」入力後、「投稿」についての設定を行う
    ○投稿タイプ
    ・post（投稿ページ）
    ・page（固定ページ）
    ○分類
    ・category（カテゴリー）
    ・post_tag（タグ）
    ・post_format（フォーマット、　カスタムフィールドやプラグインが作成したページなどにも対応）
    ○分類項目（分類でpost_tagを選択すると、出現し、タグが選択できるようになる）
    ○ページあたりの投稿数
    ○ページ送り（ページあたりの投稿数以上のページの登録がある場合、２ページ目以降の一覧に表示するかの有無）
    ・有り（チェック有り）
    ・無し（チェック無し）
  6. 「カラム」の設定を行う
    ○カラム（１行に表示する投稿数（１～5の間で設定可能））
    ○カラムの間隔：表示される記事と記事の間隔
  7. 「画像」の設定を行う
    一覧表示されるサムネイル画像の設定を行います。サムネイル画像は、各ページのアイキャッチ画像がです。一覧表示を、きれいに表示させるために、各ページのアイキャッチ画像を同じ大きさにしておくことが望ましいです。
  8. 「コンテンツ」の設定を行う○コンテンツの種類
    ・全文
    ・抜粋
    ・なし
    ○抜粋の長さ（語句数）
    ・コンテンツの種類が「抜粋」の場合に表示する抜粋の最大文字数の設定
    ○タイトルを含める（タイトルを表示するかの有無）
    ・チェック有り、タイトルを表示
    ・チェック無し、タイトルを非表示
    ○Title element（タイトル名に使用するhtmlタグ）
    ○「続きを読む」の文字（入力された文字が”続きを読む”リンクとして使用される（※ 空白の場合はリンクなし））
    ○Read more button class（上記の”続きを読む”リンクのclass名）
  9. 「メタ情報」を設定する
    一覧表示にサムネイル画像やタイトルなど以外に何を表示するか設定
    ○投稿者を含める（投稿者の表示・非表示の設定）
    ○日付を含める（公開日時の表示・非表示の設定）
    ○日付の位置（日付を表示する場合、どの位置に表示するか設定）
    ○分類項目を含める（記事が所属するカテゴリーやタグなどの表示・非表示の設定）
    ○分類項目 ID（分類項目を表示する場合、どの位置に表示するか設定）
    ○ Include comments link（コメントへのリンクの表示・非表示の設定）
  10. 「詳細設定」を行う（ここの設定で、「五十音順による並び替えなどを実現」）
    ○投稿者ID（投稿者から表示する記事を限定）
    ○投稿ID（記事IDで、表示する記事を指定）
    ○除外する投稿ID（記事IDを指定して、非表示にする記事を指定）
    ○オフセット（埋め合わせ設定？）
    ○並び順
    ・昇順→五十音順「あ→ん」の順
    ・降順
    ○並び替え
    ・並び替えしない
    ・ID
    ・投稿者
    ・タイトル→五十音順
    ・スラッグ
    ・投稿タイプ
    ・日付
    ・修正
    ・親
    ・ランダム
    ・コメント数
    ○ステータス
    ・公開済み
    ・レビュー待ち
    ・下書き
    ・自動保存
    ・予約投稿
    ・非公開
    ・継承
    ・ゴミ箱
    ・すべて
    ○メタキー
    ○メタ値
    ○分類の操作方法
    ・IN：～を含む
    ・NOT IN：～を含まない
    ・AND：〇〇と××に該当する
    ・EXISTS：～がある
    ・NOT EXISTS：～がない
    ○該当がない時のメッセージ
  11. 設定が完了したら、右側のメニューの「使用法」にある「ショートコード」をコピーし（後ほど利用します）、「公開」ボタンを押して公開状態する。
  12. 先程コピーした「ショートコード」を貼り付けるための固定ページを作成し、「ショートコード」を貼り付け、固定ページを公開状態にする。(ショートコードは、投稿ページへの貼り付けもできますが、ページ送りの機能が動作しない等の不具合が発生するので、非推奨です。)
  13. 設定完了。以下のページ（https://biwa.shiga.jp/wordpress/short-title-descending-order.html）の完成。五十音順・サムネイル付きで３列4行表示のページ。
広告