Créer une feuille de style CSS pour l’impression

Dans un cadre d’optimisation et de petites touches de professionnalisme, vous pouvez définir une feuille de style CSS pour l’impression concernant les pages de votre site web.

En effet pour une impression, votre sidebar, footer et header doivent-ils apparaître ? Ou souhaitez vous proposez quelque chose de plus claire et plus propre à vos visiteurs avec des titres épurés par exemple ?

Pour commencer, vous allez devoir ajouter la ligne suivante à votre header :

[pastacode lang= »php » message= » » highlight= » » provider= »manual »]

...
		/impression.css" type="text/css" media="print" />

...

[/pastacode]

La nuance de cette feuille de style par rapport à la principal, c’est qu’elle ne sera utilisée que pour l’impression « print », elle chargera la feuille de style qui doit être intégrée à la racine de votre thème principal WordPress pour vos styles d’impression.

Un petit aperçu de ce que vous pourriez avoir comme feuille de style concernant les impressions ci-dessus sachant que de nombreuses autres choses sont possibles. Vous pouvez tentez de lancer l’impression de cette page pour voir le rendu en direct.

[pastacode lang= »css » message= » » highlight= » » provider= »manual »]

#sidebar, #footer, #main-nav, .post-nav.clearfix, #respond {
    display: none;
}

#content {
    width: 100%;
}

[/pastacode]

Par contre certaines parties des propriétés CSS n’étant pas ou peu supportées par la majorité des navigateurs, on ne pourra pas utiliser de façon fiable les éléments suivants :

• la gestion du format de papier
• la gestion des marges d’impression
• les sauts de page avant/après un élément
• les paragraphes solidaires
• la gestion des lignes veuves et orphelines