Firefox でココログを印刷しようとすると本文が１ページ目しか表示されない

これはココログのテンプレートで使っている CSS が overflow:hidden を設定しているためです。これがわかるまでは、page-break (改ページ)まわりの設定や自作スクリプトがはく HTML のコードが悪いのかとかなり悩みました。

《檜山正幸のキマイラ飼育記：[日常]長文記事を読んでもらいたい人は印刷向けスタイルシート設定した方がいいよ》を読んでプリンタまわりの設定をしようとしたところ、上記不具合に気付きました。

CSS がエディットできるなら、例えば次を足せば良いはずです。

@media print { #calender, #left, #right, div.comment-form {display:none;} #container {margin: 0 0 0 0; width:100%; border:0;} #center {margin: 0 0 0 0; width:100%; overflow:visible;} .content {margin: 0 0 0 0; /* padding: 0 0 0 0; */ } }

ちなみに display:none はサイドバー等を表示しないようにするために付けています。必要に応じて修正してください。

2006-03-28 のココログのバージョンアップで、ココログプロでないユーザーも CSS が一部使えるようになっているそうなので、できることならば、サイト管理者が対応するべきでしょう。ユーザーが管理者に訴るべきと言いたいです。

ところが、現在 2010-05-23 ですが、2006-3-27 にはこの記事を出していたにもかかわらず、直っていないサイトが普通のままのようです。

そこで、Firefox ということですし、ユーザー側で CSS をいじってしまうことを勧めてもいいだろうと考えました。その方法を紹介します。

Firefox でユーザー側で CSS をいじるといえば、まず、Stylish というアドオンが思い浮かびます。しかし、この方法はうまく行きません。なぜなら、 CSS 内の @-moz-document 要素の中では、@media が使えないらしいからです。

そこで、Greasemonkey を使って、ユーザー側で javascript を実行して CSS を書き換えることにします。GM_addStyle を使って上記の文字列を足すと……私のところではうまくいきました。

以下にそのユーザースクリプトへのリンクを置いておきます。Greasemonkey のアドオンをインスールしてから、以下をクリックして下さい。サイトとして、 "cocolog-nifty.com" ドメインだけ指定してあります。ココログは cocolog-nifty.com 以外にもありますし、すでに対応しているサイトもあるはずです。それを足したり引いたりするのはユーザーでもできますので、いろいろ試してみてください。

● cocolog_print_fix.user.js

■	参考 ● 《Software Salariman: CSS @media for Firefox Stylish Add-in》。 ● 《asamuzaK.jp : FirefoxのuserContent.css》。@import にもメディアタイプを指定できるらしいので、Stylish でもそれを使えば同等のことができるのかもしれません。それを試す方は、このリンクが参考になるかも。

更新：	2006-03-27,2010-05-23
初公開：	2006年03月27日 02:07:16
最新版：	2010年05月28日 21:13:18