- Cas 1 Images sans texte
- Cas 2 Images contenant du texte
- Script « imprime.sh » de création du fichier pdf
- Du beau travail
Cas 1 Images sans texte
Un exemple de fichier large.xhtml dans un document epub. Utilisation de la propriété background.
<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Beautés Des Années 30.</title>
<link type="text/css" rel="stylesheet" href="perso.css"/>
</head>
<body>
<style>
body, html {
height: 100%;
margin: 0;
}
.bg {
/* The image used */
background-image: url("01.jpg");
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: left;
background-repeat: no-repeat;
background-size: cover;
}
</style>
<style>
.bg2 {
/* The image used */
background-image: url("02.jpg");
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: left;
background-repeat: no-repeat;
background-size: cover;
}
</style>
<style>
.bg3 {
/* The image used */
background-image: url("03.jpg");
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: left;
background-repeat: no-repeat;
background-size: cover;
}
</style>
<style>
.bg4{
/* The image used */
background-image: url("04.jpg");
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: left;
background-repeat: no-repeat;
background-size: cover;
}
</style>
<style>
.bg5 {
/* The image used */
background-image: url("05.jpg");
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: left;
background-repeat: no-repeat;
background-size: cover;
}
</style>
<style>
.bg6 {
/* The image used */
background-image: url("06.jpg");
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: left;
background-repeat: no-repeat;
background-size: cover;
}
</style>
<div class="bg"></div>
<div class="bg2"></div>
<div class="bg3"></div>
<div class="bg4"></div>
<div class="bg5"></div>
<div class="bg6"></div>
</body>
</html>
Rendu en pdf.
Cas 2 Images contenant du texte
Plus logique: le logiciel d’impression imprime en A4, les images sont en format A4 (827*1170 pixels en 100 dpi)
Le code html est dans un fichier sans tag de titre (le titre est dans le fichier html précédent)
titre.xhtml
<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Musidora</title>
<link type="text/css" rel="stylesheet" href="perso.css"/>
</head>
<body>
<h1>Interview dans Cinémagazine.</h1>
<p class="subtitle"><a href="https://gallica.bnf.fr/ark:/12148/bpt6k2004743s/f5.item">Cinémagazine N°27 - 22 juillet 1921</a> - Interview de Musidora.</p>
<div style="page-break-before:always"></div>
</body>
</html>
pages-A4.xhtml
La classe a4 est definie dans le css
.a4 {
height: 100%;
margin: 0;
background-position: left;
background-repeat: no-repeat;
background-size: cover;
}
<?xml version='1.0' encoding='utf-8'?>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Musidora</title>
<link type="text/css" rel="stylesheet" href="perso.css"/>
<style type="text/css" title="override_css">
@page {padding: 0pt; margin:0pt}
body { text-align: center; padding:0pt; margin: 0pt; }
</style>
</head>
<body class="a4">
<img alt="Image" src="Cinémagazine_1-A4.jpeg" />
<img alt="Image" src="Cinémagazine_5-A4.jpeg" />
<img alt="Image" src="Cinémagazine_6-A4.jpeg" />
<img alt="Image" src="Cinémagazine_7-A4.jpeg" />
<img alt="Image" src="Cinémagazine_8-A4.jpeg" />
</body>
</html>
Rendu pdf
Script « imprime.sh » de création du fichier pdf
Basé sur ebook-convert de la suite Calibre:
Description des options de sortie en pdf
Mon script d’impression pour créer un fichier pdf est paramétré en A4 avec des marges de 20 pt (0,7 cm) , ce qui laisse la place pour imprimer l’entête et le pied-de-page.
#!/bin/bash
#set -x
#
#
nom=$1
file=${nom%????}
echo $file
#
# date et heure au format local donc en français
dateimp=$(date +%c)
#
ebook-convert "$nom" "$file""$dateimp".pdf --paper-size a4 --pdf-serif-family "Apple Garamond" --pdf-page-margin-left 20 --pdf-page-margin-right 20 --pdf-page-margin-top 20 --pdf-page-margin-bottom 20 --pdf-header-template "<header style='justify-content: space-between; font-size: 50%; color: blueviolet;'> <div>_SECTION_</div> </header>" --pdf-footer-template "<footer style='justify-content: space-between; font-size: 50%; color: blueviolet;'> <div>_AUTHOR_</div> <div>_TITLE_</div><div>$dateimp</div><div> Page _PAGENUM_ / _TOTAL_PAGES_</div> </footer>"