AX

MT(Movable Type)で印刷用ページを作成する


ブックマークに追加する :ソーシャルブックマーク

2007_08_23 記

[序論]

MovableTypeで印刷用ページを作成する。
二つの方法を発見した。

ひとつはスタイルシート(CSS)へのリンクを、ディスプレイで表示するものと印刷プレビュー用のものをそれぞれ作り印刷するときは印刷用スタイルシートで印刷する方法。

もうひとつはjavascriptを使って印刷用のスタイルシートに切り替える方法。

そして、最終的にはこれらの方法をコンボしてみた。


[方法A]

[参考]MTで印刷用ページを作成するには? ? #BLOG
上記のページを参考にする。

注)私のMTのバージョンは「Movable Type 3.33-ja」である。

スタイルシートへのリンクに手を加える。
デフォルトならば、

これを、

と書き換える。
「media=""」で選択された状況の時に、リンクされたスタイルシートが使われる。screenはスクリーン,tvはテレビ画面,printはプリントするときである。
ディスプレイ上で表示するときは「styles-site.css」を使い、プリントプレビュー画面では「styles-print.css」が読み込まれる。

二行目にhrefで「styles-print.css」を呼んでいるので、当然ながら「styles-print.css」という名前のスタイルシートを作らなくてはいけない。

Movable Type 3.33-jaのバージョンならば「テンプレートの新規追加」でテンプレート名(適当),出力ファイル(styles-print.css)とすれば大丈夫なはず。

ファイルの内容は基本的に「styles-site.css」と同じにして、不必要な部分を「 display: none;」で表示しないようにする。

たとえば、コピーアンドペーストで内容を貼り付けた最後の行


をつけると、印刷プレビューでbeta,comments,content-nav,trackbacksに関連するものが表示されなくなる。


注)ただし、Firefoxの場合、長い文章を印刷しようとすると印刷プレビューで1ページ分だけ表紙された後、文章が切れてしまうバグがある。
これについては後日。


[方法B]

これは以下のページに紹介された方法。
javascriptを使って切り替えている。
[参考]nlog(n): 印刷用ページを作るには

上記のページを読んだほうが丁寧だとおもう。


[方法AとBのコンボ]

方法Bは非常に優れた方法だと思う。
しかし、javascriptを無効にされるとどうしようもない。
そこで、苦肉の策を考えてみた。

まず、個別エントリー用のスタイルファイルの中の

に書き換え、その下に


を挿し込む。

これは、javascriptが無効のときによってstyles-site.cssから要らない部分を削るstyle-print.cssを読み込むようにしている。
ベースになるスタイルシートは「styles-site.css」内にあるので、「style-print.css」の中身は

など、あるいはさらに変更したい部分を書き加える。
あとは、方法B と同様にして、個別エントリー用のスタイルファイルの本文中の任意の場所に

を挿し込む。

何をやっているのかをまとめると、


あまり美しくないが、これでjavascriptが無効になっていてもプリントできるのではないかと思う。


ちなみに、firefoxで印刷が1ページ分で切れるのは(いろいろ原因があるようだが、)
私が確認した範囲では、スタイルシート内の
「overflow: hidden;」が関係している様子。
これは「overflow: auto;」でも「/* overflow: auto; */」とコメントアウトしてもだめだったが、
「overflow: visible;」で取り合えず表示されるようになった。




参考
[]MTで印刷用ページを作成するには? ? #BLOG
[]nlog(n): 印刷用ページを作るには
関連
[]
トラックバック
[]

----広告----

------------
ブログランキング・にほんブログ村へ 人気ブログランキングへ :役にたったらクリックお願いします


ブックマークに追加する :ソーシャルブックマーク

Track Back

Track Back URL

コメントする

※ コメントは認証されるまで公開されません。ご了承くださいませ。

公開されません

(いくつかのHTMLタグ(a, strong, ul, ol, liなど)が使えます)

このページの上部へ

サイト内検索

スポンサードリンク

スポンサードリンク

スポンサードリンク

Sponser

カテゴリ

Powered by Movable Type 5.12