Aggiungere un link per stampare il post su Blogger!


image Molto richiesta nel sondaggio, e in generale molto richiesta via mail, è sempre stata la possibilità di poter aggiungere un link per stampare direttamente il post dal blog. Modifica molto desiderata soprattutto dagli autori dei blog di cucina, tra i quali, ho scoperto recentemente, c’è un vero e proprio scambio continuo di guide culinarie in pdf (e in questo potrebbero tornare utili le guide su come creare documenti in pdf e alcuni servizi gratuiti per pubblicarli in rete).

Ho studiato vari modi in passato per farlo, molti su Blogger utilizzano PDF Online che permette un’integrazione gratuita (ma limitata), tuttavia nel blog di Iole ho trovato una soluzione molto elegante e che non richiede l’uso di strumenti esterni.

Riporto qui l’intervento, con qualche piccola personalizzazione.

Passo 1

Da Layout->Modifica HTML, selezioniate “Espandi i modelli widget” e cerchiate la seguente porzione di codice:

<div class='post hentry'>

Questa riga è presente nel template Minima (il più diffuso e base di partenza per la maggior dei template personalizzati), ma in altri template potrebbe essere leggermente diversa. Se non si riesce a trovare esattamente la riga, basta cercare solo la parte iniziale:

<div class='post hentry

Una volta individuata, bisogna inserire prima dell’ultimo carattere “>” questa porzione di codice:

expr:id='"hentry-" + data:post.id'

Nell’esempio del template Minima, la riga diventerà quindi:

<div class='post hentry' expr:id='"hentry-" + data:post.id'>

Quella in rosso è la parte da aggiungere.

Passo 2

Cercate questa porzione di codice:

<div class='post-footer'>

E subito sopra incollate questa porzione di codice:

<a class='printer' expr:onclick='"javascript:stampaPostCompleto(\"hentry-" + data:post.id + "\", \"Link: " + data:post.url + "\");"'>Stampa il post</a>

Se volete che il link per la stampa appaia solamente nella pagina del singolo post (utile per esempio se utilizzate la visualizzazione sintetica dei post) utilizzate invece questo codice (rispetto al primo ho aggiunto le due righe in rosso):

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<a class='printer' expr:onclick='"javascript:stampaPostCompleto(\"hentry-" + data:post.id + "\", \"Link: " + data:post.url + "\");"'>Stampa il post</a>
</b:if>

Passo 3

Cercate questa riga nel template:

]]></b:skin>

E subito sopra incollate:

