WordPressで更新した記事だけをウィジェットで表示させる方法を探った

当サイト記事のリンクは一部に広告が含まれます。

ブログの更新記事をサイドバーに表示させることに成功しました。これで更新履歴も人目につくようになるでしょう!

現在私は、ブログの全記事リライトという途方もない作業を行っています。

この作業は、ただ単に細かい修正をしているわけではなく、基本的には記事をまるごと書き直している(場合よっては内容も大幅に変えている)ので、作業が仕上がるころには、リライトした記事は、ほぼ新作のような状態になっているものも少なくはありません。

しかし当ブログでは、更新した記事は上にはあがってこないようにしているため、せっかく労力と時間をかけて仕上げても、しばらくは人目につくことがなく、しだいにそれが、なんだかもったいないような気がしてきたのです。

そこで私は、WordPressのウィジェット機能を利用して、更新した記事だけをサイドバーに表示させようと思い立ちました。そして悪戦苦闘の末、なんとかこの作業も(いちおうは)完了させることができたので、今回はプラグインなしでサイドバーに更新記事を表示させた方法をお話ししたいと思います。

目次

新着記事を表示させる方法を流用したい

ブログの最近の投稿

私はブログのカスタマイズに関しては、できるだけプラグインに頼らず、自分でできることは自分でしたいと思っていて、新着記事(最近の投稿)の表示もプラグインなしで行っています。

この方法は、わいひらさんという方が運営されている「寝ログ」というサイトの記事を参考にさせていただきました。

寝ログさんで公開されているカスタマイズ方法は、ほかにも参考にさせてもらったところもあり、いろいろと助けていただいただきました。この場を借りてお礼を申し上げたいと思います。

