こんにちは！
先日、静的に作成されたサイトにブログを使用する為に、部分的にWordPressが導入されているサイトの修正をする機会がありました。
↓こんなフォルダ構成です。
修正内容は静的に作られたトップページに、WordPressの個別記事の「日付」「タイトル」「本文」「アイキャッチ」を表示させる内容でした。
↓こんな修正です。
今はサイトを構築するのは、全WordPress化するのが普通です。けっこう珍しい修正だったので、備忘録を兼ねて記事にしておきたいと思います。
トップページ「index.html」を準備！
↓「index.html」のコードは以下になります。1行目でWordPressをインストールしているフォルダをパスで指定します。私の環境では「wp」フォルダにインストールしていますので、下記の記述となります。
<?php require_once('./wp/wp-load.php'); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="https://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>テストサイト</title>
</head>
<body>
<p>ここはテストサイトです。</p>
<h2>新着情報</h2>
<ul>
<?php
$posts = get_posts("numberposts=5&category=&orderby=post_date&offset=0");
foreach ($posts as $post):
setup_postdata($post);
?>
<li>
<?php the_time('Y.m.d') ?>
<a href="<?php the_permalink() ?>"><?php the_title() ?><?php the_post_thumbnail('thumbnail'); ?></a>
<?php echo mb_substr(get_the_excerpt(), 0, 30); echo '...' ; ?>
</li>
<?php endforeach; ?>
</ul>
</body>
</html>
次に「.htaccess」を用意します。各サーバーごとにコードが違いますのでご注意下さい。
ロリポップ用の「.htaccess」を準備！
「.htaccess」を作成！
↓コードは以下になります。
AddHandler php5.3-script .htm .html
↓「php5.3」の部分はロリポップの管理画面より「WEBツール」⇒「PHP設定」の「phpバージョン」から確認できます。
ヘテムル用の「.htaccess」を準備！
「.htaccess」の作成！
↓コードは以下になります。
AddHandler php5-script .html
↓「php5」の部分はヘテムルの管理画面より「ウェブ関連」⇒「php.ini設定」から確認できます。
エックスサーバー用の「.htaccess」を準備！
「.htaccess」の作成！
↓コードは以下になります。
AddHandler x-httpd-php5.3 .php .phps .html
↓「php5.3」の部分はエックスサーバーの管理画面より「ご契約一覧」⇒該当ドメインの「サーバーパネルをログイン」⇒「PHP Ver.切替」から確認できます。
作成した「index.html」と「.htaccess」を本番環境にアップして下さい。これで設定は完了です。必ず最後は表示されているか確認して下さい。
最後に！
静的ページで作成されているサイトはまだ数多くあるので、やむなく静的ページにWordPressの新着を読む込む機会があった時はご参考下さい。
以上「静的ページにWordPressの新着情報を表示！」でした！
それではまた。
コメント