ブログ

【印刷できないを解決】印刷できるWordPressページを作る方法

私は【日報】という記事を毎日アップしている。毎日の目標や行動記録、反省点などを書いているページだ。

これらのページは自分用のメモという側面も強く、いちいちページを開かずに見れるようページを印刷して保存したいと考えていた。

しかし、いざページを印刷しようとすると、ページが空白になってしまう!

上記の画像のように印刷ページが真っ白で、ブログのタイトル以外の情報が完全に抜けてしまっている。

そこで、この状況を解決するための方法を探してみた。

なぜ印刷ページが空白になってしまうのか

印刷用のCSSが記述されていないため?

どうやら印刷用のCSSの設定が必要っぽい。なので印刷用のCSSを記述してやれば解決するはずだ。

なお私はCSSのことはよくわからないので、実は違う原因かもしれないことには注意してほしい。

印刷用CSSを作るのは難しかった...

ということで早速記述してみようと思ったが、よくわからない。多少はCSSの知識がないと難しいのだと思う。

印刷用CSSについてわかりやすそうなサイトを見つけたので貼っておく。CSSがある程度分かる人ならチャレンジしてみるといいだろう。

プリントアウトを美しく!WordPressを印刷に最適化する方法

CSSの知識がなくても出来る方法

印刷用ページを作ってくれるプラグイン:PDF & Print by BestWebSoft

「PDF & Print by BestWebSoft」というプラグインを使うと印刷に適したページを作って、ボタンを押すとそこへ飛ばしてくれるようになる。

言葉だけだとよくわからないと思うので、画像を使って説明しよう。

PDF & Print by BestWebSoftをインストールして有効化すると、上の画像でオレンジに囲んだ部分に新しいボタンが追加される。

このボタンの右側の方をクリックすると印刷に適したページを生成してくれる。

この印刷用ページを開いた状態で印刷を「Ctrl + P」で印刷しようとすると、

まともな印刷プレビューが生成され、ちゃんと印刷できるようになる。

どのように印刷される?

この方法を使って印刷すると、サイドバーや関連記事などは印刷されない。つまり記事の部分だけが印刷される。

先程の写真では画像がなかったが、画像がある記事の場合ちゃんと画像まで印刷してくれる。

余分な部分が省かれてスッキリと記事だけ印刷できるので、印刷した後に読みやすい。長めの情報ページを取り扱っているサイトの場合、そのサイトの利用者にとってありがたい機能だと思う。

ただし、カラフルな装飾なども反映されなくなってしまうので、そこはデメリットかもしれない。

PDF & Print by BestWebSoft の導入方法

まずはこのページからダウンロードする。

そうしたらwordpress管理画面の左のメニューバーより「プラグイン」➔「新規追加」とページを移動し、ページの上の方にある「プラグインのアップロード」からダウンロードしたzipファイルをアップロードする。

あとはインストールしたプラグインを有効にするだけだ。特に細かい設定は必要ない。

wordpressで印刷できるページを作る方法のまとめ

印刷できるようにする方法として、「印刷用CSSを作成する方法」と「印刷用ページを生成するためのプラグインを導入する方法」があることを説明した。

そのうち、「印刷用ページを生成するためのプラグインを導入する方法」について説明した。

この方法を用いることで、印刷用ページを生成するボタンを設置することが出来る。

今後の課題

今回紹介した方法だと見たまんまのページではなく、簡素化されたページが印刷されてしまう。

これはこれで有用なのだが、見たまんまのページも印刷できるようにしておきたいところ。

ページに来てそこで「Ctrl + P」でサクッと印刷できる状態にする方法を探りたい。

追記:SEOとかを気にするならこの方法はスルーしたほうがいいかも

今回紹介した方法で印刷ボタンを設置していたのだが、どうやら印刷ボタンを押した後の味気ない印刷用ページも検索でヒットするっぽい。サーチコンソールを見る限り、けっこう検索結果に表示されていて、そこからこのブログにアクセスしてくれた方もいたようだ。

最初から印刷ページにアクセスされると困惑されるだろうと思う。というわけで、当ブログでは印刷ボタンを外しました

完全に自分用のメモブログとかを作るつもりで、見栄えを気にしないという方なら設置してもいいかもしれない。けど、いろんなひとに検索から来てほしいと思っている方はこのボタンは外したほうが良いと思う。