Wordpressで印刷時の表示がおかしいので、取りあえずそこそこ希望通りに修正する件

2018年9月10日月曜日

CSSとか… WEB備忘録 Wordpressとか…

t f B! P L


WPのテンプレートを独自に作成していたのですが、サイト自体は正常に表示されるも、印刷用の表示になると壊滅的状況になっている…。

取りあえずは、そこそこに表示で来ていればいいのだが、これはあまりにも酷かったので修正してみることに。

おおよその予想はついていましたが、確認と案の定印刷時の「media」指定部分に問題がありました。

崩れている際の指定は以下の通り、

<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" media="screen">

このmedia部分をallに変更してやります。

<link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>" media="all">


これで、ざっくりではありますが壊滅的な印刷表示は回避できるかと思います。

更に細かな印刷時の設定を行うには、media部分にprintを指定して別途定義します。

方法は2つあり、別に印刷用のCSSを読み込ませる方法と、今あるCSSに追加で定義する方法です。


<link rel="stylesheet" type="text/css" href="print.css" media="print">

↑こんな感じで印刷用のCSSを別途読み込ませる。

または、今のCSSに印刷時の設定を追記する。↓

@media print{
  /*  ここに印刷時の表示設定を書く!  */
}

といった具合です!

取り合えず、あまりにも印刷時の表示崩れが酷い場合には、一度「media="all"」部分を確認してみると良いかもです!w

まあ、今回はざっくり整えるというあいまいな修正ということで!!

このブログを検索

Twitter