2016/01/27
投稿 Wordpress HTML
備忘録です。
WordPressの記事一覧をHTML(PHP)で読み込む方法についてです。
参考サイト
WordPressの外にあるHTMLで投稿情報を表示する
WordPressのテンプレートタグ(関数)が使用できるよう、wp-load.phpというファイルを読み込みます。
下記のようなコードをHTMLファイルの先頭に配置してください。
●●.phpに書くことと同じサーバ内にあることを前提としています。
<?php require_once( dirname(__FILE__) . '/wp-load.php' ); ?>
別のディレクトリにWordpressをインストールしている場合は下記になります。
wpディレクトリにインストールしている場合
<?php require_once( dirname(__FILE__) . '/wp/wp-load.php' ); ?>
記事一覧を読み込むタグを書きます。
<!-- WPの記事を5件表示 --> <?php query_posts( 'posts_per_page=5' ); ?> <!-- ループ --> <?php while ( have_posts() ) : the_post(); ?> <!-- 投稿 --> <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <!-- 投稿日時 --> <span class="post-date"><?php the_time( 'Y/m/d' ); ?></span> <!-- /投稿日時 --> <!-- タイトル(リンク付きタイトル) --> <span class="post-title"> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> </span> <!-- /タイトル --> <!-- キャッチアップ画像 --> <p> <?php if ( has_post_thumbnail() ) :?> <?php the_post_thumbnail('thumbnail'); ?> <?php else: ?> </p> <!-- /キャッチアップ画像 --> </div> <!-- /投稿 --> <?php endwhile; ?> <!-- /ループ -->
完成コード
<?php require_once( dirname(__FILE__) . '/wp-load.php' ); ?> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>テスト</title> </head> <body> <?php query_posts( 'posts_per_page=5' ); ?> <!-- ループ --> <?php while ( have_posts() ) : the_post(); ?> <!-- 投稿 --> <div id="post-<?php the_ID(); ?>" <?php post_class(); ?>> <!-- 投稿日時 --> <span class="post-date"><?php the_time( 'Y/m/d' ); ?></span> <!-- /投稿日時 --> <!-- タイトル(リンク付きタイトル) --> <span class="post-title"> <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> </span> <!-- /タイトル --> <!-- キャッチアップ画像 --> <p> <?php if ( has_post_thumbnail() ) :?> <?php the_post_thumbnail('thumbnail'); ?> <?php else: ?> </p> <!-- /キャッチアップ画像 --> </div> <!-- /投稿 --> <?php endwhile; ?> <!-- /ループ --> </body> </html>
ちなみに●●.htmlでもphpが使えるようにすれば大丈夫です。方法は割愛します。
ショートコードを使うとContact Form 7も使えます。
※Contact Form 7の問い合わせフォームを事前に用意してください。
<?php echo do_shortcode( '[contact-form-7 id="0" title="お問い合わせフォーム"]' ); ?>
IDとtitleは設定したものに書き換えてください。
ゼヒトモ内でのプロフィール: ROCKSTREAM, ゼヒトモのホームページ作成・制作サービス, 仕事をお願いしたい依頼者と様々な「プロ」をつなぐサービス
2024/08/20
神社
御朱印
2024/07/06
神社
御朱印
2024/07/06
神社
御朱印
2024/02/09
神社
2024/02/09
神社