Ok

En poursuivant votre navigation sur ce site, vous acceptez l'utilisation de cookies. Ces derniers assurent le bon fonctionnement de nos services. En savoir plus.

26.05.2009

Proposez une version imprimable de vos notes avec PrientFriendly

Si les origines des blogs étaient associées à de courtes informations, vous trouvez aujourd'hui de longues notes que vous souhaitez parfois imprimer ou conserver pour une lecture hors connexion. Ça doit bien vous arriver de déconnecter non ?


A priori, vous n'avez besoin de personne pour imprimer une page vue sur le net. Sauf que parfois, une simple page web prend quatre feuilles de papier pour la pub, la navigation, et le contenu, par ailleurs tronqué. La plupart des journaux en ligne proposent une version imprimable de leurs actualités, sans la navigation, mais pas forcément sans la pub.
En fait, il s'agit d'envoyer le contenu de la page dans une autre feuille de styles. Dans un site dont vous auriez la totale maîtrise, vous pourriez définir plusieurs feuilles de styles. Une "courante", une pour l'impression, une pour des affichages spécifiques tels ceux des écrans de téléphones portables.

PrientFriendly, dont la communication n'est pas exempte de greenwashing, vous propose de générer une version imprimable de la page que vous êtes en train de visualiser. Cette dernière sera non seulement affichée dans une CSS simplifiée, mais la publicité et les éléments de navigation seront neutralisés. Si cela ne devait pas suffire, vous pourrez retirer les images et ou des blocs de texte.

 

Avec PrintFriendly, vous pouvez imprimer ou convertir en PDF.

Cette fonctionnalité pourtant intéressante n'est hélas pas la plus efficace. Une gestion aléatoire des tables de caractères génère des textes rapidement illisibles. Par contre, rien ne vous empêche d'installer une imprimante virtuelle PDF sur votre ordinateur. Si vous n'en avez pas encore après avoir installé un scanner par exemple, vous pouvez récupérer PDFCreator (libre et gratuit, à la différence de PDF Creator).

Attention : Cela ne fonctionnera pas toujours. D'expérience, je constate que les blocs de texte avec des listes se comportent assez mal. Pour mémoire, il vous est toujours possible de sélectionner du texte avant de commander l'impression (qu'elle se fasse sur papier, ou d'abord vers un ficher PDF comme PDFCreator). Avant de valider l'impression, vérifiez dans la "zone d'impression" (là où il a dû vous arriver de limiter  l'impression de la page 1 à la page 2) que vous imprimerez bien la "sélection".

Vous pouvez enregistrer PrientFriendly dans un marque-page / favori / signet de votre navigateur, et ou installer un bouton sur votre site pour que la page vue soit envoyée à PrintFriendly. C'est cette dernière possibilité que j'ai utilisé pour modifier mon pied de note.

Par défaut, le code du bouton est le suivant

<script src="http://cdn.printfriendly.com/printfriendly.js" type="text/javascript"></script>
<a href="http://www.printfriendly.com" id="printfriendly" onclick="window.print();
return false;" title="Print an optimized version of this web page">
<img style="border:none;" src="http://cdn.printfriendly.com/pf-button.gif" alt="Print"/></a>

Vous pouvez le personnaliser en ligne, en modifiant l'image notamment.


Du PDF avec le pied ?

Vous retrouverez dans le code ci-dessous les instructions PrientFriendly telles que que je les ai intégrées au pied de note. J'ai retiré l'appel de l'image, utilisé du texte, et personnalisé le titre du lien.

{$post.pubdate|date_format:"`$blog.time_format`"}
{t} Ecrit par {/t}
<a href="http://www.google.fr/search?hl=fr&q=site%3Ageemee.hautetfort.com+%22ecrit par
{$post.user|authorname}%22" target=_blank title="Les autres contributions de
{$post.user|authorname} sur ce blog" name="Les autres contributions de
{$post.user|authorname} sur ce blog" >
{$post.user|authorname}</a> |
<a href="{$post.post_permalink}" id="a{$post.iteration}">{t} Lien permanent {/t}</a>
{if $post.allowcomments!=1} |
<a href="{$post.post_permalink}#comments"> {t} Commentaires {/t} ({$post.commentcount}) </a>
{/if} | {if $blog.blog_type neq 'photoblog'}
<a href="javascript:void(0)" onclick="toggle_emailthis('div_send{$post.post_id}',{$post.post_id});">{t} Courriel {/t}</a>
{/if}
<!-- printfriendly.com -->
<script src="http://cdn.printfriendly.com/printfriendly.js" type="text/javascript">
<!-- // --></script>
<a href="http://www.printfriendly.com" id="pfLink" onclick="window.print();
return false;" title="Obtenez une version imprimable, un PDF"
style="text-decoration: none;" name="pfLink">{t} | Impression {/t}</a>
<!-- /printfriendly.com -->

