{up printer=texte bouton} le contenu à imprimer {/up printer}- printer = ⎙ Imprimer: texte du bouton
- selector: sélecteur CSS du bloc à imprimer
Position du bouton
- btn-before: le bouton est après le contenu à imprimer
- btn-display-on-print: 0 = masque le bouton sur l'impression
Divers
- filename: nom du document si impression PDF
- id: identifiant
Style CSS du bouton
- class: classe(s) pour bloc
- style: style inline pour bloc
- css-head (base-css): style ajouté dans le HEAD de la page
Un exemple simple
Il suffit d'entourer le texte à imprimer entre un shortcode ouvrant et un shortcode fermant. Un bouton sera ajouté au-dessous pour proposer une impression sur une des imprimantes installées sur le poste de l'internaute. Testez avec une imprimante virtuelle PDF pour ne pas gâcher de papier.
{up printer}
<p class="tc bd-bleu">Ceci est le bloc à imprimer<br>avec le bouton au-dessous.</p>
{/up printer}
Ceci est le bloc à imprimer
avec le bouton au-dessous.
Options du bouton
L'option principale de l'action est le texte du bouton. Notez ici, l'utilisation de l'action icon pour afficher en jaune le caractère Unicode représentant une imprimante.
Par défaut, le bouton est ajouté après la zone à imprimer, mais l'option 'btn-before' permet de le mettre avant.
Avec l'option class, il est facile de l'agrémenter. mb1 et mcenter sont des classes de la feuille de style de UP
{up printer={up icon=Ux2399,yellow,24px} Imprimer les informations ci-dessous
| btn-before
| class=btn btn-primary mb1 mcenter}
<p class="tc bd-bleu">Ceci est le bloc à imprimer<br>avec le bouton au-dessous.</p>
{/up printer}Ceci est le bloc à imprimer
avec le bouton au-dessous.
Imprimer l'article ou un bloc
Dans les exemples précédents, nous avons imprimé le contenu entre les shortcodes. Il est possible d'utiliser l'option selector pour indiquer le sélecteur CSS du bloc.
Le bouton ci-dessus est obtenu avec ce shortcode :
{up printer=Imprimer la totalité de l'article
| selector=.com-content-article
| class=btn btn-primary}Par défaut, les boutons ne sont pas repris sur la version imprimée. Pour les conserver, il faut ajouter l'option btn-display-on-print pour tous les shortcodes printer de la page.
Définir le shortcode en dehors des articles
Pour éviter d'ajouter un shortcode sur toutes les pages concernées, il est possible de le mettre dans un module personnalisé externe ou plugin.
L'action "printer" apporte une solution pour Joomla 4+ qui ne propose plus de bouton "Imprimer".
Pour éviter d'ajouter un shortcode à chaque article, 2 méthodes sont possibles :
- le mettre dans un module personnalisé. Le bouton sera en dehors de la page.
- utiliser ArtPlug, un plugin crée pour ajouter du code aux articles. Le bouton pourra être avant ou après l'article.
Exemple de shortcode pour imprimer l'article courant avec le template Cassiopeia
{up printer | selector=.com-content-article| class=btn;btn-primary;margin: 0 0 0 auto }
selector : mettre le sélecteur de bloc correspondant à votre template. Identifiez la classe ou l'identificateur du bloc article avec l'inspecteur de code de votre navigateur (touche F12 avec Firefox et Chrome)
class : le style du bouton qui sera aligné à droite
Astuce : ne pas imprimer une partie de la page
UP propose la classe CSS noprint. Il suffit d'entourer la partie à ne pas imprimer dans un bloc avec cette classe
Exemple, faites le test en cliquant sur le bouton 'Imprimer la totalité de l'article en changeant le nom du fichier' du chapitre suivant :
Renommer la page imprimée
Si l'internaute utilise une imprimante PDF, le nom du fichier est le titre de votre page. L'option filename permet de définir un autre nom.
{up printer=Imprimer la totalité de l'article en changeant le nom du fichier
| filename=UP-Printer - page renommée
| selector=.container-inner
| class=btn btn-primary}Vous pouvez faire le test en cliquant sur le bouton ci-dessous et en sélectionnant une imprimante PDF comme cible.
printer (5) upactionslist (1) flexauto (2) icon (1) div (1) jcontent-info (1) tabslide (1) toc (1)