Index

M3.2-e Super publication... mais je voudrais que le titre soit en rose et que les marges soient plus petites ;-)

Nous allons entrer dans la quatrième dimension : le CSS !

une référence sur le sujet : https://www.w3schools.com/cssref/ (n'y allez pas tout de suite)
sur votre navigateur préféré, tapez conjointement ctrl + maj + I : vous ouvrez l'outil de développement Web. Pour le refermer, utilisez la même combinaison de touches
Vous pouvez aussi, dans une page web (une publication en aperçu) faire un clic droit sur un élément de la page, et cliquer sur "inspecter"
- la même interface va s'ouvrir
- dans la partie "Filtrer les styles" amusez-vous à cocher les cases proposées quand on passe sur les éléments bizarres (c'est du css)

image slecteur.png (0.2MB) — Oui, je sais que c'est petit, il faut cliquer sur l'image pour la voir en grand

amusez-vous à cliquer sur les cases et à changer les variables, pour l'instant vous ne casserez rien mais ça vous permettra d'appréhender un peu la séparation entre le fond (ce que vous avez écrit dans le wiki) et la forme (les éléments css qui décrivent comment les choses doivent être affichées)

Ce que nous voyons c'est que nous pouvons interagir sur la forme (le css), indépendamment du fond.
Certains se diront, il est gentil mais où veut-il en venir...

LA Page Css

Dans YesWiki une page vous permet de modifier le css et ainsi modifier la manière dont vous souhaitez que le contenu de votre wiki mais surtout dans notre cas des PDF ne s'affiche, il s'agit de la PageCss

En fonction de l'ancienneté de votre wiki

soit votre page sera vide
soit votre page sera remplie de texte commenté

Pour commencer à agir sur votre pdf généré par publication, ajoutez les éléments suivants dans cette page :

@media print {
	.yeswiki-publication .right { float: right !important;}
}
	.pagedjs_page.pagedjs_left_page {
	  --pagedjs-margin-top: 10mm !important;
	  --pagedjs-margin-right: 10mm !important;
	  --pagedjs-margin-left: 10mm !important;
	  --pagedjs-margin-bottom: 10mm !important;
	}
	.pagedjs_page.pagedjs_right_page {
	  --pagedjs-margin-top: 10mm !important;
	  --pagedjs-margin-right: 10mm !important;
	  --pagedjs-margin-left: 10mm !important;
	  --pagedjs-margin-bottom: 10mm !important;
  }
}

tout ce qui sera rajouté comme css dans cette page sera pris en compte dans les restitutions.
Par exemple si je souhaite que les listes à puce disparaissent (mais uniquement lors de l'impression du pdf)
je rajouterais

ul {padding-left: 1rem; list-style:none;}

sous .yeswiki-publication
Si vous souhaitez augmenter les marges, il convient de modifier les chiffres au niveau des pagedjs-margin sachant que

top veut dire haut
Left gauche et right droite
bottom bas
il vous faudra faire cela pour les pages de droites (.pagedjs_page.pagedjs_right_page) et les pages de gauches (.pagedjs_page.pagedjs_left_page)