<!-- AddThis Button BEGIN -->
<script type="text/javascript">addthis_pub = 'blogspirit';</script>
<a href="http://www.addthis.com/bookmark.php" onmouseover="return addthis_open(this, '', '{$post.post_permalink|urlencode}', '{$post.post_title|urlencode}')" onmouseout="addthis_close()" onclick="return addthis_sendto()"> | {t} Partage {/t}</a>
<script type="text/javascript" src="http://s7.addthis.com/js/152/addthis_widget.js"></script>
<!-- AddThis Button END -->
<br>
<!--cat-->{if $post.categories}{t}Dans :{/t}{foreach name="categories" from=$post.categories item="cat"} <a href="{$cat.url}">{$cat.name}</a>{if !$smarty.foreach.categories.last}, {/if}
{/foreach} |
{/if}<!--/cat-->
{tags post="`$post.post_id`" assign="tag"}{if $tag.first}&nbsp;{t}Tags : {/t}{/if}<a href="{$blog.url}tag/ {$tag.name|urlencode|replace:"%2F":"/"}">{$tag.name}</a>{if !$tag.last}, {/if}{/tags}

Il n'est pas exclu qu'un jour nous disposions sur cette plateforme d'une feuille de style dédiée à l'impression avec une fonction dans le pied de note, au même titre que la fonction "Courriel".

Cette note a été rendue possible par la lecture de celle du "Modérateur"

Commentaires

Cette découverte vaut de l'or ! Je vais avec ta permission relayer sur blogtuto.org
Je te dois une réponse à un mail. Ça fait si longtemps que j'en ai honte...

Écrit par : Lavande | 26.05.2009

Répondre à ce commentaire

Bien sûr que c'est permis.
Et pour la honte, nous en avons à boire ensemble, santé !

Écrit par : Gee Mee | 26.05.2009

Excellente cette idée d'intégrer le bouton "imprimer" dans le pied de la note. Pratique pour donner aux lecteurs le bon réflexe ! Même si, évidemment, le mieux reste encore de ne pas imprimer...

Écrit par : Flav | 26.05.2009

Répondre à ce commentaire

Nous sommes bien d'accord Flav.
Cela étant, le bilan carbone d'un document visualisé sur un ordinateur ne semble pas forcément très favorable.

Écrit par : Gee Mee | 26.05.2009

C'est une fonctionnalité sur laquelle nous travaillons et qui sera développée d'ici cet été. Les blogueurs Hautetfort pourront ainsi ajouter cette option dans leur pied de note encore plus facilement ;)

Mais chapeau pour cette note, je reste sans voix face à votre curiosité. Merci merci ;)

Écrit par : Alexandra du blog Hautetfort | 26.05.2009

Répondre à ce commentaire

C'est moi qui vous remercie de ne jamais manquer une occasion de soutenir mon blog.
Et puis vous laisser sans voix, ce serait du gâchis ;-)

Écrit par : Gee Mee | 26.05.2009

Pour sauver des arbres, faut manger les castors ... à défaut de castor, n'imprimer que si vraiment nécessaire ;-) mais j'admire le travail que tu fais ici, vraiment.

Écrit par : Bougrenette | 27.05.2009

Répondre à ce commentaire

Ça c'est du calcul d'empreinte écologique comme je l'aime !
Merci Bougrenette, j'en rougirais presque... si je n'étais déjà vert ;-)
K.

Écrit par : Gee Mee | 27.05.2009

Argh, je sens que je touche du doigt un sujet primordial, une note qui répond à un besoin depuis longtemps exprimé mais jamais satisfait. Pourtant, pourtant j'ai rien compris. Argh !!!!!

Écrit par : Gicerilla | 01.06.2009

Répondre à ce commentaire

Je note que vous savez cultiver avec entêtement votre côté « blonde » ;-)
Vous avez une circonstance atténuante car votre blog, à toute tentative d'impression est rétif.
Printfriendly ou pas.
Quand on veut imprimer une de vos notes, il faut sélectionner le texte et veiller à ce que la page soit mise à l'échelle de la feuille dans les paramètres de l'imprimante. Pas très compliqué, mais il faut consentir à retirer sa perruque de caricature ;-)

Écrit par : Gee Mee | 01.06.2009

Je teste PrintwhatYoulike.com en bouton dans Firefox. Cet outil dispose d'une capture d'image.
@Gee Mee: en lien une nouvelle note Hotline.

Écrit par : kielut | 02.06.2009

Répondre à ce commentaire

J'attends la note à propos de PrintWhatYouLike avec impatience.
Croyez-bien que je lui donnerai tout l'écho qu'elle mérite déjà.

Écrit par : Gee Mee | 03.06.2009

Les commentaires sont fermés.