WordPressで投稿ごとの印刷用ページを生成する手順（印刷ページテンプレートの作成例）

2016年7月4日
PHP

※2022.08.25 PHP 8 に対応したコードに修正しました。

WordPressで商品紹介サイトを構築して、1つの投稿（カスタム投稿でも可）が1つの商品紹介ページになる、というような設計になることってよくありますよね？
で、「お客さんや営業マン用に、各商品ごとに印刷用ページを生成したい」っていわれることもあったりしますよね？

WordPressで印刷用ページを生成するためのプラグインってあるんですが、どうしても簡易的なものなので、クライアントさんの思うような印刷用ページになるとは限りません。
そこで今回は、プラグインではなく自力で各投稿ごとの印刷用ページを自動生成する機能をできるだけ簡単な方法で実装してみたいと思います。

目次

前提

  • 記事執筆時のWordPressのバージョンは4.5.3
  • 製品紹介用のカスタム投稿タイプ products を作成していると想定
  • 製品紹介サイトとかなので、細かいスペックをカスタムフィールドで登録・出力しているかもしれないがそのケースもOK

手順1. 印刷用ビューのベースをHTMLとCSSでコーディングする

これは各自がんばってください。みなさんのセンスが問われます。
多分ですが、できるだけA4サイズ1枚に収めてほしいとか要望あると思います。
pxではなくmm単位で調整するとかいろいろコツはあると思うんですが、そこは今回本題じゃないので各自のポテンシャルを発揮してがんばってください。

参考

手順2. 投稿詳細ページに印刷用画面へのリンクボタンを設置する

カスタム投稿タイプの投稿詳細テンプレートであるsingle-products.phpの任意の場所に、「印刷用画面を開く」というような文言のボタンを設置します。（通常の投稿ならsingle.phpに）
ここでのポイントは、リンク先を

<a href="<?php echo esc_url( home_url( '/print/' ) ); ?>?post_id=<?php the_ID(); ?>" target="_blank">印刷用画面を開く</a>

こんな感じに設定すること。
この次の手順で/print/ という印刷用の固定ページを作るんですが、そのあとにURLパラメータで投稿IDを渡してあげるのがミソです。

手順3. 印刷画面用の固定ページを作成

印刷用画面のベースとなる固定ページを作成します。
スラッグは何でもよいですが、ここでは’print’にします。コンテンツは空で構いません。

手順4. 印刷画面用の固定ページテンプレートを作成

WordPressテーマ内にpage-print.phpというPHPファイルを新たに作成します。
このファイル名にすることで、固定ページ’print’には、自動的にpage-print.phpが適用されます。

PHPファイルの中身ですが、まず 手順1で作成したベースのHTMLの中身をそのままコピーしてください。

私の場合は、header.phpやfooter.phpもインクルードせず、印刷ページ上で動かしたいプラグインも特になかったのでwp_head関数やwp_footer関数も省略しました。
CSSやJSもenqueueせずに普通にhead内に書きました。
あと、印刷用画面に直接流入いらないのでnoindexも付けてます。

現時点でのpage-print.phpはこんな感じです。

手順5. URLパラメータ内の投稿IDから印刷したいコンテンツを取得

page-print.phpの<body>の下に以下の記述を入れます。

<?php
    parse_str( $_SERVER['QUERY_STRING'], $array );
    if ( isset( $array['post_id'] ) ):
    $data = get_posts( array (
            'post_type'     =>  'products',
            'post_per_page' =>  1,
            'p'             =>  $array['post_id'],
        ));
    foreach($data as $post):
    setup_postdata($post);
?>

で、</body>の前には

  <?php endforeach; wp_reset_postdata(); ?>
<?php else: ?>
  <p>このページにはなにもないよ！</p>
<?php endif; ?>

こんな感じです。
最大のポイントは

parse_str( $_SERVER['QUERY_STRING'], $array );

の部分です。
parse_strというのはPHPの関数で、URLパラメータの部分を自動的に変数（配列）の値としてセットしてくれます。

参考

PHP: parse_str - Manual

PHP is a popular general-purpose scripti…
www.php.net

また、$_SERVER['QUERY_STRING'] は、アクセスしているページのURLパラメータの部分を取得できるスーパーグローバル変数です。

今回の例であれば、手順2で設置したリンクボタンのリンク先URLはこんな感じになると思います。
http://example.com/print/?post_id=12

このページで
parse_str( $_SERVER['QUERY_STRING'], $array );
を使うと、URLパラメータ部分「?post_id=12」の部分をもとに、$array という配列内に ‘post_id’ というキー名での値代入を勝手にやってくれます。

つまり、 $array['post_id'] = 12 ということです。

そして、指定した条件に合う投稿を取得できるget_posts関数で、投稿IDから投稿を取得できるパラメータ’p’に、印刷させたい投稿のIDを渡しています。

そのあとは、いつものget_postsの使い方と一緒です。

<?php
    foreach($data as $post):
    setup_postdata($post);
?>

と

<?php
  endforeach;
  wp_reset_postdata();
?>

の間を、表示させたいコンテンツを取得するためのテンプレートタグに置き換えていけばOKです。

page-print.php作成イメージ

パラメータなしのhttp://example.com/print/に直接アクセスされたときなどには「このページにはなにもないよ！」って一文がでるようにしてありますが、もっと厳密にやるなら、該当する投稿がないときは404ステータスを返すようにしてもよいと思います。

parse_strを使えば、URLパラメータで投稿IDとかいろんな値を渡してあげることでいろんな処理ができますね。
他にも工夫次第で便利に使えると思います。思いついたら実際に作ってブログで紹介してください！