Impression de pages pour forum punBB/FluxBB

Le moteur de forum PunBB ainsi que son récent fork FluxBB ont beaucoup de qualités mais ne contiennent pas par défaut de feuille CSS dédiée à l’impression.
C’est embêtant si l’on souhaite lire de longs textes et débats sur papier, pour diverses raisons (l’écran a tendance à faire mal aux yeux à force), car beaucoup de place est perdue pour des informations inutiles (avatars, nombre de messages…) et l’on gaspille du papier. Sans parler des éléments de couleur, pas forcément utiles.

Voici une petite feuille de style qui améliorera le rendu et passera tout en noir et blanc.

1 – Via FTP, créer un fichier print.css dans le répertoire style/.

2 – Ouvrir ce fichier print.css et coller dedans le code CSS suivant :

body{font-family:helvetica, arial, sans-serif;font-size:12px;padding:10px;color:#000;}
a{color:#000}
#brdheader h1{margin:0;}
#brdheader #brdtitle p{margin:0;}
#brdheader #brdtitle{margin-bottom:20px;}
#brdheader #brdmenu{display:none}
#brdwelcome{display:none}
.linkst p.conr{display:none}
.linkst ul{padding-left:0}
.linkst ul li{display:inline;font-size:14px;}
.blockpost {border-top:1px solid;margin-bottom:10px;padding:0px 10px;text-align:justify;}
.blockpost h2{font-size:14px}
h3{display:none}
.blockpost blockquote{border-left:1px dotted; padding-left:10px;margin:5px}
.postleft dd{display:none}
.postfootleft{display:none}
.postfootright{display:none}
.postlinksb{display:none}
.blockform{display:none}
#brdfooter{display:none}
img {display:none;}

3 – Ouvrir header.php situé la racine de votre forum, et trouver la ligne 80 qui appelle votre CSS classique. La voici :

<link rel="stylesheet" type="text/css" href="style/<?php echo $pun_user['style'].'.css' ?>" />

Rajouter media=”screen” dans la balise, ainsi :

<link rel="stylesheet" type="text/css" href="style/<?php echo $pun_user['style'].'.css' ?>" media="screen" />

4 – Enfin, juste au-dessous, ajouter la ligne de code appelant la nouvelle feuille de style print.

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