不動産屋さんの案件で、カスタムフィールドを使用して必要事項を入れれば物件案内ページが出来上がるように制作しましたが、印刷ボタンを付けて、A4用紙に収まるように印刷したいと再依頼されました。
「縮小印刷すれば・・・」と思ったのですが、いろんな方が印刷するのに、それはチョット・・・なので、CSSで印刷用に再レイアウト。
シングルページだけなの、CSSでと思ったのですが調整が面倒なので、他社を参考に印刷用のウインドウ(再レイアウトしたページ)を開きそれを印刷してもらうようにしました。
「シングルページ → 印刷用ウインドウ → プリントアウト」になります。
印刷用のウインドウは固定ページに1ページ追加し、シングルページからポストIDを付けてリンクします。
固定ページ側ではポストIDを受け取り、query_postsでポストIDを読み込んで表示します。
固定ページのヘッダー、フッターは必要な部分のみにしたいので、通常のヘッダー、フッターをコピーして作ったものをget_template_partで読み込んでいます。
A4に収まるサイズですが、縦はどうにもならないので、横630pxぐらいだと余白調整しなくても収まるようです。
縦位置で改行したい時はCSSで
@media print { /* 前で改行 */ .pagebreak { page-break-before: always; } /* 後で改行 */ .pagebreak_after { page-break-after: always; } }
を入れてあげると改行します。
物件案内の地図は「MW Google Maps」を使用しています。
アドバンスカスタムフィールドの地図でもいいのですが、住所検索がちょっと・・・だったので、MWを使用しています。
印刷用の地図は動かなくていいので、スタティックマップを使用しています。
緯度、経度はpost_metaに入っているので、
<?php $post_meta = get_post_meta( $post->ID, '_mw-google-maps', true ); // $post_meta['latitude'], $post_meta['longitude'] ?>
日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)