「WordPressと静的ページが混在したWebサイトを立ち上げる」には。その２。WordPressをEC2へインストール

EC2にファイルをアップロードする方法の記事では、AWSを使って静的サイトを立ち上げたときのファイルをFTPクライアント経由でアップロードする方法をご紹介しました。

本記事は続編で、静的ページのWebサイトの上にWordPressをインストールするという話です。

本来、静的Webサイト用サーバーを立ち上げて上からWordPressをインストールするようなことはしないと思うのですが、諸般の事情により混在させたかったので、その時のメモです。

Contents

WordPressと静的ページが混在したWebサイトを立ち上げる
おわりに【後日談】

WordPressと静的ページが混在したWebサイトを立ち上げる

前回はEC2に静的サイト用のファイル一式をアップするところまででした。

MySQL インストール、Apache インストール、PHP インストール

→は、本家AWSのチュートリアルどおりに。

WordPress インストール

→はAWSのこちらのチュートリアル。

ここまでは良いが、今回やりたいのは「静的サイトでWordPressのコンテンツの一部を表示させる（WordPressは簡単にブログ更新のようにサイトの更新ができるようにするためのツールとしてだけ利用する。）」ということ。

.htaccessを書き換えることにより、Wordpressを更新すると静的サイトの方へ反映されるリンクを作るところで詰まりまして、そのときの解決メモです。

.htaccess

WordPressが生成する.htaccessをindex.htmlと同じ階層へコピー。

.htaccess書き換え

黄色文字部を足します。AddTypeのところは、Wordpressは.phpなので.htmlにファイル名揃えるくらいの意味。

ブログの内容部分はWordPressにログインし、内容を入力します。

静的サイトのページの編集

index.html（というかWordpressからの内容を表示したい静的サイトのページ）には、次のような感じで組み込めばOK.

<div class="container-fluid col-xs-offset-1"  style="margin-top:5%;">
   <div class="container-fluid col-xs-offset-1"  style="margin-top:5%;">
   <h2 style="font-weight:bold;">Travel Blog</h2>
   <hr style="margin-top:4%;">
   <?php    $posts = get_posts('numberposts=5&category=1');    global $post;    ?> 
   <?php    if($posts): foreach($posts as $post): setup_postdata($post); ?>
  <div> 
     <h3><?php the_title(); ?></h3> 
       <h4> <?php the_time( 'Y/m/d' ); ?>:</h4> 
         <div> <?php the_content(); ?></div>
          <hr style="margin-top:4%;">
  </div>  
 <?php endforeach; endif;  ?>
</div>