(参考:プラグインなしで新着記事を表示する方法[WordPressカスタマイズ]

さて、上記の参考記事では、新着記事をサイドバーに表示させる方法として、テーマのなかにphpファイルを作成し、それを呼び出して使用するという方法が紹介されています。

こちらを参考にすることで、私は新着記事を表示させることに成功したのですが、これを少しいじれば、更新した記事だけを表示させることもできるのではないかと思われたのです。

ちなみに、紹介されていたコードを参考に、当ブログに合うように少しいじったコードは以下のとおりです。

<?php query_posts('posts_per_page=5&ignore_sticky_posts=1'); ?>

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<div class="new-entry">

 <div class="new-entry-thumb">
  <?php if ( has_post_thumbnail() ): // サムネイルを持っているときの処理 ?>
  <a href="<?php the_permalink(); ?>" class="new-entry-title"><?php the_post_thumbnail( 'medium' ); ?></a>
  <?php else: // サムネイルを持っていないときの処理 ?>
  <a href="<?php the_permalink(); ?>" class="new-entry-title"><img src="<?php echo get_template_directory_uri(); ?>/images/no-image.png" alt="NO IMAGE" title="NO IMAGE" width="75px" height="75px" /></a>
  <?php endif; ?>
 </div><!-- /.new-entry-thumb -->

 <div class="new-entry-content">
  <a href="<?php the_permalink(); ?>" class="new-entry-title"><?php the_title();?></a>
 </div><!-- /.new-entry-content -->

</div><!-- /.new-entry -->
<?php endwhile; endif; ?>
<?php wp_reset_query(); ?>

サムネイル画像のサイズ指定を変更したり、回り込みはcssで指定することにしたりはしましたが、ほぼ紹介されているコードのまま。

私も以前よりかは多少わかるようになってきたので、なんとなく書かれていることは理解することができ、これの、最初の「query_posts」という部分をいじれば、いけそうな気配を感じたわけです。

しかしここで、ちょっとした問題が発生しました。

「query_posts」は非推奨?

この「query_posts」というものは、過去に投稿した記事を呼び出したりすることができる関数ですが、どうやらいくつかの理由から、現在はほかの方法を使用したほうがいい(非推奨となっている)ともいわれているようです。

WordPressの公式マニュアルである「Codex」によると、以下のように書かれていました。

query_posts() は……問題が発生しやすい方法です。……モダンな WordPress コードではもっと安定したメソッドを使うべきです。ひとことで言うと、query_posts() は決して使うべきではありません。以上のことをしっかり理解し、この関数を賢く活用してください。テンプレートタグ/query posts

これまで問題が起きることはなかったものの、ここまで断定的にいわれてしまうと、私のような初心者は不安になる、というか、もう変えなければいけないような気分になってくるわけで、ひとまず更新記事の件は置いておき、先にこの問題の解決方法を模索することにしました。

「query_posts」の代用方法としては、以下の3つがあげられています。

  • 「WP_Query」
  • 「get_posts」
  • 「pre_get_posts」

これらのなかから、できるだけ先ほどのコードをそのまま使うことができるものを探したところ、何度か詰みましたが、いちばん上の「WP_Query」でうまくいくことがわかりました。

「query_posts」を「WP_Query」に書き換える

「WP_Query」に関しては、慣れない方からすれば、わけがわからないと感じてしまうかもしれませんが、いちおうCodexの「関数リファレンス/WP Query」という項目に使い方が書いてあり、これを参考に先ほどのコードを書き換えていくと、以下のようになります。

<?php $args = Array(
 'post_type' => 'post',
 'posts_per_page' => 5,
);

$the_query = new WP_Query( $args ); ?>

<?php if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div class="new-entry">

////この部分は省略、同じ内容が入ります////

</div><!-- /.new-entry -->
<?php endwhile; endif; ?>
<?php wp_reset_postdata(); ?>

どこが変わったのかというと、最初の「query_posts」が「WP_Query」に変わったことで5行になり、次の「have_posts」「the_post」の前に「$the_query->」が付き、最後の「wp_reset_query();」が、「wp_reset_postdata();」に変わりました(真ん中あたりは変わっていないので省略)。

これにより、新着記事は問題なく表示され、「query_posts」問題は解決したわけですが、これぞまさに、偶然の産物とでもいいましょうか。なんと「WP_Query」を使うことにしたことで、私は思わぬ収穫を得ることができたのです!

更新した記事をサイドバーに表示させる

私はマニュアルにあおられ、なかば仕方なく「WP_Query」を使うことになってしまったともいうことができるかもしれません。

ところが、先ほどのCodexで使い方を眺めていると、「orderby」というパラメータを使用することで、投稿記事を並べ替えることができるらしく、なんと「modified」という文字列を指定することで、更新日に並べ替えることができるそうでした(じつは「query_posts」でもできた模様)。

さっそくこのコードを新着記事のファイルに入れて試してみると……きました。私がやりたいことができていたのです。

それから私は、サーバーのFTPで「update-entries.php」と名づけたファイルを作成し、最終的に完成した以下のコードを書き込みます。

<?php $args = Array(
 'post_type' => 'post',
 'posts_per_page' => 5,
 'orderby' => 'modified',
);

$the_query = new WP_Query( $args ); ?>

<?php if ( $the_query->have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div class="new-entry">

 <div class="new-entry-thumb">
  <?php if ( has_post_thumbnail() ): // サムネイルを持っているときの処理 ?>
  <a href="<?php the_permalink(); ?>" class="new-entry-title"><?php the_post_thumbnail( 'medium' ); ?></a>
  <?php else: // サムネイルを持っていないときの処理 ?>
  <a href="<?php the_permalink(); ?>" class="new-entry-title"><img src="<?php echo get_template_directory_uri(); ?>/images/no-image.png" alt="NO IMAGE" title="NO IMAGE" width="75px" height="75px" /></a>
  <?php endif; ?>
 </div><!-- /.new-entry-thumb -->

 <div class="new-entry-content">
  <a href="<?php the_permalink(); ?>" class="new-entry-title"><?php the_title();?></a>
 </div><!-- /.new-entry-content -->

</div><!-- /.new-entry -->
<?php endwhile; endif; ?>
<?php wp_reset_postdata(); ?>

先ほどのものに「’orderby’ = ‘modified’,」の一行が入っただけで、ほかはなにも変わっていません。

5つの投稿記事を、更新日順に表示する、といったようなことが書かれています。

ウィジェットからphpファイルを呼び出す

続いて、WordPressのウィジェットから、サイドバーに「任意のテキスト」を挿入し、先ほど作成したphpファイルを呼び出すショートコードを記入。

なお、これはあくまでも一例ですが、「myphp file=’update-entries’(かっこはブラケット)」といったショートコードをウィジェットのテキストで呼び出すには、以下のコードを「functions.php」に記述することで可能となります。

//ショートコードを使ってphpファイルを呼び出す
function my_php_Include($params = array()) {
extract(shortcode_atts(array('file' => 'default'), $params));
ob_start();
include(STYLESHEETPATH . "/$file.php");
return ob_get_clean();
}
add_shortcode('myphp', 'my_php_Include');

そして、ブログのトップページを確認してみると……

サイドバーに最近の更新が表示されるようになった

できていました。サムネイル画像や文字サイズなどの調節は、新着記事を表示させるときに設定したものをそのまま使うことができたので、スタイルシートをいじる必要もありませんでした。

更新した記事「だけ」の表示はできない?

更新した記事を表示させる作業はこれで完了となりましたが、その後になって、懸念していた問題が発生してしまいました。この方法では、新着記事も更新記事としてカウントされてしまうのです。

つまり、記事の更新はせずに新着記事の公開が連続すると、「最近の投稿」も「最近の更新」も、同じ内容になってしまうということです。

これの原因については、「WP_Query」で記事を表示させる「ループ」という機能の仕様にあるようでした。

「WP_Query」で表示させる記事は、基本的に「publish」という投稿のステータスに基づいて行われるようですが、WordPressでは記事を公開した瞬間にこの「publish(公開済み)」というステータスが付与される仕様になっているので、記事の公開と記事の更新を区別することができないのです(投稿のステータスを参照)。

そのため、今回実装したものは、厳密にいうと「最近の投稿&更新」であって、私がやりたかった最近の更新「だけ」を表示させる方法までは、最終的にたどり着くことができませんでした(最新の投稿を除外することはできなかった)。

そこで、私は応急処置として、「offset」というパラメータを使用し、いくつかの投稿を読み飛ばす(ずらす)ことで、ひとまずは「投稿」と「更新」がかぶることを回避。今回はこれで作業を終了とすることにしました(例:「’offset’ => 3,」3番目までは飛ばし、先に4番目の投稿から表示する)。

あともう少しでいけそうな気もしたのですが、いくら調べてもわからなかったので、とりあえずはこの読み飛ばしの機能で新着記事とのかぶりを回避し、更新記事を表示させることにしたいと思います。

今回のまとめ

・新着記事を表示させる方法を流用できれば手間がはぶける
・「query_posts」は非推奨らしい
・新着記事と更新記事を分けて表示させる方法はわからずじまい

私はちょっとした修正であったり、記事のタイトルを変更した際には、ほかの記事も手動で更新することがあるため、今回実装した「最近の更新」には、かならずしも内容が大幅に更新されたものが上がってくるわけではありません。

しかし、新着の記事も上がってはきてしまうものの、とりあえずはリライト作業が終わった記事も上にはあがってくるので、少なくともリライト作業が終わるまでは、今回実装した「最近の更新」をサイドバーに置いておこうと思います。

新しい記事がしばらく投稿されていないときは、だいたい私は、別の記事の更新作業を進めているので、よかったら見ていただければと思います。

また、「WP_query」では、IDを指定して記事を表示させることもできるなど、いろいろな使い方ができるようなので(ほかでもできたらしい)、リライト作業が終わったあとは、また別の使い方でも流用したいと思いました。

ほんとうは更新した記事だけを表示させたかったのですが、もしそれが仕様なのであれば仕方がないので、ひとまずはこれで今回の作業は完了としたいと思います。

こちらもオススメ

SWELLのデメリット&メリットを忖度なしでガチレビュー【評判通りの実力か?】

当サイトも利用しているテーマ「SWELL」の紹介記事です。PV数や収益を伸ばす強力な手助けになってくれますよ。無料テーマを使っていて伸び悩んでいるならとくにおすすめです。

スポンサーリンク

この記事をシェアする
  • URLをコピーしました!
  • URLをコピーしました!

コメント(確認後に反映/少々お時間をいただきます)

コメントする

目次