htmlで構成された静的サイトにWordPressの更新情報を表示させる方法

どうも、ホワイトです。

WordPressのことばっかり投稿してますが、もちろんWordPress以外の普通の静的サイトも作ることはできます。

予算の都合上、静的サイトの一部にのみWordPressを埋め込んだり、既存のWordPressサイトとは別に親子関係となるサテライトサイトみたいなサイトを作りたいという要望をいただいたこともあります。

そういったときに、静的サイトにもWordPressの更新情報を表示させたいという依頼をいただくことがあります。

「全部WordPressにしちゃえよ」と喉まで出かかっているのをこらえて「大丈夫ですよ」と答えます(笑)

そんなわけで今回はhtmlで作られた静的サイトにWordPressの更新情報を設置する方法です。

index.htmlにphpの情報が反映されるように設定を記述する

例としてトップページがhttps://whitemoriyama.com/というhtmlで運営されていて、https://whitemoryama.com/blog/の階層だけWordPressがインストールされている状況とします。

トップページのファイルとなるindex.htmlファイルの一行目に以下のように記述します。

<?php require_once( './blog/wp-load.php' ); ?>

WordPressをインストールしたフォルダが「blog」なので、そこを指定するようにします。

「blog」部分はインストールした状況によって異なります。

まずこれでWordPressのファイルを読み込むぞという儀式のようなものです。

更新情報を読み込む設定をする

WordPressの情報が読み込まれるようにコードを記述します。

<ul>
  <?php
    $posts = get_posts('numberposts=5&amp;category=10');
    global $post;
    ?>
  <?php if($posts): foreach($posts as $post): setup_postdata($post); ?>
  <li>
    <a href="<?php the_permalink();?>">
      <p class="postDate"><?php the_time( 'Y/m/d' ); ?></p>
      <p class="postTitle"><?php the_title(); ?></p>
    </a>
  </li>
  <?php endforeach; endif; ?>
</ul>

カテゴリーIDが10に属する記事を5件表示するという形になっています。

.htaccessにhtmlでphpが動作する記述をする

最後にもう一つ行うことが.htaccess内に、htmlファイル上でphpが動作する記述を行います。

AddType application/x-httpd-php .php .html .htm

自分の経験では以上のように記述をしましたが、今回記事を書くにあたってここのところを調べてみたらサーバーごとに設定が違う場合があるということです。

さらに調べていたら以下のサイトを見つけたので、その他のサーバーの場合は参考にしてもらえればと思います。

意外とこういった要望はあると思うので、WordPressの有効活用として是非身につけておきたい知識ですね。