Movable Type で、印刷用ページのスタイルシートを指定する方法。

要は、印刷用のスタイルシート(例えば、styles-print.css)を用意して、テンプレートから通常のものと一緒に指定する。以下の手順で設定する。
  1. Movable Type の管理画面の各ページのテンプレートで、以下の部分を探す。
    <link rel="stylesheet" href="styles-site.css" type="text/css">
  2. 以下の青字の部分を追記する(行を分けて書いているが、それぞれ 1行でもよい)。
    <link rel="stylesheet"
    href="styles-site.css" type="text/css" media="screen,tv" />
    <font color="blue"><link rel="stylesheet"
    href="styles-print.css" type="text/css" media="print" /></font>
  3. Movable Type の管理画面の、テンプレート→インデックスタブ→テンプレートを新規作成で、印刷用スタイルシートを作成する。
    • テンプレート名:スタイルシート(印刷用)
    • ファイル名:styles-print.css
    • このテンプレートにリンクするファイル:空白のまま
それでは styles-print.css に何を書くのか?基本的には、styles-site.css の内容をそのままコピペする。そしてカスタマイズしていけばいいのだが、そのまま印刷プレビューしてみるとすぐにわかることがある。ページをまたがるエントリーや、ウェブページが、うまく表示されないのだ。これは styles-site.css の中にある、
overflow: hidden;
と書いてある部分のいたずらである。styles-site.css のスタイルシートの中には数ヶ所この記述が散らばっているのだが、styles-print.css の中ではこれをすべて /* … */ でコメントアウトすればよい。 Movable Type 3.2 であれば、styles-print.css の最後に、とりあえず以下を追記しておけば、サイドバー(Movable Type デフォルトテンプレート右側の部分)や、コメント、トラックバックが印刷時には印刷されなくできる。
#beta,
#comments,
.content-nav,
.trackbacks,
{
    display: none;
}
トラックバック URL: https://perltips.twinkle.cc/trackback/104