a.printer {
cursor: pointer;
background: url(http://tinyurl.com/lfk9jd) no-repeat;
padding-left: 20px;
margin-right: 10px;
}

Passo 4 (aggiornato)

Cercate questa riga di codice:

</head>

E subito sopra inserite questo codice:

&lt;script&gt; 
function stampaPostCompleto(divId,link) {
var postContent = document.getElementById(divId).innerHTML;
stampa(link+postContent);
}
function stampa(html) {
var printWindow = window.open(&quot;&quot;,&quot;printPost&quot;,&quot;top=100,left=200,width=600, height=400,scrollbars=yes,status=no,menubar=no,toolbar=no,locations=no&quot;);
printWindow.document.open();
printWindow.document.write(&#039;&lt;a href=&quot;#&quot; onclick=&quot;window.print();&quot;&gt;&lt;img src=&quot;http://tinyurl.com/lfk9jd&quot; alt=&quot;&quot; border=&quot;0&quot; /&gt;&lt;/a&gt; &lt;a href=&quot;#&quot; onclick=&quot;window.print();&quot;&gt;Stampa il post&lt;/a&gt; &lt;br /&gt; &lt;br /&gt;&#039; + html);
printWindow.document.close();
}
&lt;/script&gt;


Passo 5



Salvate il template e visualizzate il blog. Sotto ogni post adesso vi apparirà il link per stamparlo:



image



Cliccandolo, si aprirà una pagina con la versione stampabile del post:



image



E basterà cliccarci sopra per far partire la finestra della stampante:



image



Questo comportamento può essere modificato, ad esempio aprendo direttamente la finestra della stampante senza passare dall’anteprima. Possiamo discuterne assieme.



Passo 6



Lasciate un ringraziamento nel blog di Iole, visto che ne è lei l’autrice!



Ho testato la modifica su Chrome, Firefox 3.4 e Internet Explorer 8, senza problemi. Vorrei sapere da voi se trovereste utile trovare anche qui la possibilità di stampare il post, così magari l’aggiungo anch’io.


Condividi su Facebook, Twitter o Google Buzz:
Condividi su Facebook Condividi su Twitter Pubblica su Google Buzz

Per ricevere direttamente in posta i nuovi articoli, inserisci il tuo indirizzo email:
oppure puoi iscriverti al feed per tenerti sempre aggiornato sui nuovi contenuti del blog!
Per maggiori informazioni sui feed, clicca qui!

48 commenti:

daniela sognidiperlej12m13 ha detto...

Assolutamente sì. Credo che mi sarebbe molto utile, visto che ogni tanto mi stampo i tuoi utilissimi suggerimenti. Grazie sin da ora. ;;)

AUTOdiMERDA ha detto...

Ciao Orazio.
Interessante come sempre anche questa modifica. Per quanto riguarda i documenti in PDF, come da te riportato, invece ho preferito inserire un piccolo script che, trovando tutti i .pdf pubblicati nel blog, li rimanda, dal semplice click sul documento stesso, a un sito a scelta per la lettura online, in modo da essere fruibile anche per chi non avesse Acrobat sul pc e che non avesse voglia di perdere tempo a copiare e incollare il link.

A parte ciò, scusa l OT, volevo chiederti se potresti scrivere un breve tutorial per la spedizione di cartoline personalizzate dal proprio blog senza servizi esterni. Click su un'immagine e parte la mail con la stessa al suo interno.. forse chiedo troppo. Cmq alla prox e grazie. :D

Mr.Nessuno ha detto...

Ciao Orazio,
io uso 2 schermi, quindi non mi serve la possibilità per la stampa, ma, in considerazione che ad avere più di uno schermo siamo una manciata, direi proprio che dovresti inserire questa possibilità: uno può stampare il tuo post, poi mentre modifica il template segue quanto stampato e prende il codice dal tuo blog nel momento in cui gli serve...direi proprio che dovresti implementare la modifica appena finisci di leggere questo commento!!!

Ciao, otiima mod. come le altre del resto :-t

Iole ha detto...

Ciao Tenebrae,
controllando i log delle visite, ne ho viste diverse provenienti dal tuo blog allora mi sono detta "vuoi vedere che sono stata nominata di nuovo da Tenebrae!!!" e infatti è così.
In effetti anche a me la richiesta della stampa dei post è stata fatta dall'autrice di un blog di cucina. Con un po' di ingegno sono riuscita a creare la funzione javascript per la stampa (in fondo è il mio lavoro) ma senza i tuoi post non sarei mai riuscita a mettere mano al template.
Quindi sono io che devo ringraziare te :-*

D1m1tR1 ha detto...

Hey tenebrae !
Io avrei un problemino con il mio nuovo template...
be vedi non riesco ad trovare la stringa < div class = 'post hentry

Andrea ha detto...

Un ringraziamento sia ad Orazio che a Iole.
Molto carina come applicazione e credo utile per molti blog. Quando si apre la pop up però c'e' poca intuizione di dove dover cliccare per poter stampare, in quanto il mouse non cambia forma al passaggio sull'immagine della stampante.

Saluti d'oltreoceano

sabri ha detto...

Ma grazie! Ogni volta dovevo fare un gran casino: preparare un pdf della ricetta, caricarlo su issuu e poi inserire il link nel post. Adesso provo a fare le modifiche.

Stefania ha detto...

Carissimo Tenebrae,
appena ho visto questo post, cioè in pausa pranzo, mi sono detta, oggi non pranzo e metto la stampantina...purtroppo anche se la base del mio blog è minima non trovo la stringa < div class = 'post hentry
quella più simile (anche sbirciando il blog di Iole è:

div class='post-body' expr:id='"post-" + data:post.id'

puoi aiutarmi?
Grazie
Stefania

GabyPixar ha detto...

A me non si vede l'icona della stampante ma solo Stampa Post. Che ho sbagliato?

sabri ha detto...

Fatto, grazie mille. Ah ti avevo linkato già da un po', colgo l'occasione per dirtelo. Ciao

BU ha detto...

Cioa, grazie innanzitutto cercavo da tempo questa funzione. ho seguito di pari passo circa 5 volte riprovando, alla fine blogger dice che manca un > o < ...e di controllare! Ho cercato di capire se era un mio errore e nella fretta cancellavo qualcosa, ma dopo 5 vole mi arrendo! Tu che dici? Io uso firefox 3.5 c'entra qualcosa? Grazie ancora!

Alex Nevskij ha detto...

Salve.
Siamo un circolo politico, volevamo ringraziarti perché grazie al tuo blog abbiamo realizzato il nostro blog, puoi visitarlo al all'indirizzo www.prcserrenti.tk.

alexs ha detto...

ciao tenebrae, oggi si è verificato un altro mistero, sono andata ad applicare la possibilità di stampa sul mio blog e inevitabilmente mi appare questo messaggio

Non è stato possibile analizzare il tuo modello, in quanto non è strutturato correttamente. Assicurati che tutti gli elementi XML presentino il tag di chiusura richiesto.
Messaggio di errore XML: Element type "div" must be followed by either attribute specifications, ">" or "/>".

ho provato più volte ma niente, sono andata sul blog di iole e ho provato lì ma niente, lo stesso risultato.... :-o come mai?
poi ti ricordi il problema delle faccine che mi sono venute in verticale? oggi ho applicato un nuovo contatore, nel disegno era in orizzontale e mi è venuto in verticale anche questo :-/ avrò involontariamente spostato qualche cosa io?
grazie ancora e ciao
Alessandra

Tenebrae ha detto...

bene, allora aggiungerò anche in questo blog la possibilità di stampare i post :)

@paolo: non conosco servizi che permettano di farlo... se li trovi tu magari fammelo sapere

@iole: caspita, è pericoloso lasciarmi bacetti nei commenti, ragazza... mia moglie è sempre in agguato b-( siamo pari allora, dai ;)

@dimitri: forse nel tuo caso si chiama un po' diversamente, dovresti provare a cercare la parola hentry e vedere che trovi

@andrea: sono d'accordo con te, magari chiederò a iole o studierò io stesso qualcosa di alternativo

@stefania: brutto saltare la pausa pranzo per poi vedere vanificati i propri sforzi :( mandami in posta il template, vorrei studiarlo per capire come risolvere il problema in questi casi

@gabypixar: strano, guardando il codice sembra tutto a posto, forse qualcosa va in conflitto... anche a te chiedo di mandarmi il template, affinchè possa darci un'occhiata

@BU: no, non dovrebbe centrarci firefox, sembra più che altro un problema di inserimento del codice nel punto sbagliato, forse dovuto a una struttura diversa del template... dovresti assicurarti di non interrompere nessuna catena di < e >

@alex: grazie a te!

@alexs: ho appuntato il tuo problema, anche nel tuo caso: mi mandi il template?

mi aspetta una bella spulciata di codice :)

BU ha detto...

...grazie, ho riprovato, nulla...ho lo stesso problema di alexs

- ha detto...
Questo commento è stato eliminato dall'autore.
mary47 ha detto...

Ciao Tenebrae, commento qui anche se non è la sezione giusta, sempre per via delle emoticon che non appaiono una volta commentato (c'è si la finestra con tutte le faccine, copio incollo i caratteri ma non appaiono) .
Sono una rompiscatole vero??
Ti chiedo scusa e ti ringrazio molto!! ~x( ~x( ~x(

Iole ha detto...

Prometto che non lascerò più bacetti nei commenti!
Anche il mio ragazzo è molto geloso b-(

- ha detto...
Questo commento è stato eliminato dall'autore.
admin ha detto...

Salve ragazzi, io ho un blog sull'iPhone: iPhoneSuite.it e cerco lettori interessati per alimentare il blog con news, update, applicazioni, giochi ed altro per iPhone e iPod Touch!

Entrate nel blog, commentate, inviate i vostri articoli e iscrivetevi ai feed per rimanere costantemente aggiornati! ;)

Cialla ha detto...

Secondo me avere la versione stampabile anche nel tuo blog non sarebbe utile deppiu'!!!!! :D

giovanna ha detto...

ciao Orazio,
mi pare una modifica interessante, utile per i miei ragazzi....
grazie!
vado a modificare!:-)
Sì, secondo me sarebbe utile anche qui da te la possibilità di stampare.
un saluto
g

giovanna ha detto...

fatto! :-)
andato tutto ok
ri-grazie!
g

Andrea ha detto...

Mi hai dato una mano in molte occasioni ed ora è giunto il momento che contraccambi la tua gentilezza e disponibilità.

Nel mio commento precedente ti avevo chiesto come poter rendere attivo il link della stampante della pop up passandoci su con il mouse.
Ci sono riuscito modificando il codice del PASSO 4 nel seguente modo:

Da inserire tra "script" e "/script"

function stampaPostCompleto(divId,link) {
var postContent = document.getElementById(divId).innerHTML;
stampa(link+postContent);
}
function stampa(html) {
var printWindow = window.open("","printPost","top=100,left=200,width=600, height=400,scrollbars=yes,status=no,menubar=no,toolbar=no,locations=no");
printWindow.document.open();
printWindow.document.write('<a href="#" onclick="window.print();"><img src="http://lh4.ggpht.com/_fyUYhNUOXMw/Sg2XCP2OJaI/AAAAAAAAATo/vW0r9tXrpzU/printer.gif" alt="" border="0" /></a> <a href="#" onclick="window.print();">Stampa il post</a> <br /> <br />' + html);
printWindow.document.close();
}


A fianco all'icona della stampante ho aggiunto di nuovo la dicitura "Stampa il post" perchè mi è sembrato più completo ma si può logicamente omettere.

L'ho testato su Firefox 3.5, Internet Explorer 8 e Google Chrome 2.0.

Ancora un ringraziamento e alla prossima! ;)

Saluti d'oltreoceano

Andrea ha detto...
Questo commento è stato eliminato dall'autore.
Andrea ha detto...

ops... purtroppo il codice viene modificato una volta che commento ma si può riconvertire con la famosa pagina http://www.blogcrowds.com/resources/parse_html.php

mi sono dimenticato anche di postare un esempio:
http://itinerarimessicani.blogspot.com/2009/07/barrancas-del-cobre.html
a piè di pagina

Matteo Enrico ha detto...
Questo commento è stato eliminato dall'autore.
Matteo Enrico ha detto...

Ti ringrazio tantissimo per questa applicazione, però (ahimè)ho lo stesso problema si alexs e BU...
come possiamo risolvere la questione?

Grazie mille anticipatamente!

Tenebrae ha detto...

mi sono stati mandati i template che ho chiesto, purtroppo non ho avuto tempo di guardarli, ma appena lo farò vedrò come risolvere i problemi e ne darò indicazione a tutti

e al più presto farò la modifica anche qui!

@andrea: ma grande! speriamo che diventi una moda, quella di mandarmi versioni migliorate delle modifiche, sarebbe davvero comodo per me :)

appena potrò verificherò il codice che mi ha incollato e lo integrerò nel post (o magari ne farò uno a parte)

grazie!

€llY ha detto...

Ciao Orazio, ho provato anche io ma ho lo stesso problema di alexs, cioè :Non è stato possibile analizzare il tuo modello, in quanto non è strutturato correttamente. Assicurati che tutti gli elementi XML presentino il tag di chiusura richiesto.
Messaggio di errore XML: Element type "div" must be followed by either attribute specifications, ">" or "/>".

Come devo fare? Mi piacerebbe tanto poter aggiungere il link per stampare....:(

Ti posso mandare anche il mio template????

ventopiumoso ha detto...

ciao post (e blog) veramente molto utile.
ora vedo se riesco :)
saluti
ps: ti ho linkato, subito in alto a dx!!

ventopiumoso ha detto...

ciao ho apportato le tue modifiche ma non riesco a salvarle, mi compare il messaggio che non tutti i div sono stati chiusi..

in effetti nel passo 1 se cerco

div class='post hentry'

non lo trovo, ma trovo bensì

div class='post hentry uncustomized-post-template'

allora ho fatto le sostituzioni che hai detto cancellando

uncustomized-post-template

no, eh!?

uhm..

saluti!

klick ha detto...

@ ventopiumoso

non devi cancellarlo, ma aggiungerlo, così

div class='post hentry uncustomized-post-template' expr:id='"post-" + data:post.id'

Milla ha detto...

Utilissimo, modifica veloce e veramente utile! Grazie

EssenZadiCanneLla ha detto...

grazie Orazio...aggiunto.

cavoliamerenda ha detto...

questa è l'unica cosa dei tuoi tanti consigli utili e messi in atto che proprio non mi funziona, eppure ho un Minima, non dovrebbe dare problemi... secondo te che può essere?

Wolfango Free ha detto...

Certo che si, così potremmo farci un picolo archivio senza dover aprire un interminabile fila di tab nei browser, che ralentano non poco la macchina. Ciao e grazie dei mille consigli. Che faremmo senza te! :-t

Chiara ha detto...

ciao, sono nuova nel mondo dei blogger e desidero anche io avere la funzione Stampa il post.Ho provato e riprovato le tue istruzioni ma mi appare sempre al momento di salvare la scritta:
Non è stato possibile analizzare il tuo modello, in quanto non è strutturato correttamente. Assicurati che tutti gli elementi XML presentino il tag di chiusura richiesto.
Messaggio di errore XML: Element type "div" must be followed by either attribute specifications, ">" or "/>".

Onestamente non so come uscirne, puoi darmi una mano?Grazie infinite

Anastasia ha detto...

Orazio... grazie mille, ho fatto anche io questa modifica! Lo sai che i miei lettori mi chiedono come ho fatto a mettere le faccine nei post del blog? E ovviamente la risposta è sempre una sola... MERITO DEL GRANDE ORAZIO! (lo dico qui: http://anastasiagrimaldi.blogspot.com/2010/04/la-mia-egyptian-queen-faraona.html)
Ti faccio SEMPRE PUBBLICITà EH, eh ^_*!
Ah... so che è una scemata, ma è da un sacco che ti ho aggiunto ai miei link, ed ho anche il tuo antipixel nel blog, mi piacerebbe se mi aggiungessi ai siti che ti linkano e sarebbe un onore immenso averti tra i miei sostenitori... vuoi?! Ecco il link del mio blog:
http://anastasiagrimaldi.blogspot
Grazie di cuore! A presto Any

Nel cuore dei sapori ha detto...

Ciao! Anche io ci ho provato e mi esce lo stesso problema di Chiara (penultimo messaggio) bho, non vorrei combinare pasticci.

Cucina Amore Mio ha detto...

Grazie!!!!!!
Posso stampare i miei post, e io sono di "legno", di "ferro zincato", completamente "a"tecnologica (non so neanche come faccio ad avere un blog (www.cucinaamoremio.com - si lo so, non è un indirizzo da blog), ma con il tuo preziosissimo (in questo momdo di ”ma è facilissimo!") aiuto, sono riuscita anch'io a far stampare le mie ricette.
Sarei moltoo lieta di ricevere una tua visita (nel blog, la casa è inguardabile).
Sai, ora si può stampare!
Io di sicuro ti verrò a trovare di nuovo (ci sono altre cose che non riescco a fare nel mmio blog, ma ora Neury, il miop neurone, è un poco affatticato per il troppo impegno, appena si riprende, paasso).
Ciao.

michela ha detto...

ciao vorrei sostituire il template del mio blog già attivo da qlc mese, con uno che mi piace da matti, ma ho paura che sostituendolo spariscano tutti i miei post e i gadget aggiunti...come posso fare? grazie. michela

Nel cuore dei sapori ha detto...

uff,ho lo stesso problema di ventopiumoso e di chiara,non riesco a capire cos'è che non è "chiuso",bhò

Francesco Magno ha detto...

anche a me come ad altri mi esce la scritta Non è stato possibile analizzare il tuo modello, in quanto non è strutturato correttamente. Assicurati che tutti gli elementi XML presentino il tag di chiusura richiesto ecc. ho cercato di risolvere ma sembra quasi impossibile!

chenlina ha detto...

CHENLINA20160308
designer handbags
nike uk
louis vuitton outlet stores
coach outlet
louis vuitton handbags
louis vuitton outlet stores
michael kors outlet
ray bans
michael kors outlet clearance
ghd hair straighteners
gucci outlet
christian louboutin shoes
michael kors outlet
prada handbags
ugg on sale
michael kors bags
kate spade handbags
ralph lauren
canada goose outlet
coach outlet store online
nike blazers uk
cheap oakley sunglasses
air jordan 4
michael kors outlet clearance
michael kors bags
canada goose outlet
coach factory outlet online
ray ban sunglasses
oakley sunglasses
michael kors outlet
ugg sale
longchamp outlet
jordan retro 8
louis vuitton
nike roshe run
ugg boots
cheap jordans
ugg boots outlet
louis vuitton bags
tod's shoes
AS

林剑伟 ha detto...

oakley store online
tiffany and co uk
mlb jerseys authentic
nike kobe sneakers
tiffany and co outlet
http://www.2016michaelkorsoutlet.us.com
cheap oakley sunglasses
toms outlet
tiffany and co
http://www.chromeheartsonline.us.com
michael jordan shoes
http://www.huarachesshoes.co.uk
oakley vault
retro jordans
cheap real jordans
kobe byrant shoes
oakley sunglasses
fitflops outlet
tiffany and co
ray ban sunglasses outlet
michael kors handbags,michael kors handbags outlet,michael kors purses outlet,cheap michael kors handbags,cheap michael kors purses
chrome hearts
Michael Kors Outlet Store
Michael Kors Handbags
air jordan retro
michael kors outlet online
kobe shoes
kobe byrant shoes
ralph lauren uk
http://www.raybanglasses.in.net
nike zoom kobe
http://www.huarachesshoes.uk
air jordan
http://www.rayban-sunglasses.uk
oakley sunglasses

Meiqing Xu ha detto...

michael kors bags
ralph lauren outlet
cheap oakley sunglasses
rolex watches
louis vuitton outlet
red bottoms
levis outlet online
ray ban sunglasses
cheap uggs
christian louboutin outlet
20161230caiyan

chenmeinv0 ha detto...

prada outlet
ed hardy
louis vuitton outlet
michael kors handbags
ugg boots
rolex watches
uggs outlet
louis vuitton outlet
ray ban canada
gucci outlet
20173.4chenjinyan


Prima di lasciare un commento, leggete qui

Posta un commento