Jun 12 2009

静的 HTML に WordPress を埋め込む方法

実は昔の hiromasa.zone なんかがそうだったりしましたが、WordPress の情報を WordPress 管轄以外から取得したいときがあります。

たとえば、静的 HTML のトップページに WordPress の新着をだしたい、、とかですね。 全部のページ WordPress でやるのもおっくうってこともあるわけです。 :-)

そんな場合は以下のようなコードを使うのもひとつの方法かもしれません。

とりあえず、静的 HTML の場合は、拡張子を .php とか変更して PHP が動くようにします。

すでに、.html で他からリンクしちゃっていてリネームできないよーって方は mod_rewrite で化かすとかとかしてください。 / で終わる URL のときは、index.html をリネームして index.php にすれば OK です。

で、こんなコードを元 html に挿入します。

<?php // wp-load.php を include して WordPress をテーマなしで起動する ?>
<?php // 該当 HTML の先頭行に wp-load.php のパスを自分にあわせて以下を挿入 ?>
<?php include_once "../wordpress-another/wp-load.php" ?>
<html>
<head></head>
<body>
 
<!-- このへんまで普通の HTML かく -->
 
<?php // たとえば WordPress から最新5件のエントリ名を持ってきたい場合 ?>
<?php // 以下 7行を HTML にコピペする ?>
<?php query_posts('showposts=5'); // 最終5エントリ取得のループをつくる ?>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<!-- ここからWordPressのテンプレートタグをかく -->
<p><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></p>
<!-- ここまで -->
<?php endwhile; ?>
<?php endif; ?>
 
<!-- このへんからも普通の HTML かく -->
 
</body>
</html>

wp-load.php を WordPress 以外から include して、query_posts 関数でループをつくってあげれば、好みの条件でループの作成ができます。

一点注意ですが、この方式の場合 WordPress の状態、というかまぁ MySQL の動作にひっぱられるので、MySQL がよくおちるサーバだとページに不具合がでてしまう可能性があります。

それを嫌う場合、をかもとにいさんの方式が良いと思います!

Google AJAX Feed API : dogmap.jp

これを実現するために JavaScript で RSS フィードを取得して表示する方法を調べたので、自分用にメモ。

JavaScript 経由で WordPress の RSS をよんでうめこみます。 非同期なので体感表示速度的にも、をかもとさんの方式が有利だと思います。

ぼくのこの記事、 WordPress 直読みは方式は、ページに投稿を即反映したいとか RSS 以外の情報を取りたいとか、投稿を100件とりたい(笑)とかいった要件がある場合によいかもです。 WP のテンプレートタグがそのまんま使えます。

というわけで、呼ばれて飛び出て、メモおしまい。。

お休み中のためオチはないのです。 ←そこの違いなのか!?

5 Comments

  1. 投稿日時: 2009 年 6 月 12 日、Daytime | パーマリンク

    WordPress の更新情報を JSONP 形式で出力…

    さて、昨日のエントリの続き。
    「Googlle AJAX Feed API なんて外部のサービスに依存したくないんじゃ!」という人のために、同等のことを昨日と同様のことを行うための方法。
    WordPress の更…

  2. 投稿日時: 2009 年 6 月 13 日、Nighttime | パーマリンク

    まさに、ほしいのはこれでした!!
    忙しい中あげてくれてありがとー :–)

  3. 投稿日時: 2009 年 6 月 13 日、Nighttime | パーマリンク

    のんのん。 (party)

  4. 投稿日時: 2009 年 6 月 18 日、Daytime | パーマリンク

    [...] 思い立ったきっかけはこちらの記事で 静的 HTML に WordPress を埋め込む方法 [...]

  5. 投稿日時: 2009 年 7 月 26 日、Nighttime | パーマリンク

Post a Comment

メールアドレスから Gravatar が取得されます。(必須ではありません)

次の HTML タグと属性が使用できます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Trackback

http://another.maple4ever.net/archives/883/trackback/