【Movable Type】印刷用のスタイルシートを指定する方法

Movable Type
スポンサーリンク

 まあ、僕のブログを印刷するような人はいないと思いますが、他の人のブログを印刷したときにサイドバーとかコメント欄とか不要な部分も印刷されてしまうので削除できるなら自分のブログでもやってみようと思った。トップページを印刷する人はいないでしょうから変更する箇所は個別アーカイブだけ。

 【変更前】
<link rel="stylesheet" href="<$MTBlogURL$>styles-site.css" type="text/css"/>
 【変更後】
<link rel="stylesheet" href="<$MTBlogURL$>styles-site.css" type="text/css" media="screen,tv"/>
<link rel="stylesheet" href="<$MTBlogURL$>styles-print.css" type="text/css" media="print"/>

 追加するのは印刷用のCSS。これは、メインで使っているCSSをコピーして名前を変更。あとは、印刷したくない項目を以下のように { display: none;} を付けるだけです。

 #beta { display: none;}
 #comments { display: none;}
 .content-nav { display: none;}
 .trackbacks { display: none;}

 設定が完了したらブラウザの印刷プレビューで確認して、不要な部分を少しずつ削っていくだけです。

コメント