Inserire barra dei social alla fine di ogni singolo post

Per tutti quelli che volgiono inserire alla fine di ogni singolo post di blogger dei pulsanti di condivisione sui social più conosciuti, propongo un'ottima soluzione.



Il risultato è come quello che trovi alla fine dei miei post, una sequenza di immagini che si illuminano al passaggio del mouse.

Come inserirla:

1- Vai su Layout --> Modifica html ed espandi i modelli widget

2- Fai un backup del template



3- Cerca il tag </head> e appena prima incollaci il seguente codice di stile

/* Social Bookmarks
--------------------------------------------------- */
.title{
color: #363636;
font-family:Georgia, Times New Roman;
font-size: 20px;
font-weight: normal;
margin-bottom:5px;
}
.rsociales, .subs{
color: #666;
font-weight: normal;
font-size:0.9em;
border: 1px solid #cfcfcf;
width: 583px;
padding: 10px 10px 10px 10px;
margin-bottom:0px;
}
.rsociales ul, .connect ul, .subs ul {
display:inline;
margin-top:0pt!important;
padding:0pt !important; }
.rsociales li, .connect li, .subs li {
background:transparent none repeat scroll 0%;
display:inline;
list-style-type:none;
margin:0pt;
padding:2px; }
.rsociales img, .connect img, .subs img {
border:0pt none;
float:none;
margin:0pt;
padding:0pt; }
.rsociales-sobre { opacity:0.4; }
.rsociales-sobre:hover { opacity:1; }

4- Ora cerca il tag <data:post.body/>  e incolla subito dopo questo codice:

<span style='font-family:Arial, Helvetica, sans-serif; font-size:16px; font-weight:bold;'>Se ti è piaciuto l&#39; articolo... condividilo!</span>
<div><a expr:href='&quot;http://feeds.feedburner.com/IL_TUO_ID&quot;' target='_blank'><img alt='Iscriviti ai feed' border='0' class='rsociales-sobre' src='http://i256.photobucket.com/albums/hh174/mozzy9/RSS-5-1.png'/></a>
<a expr:href='&quot;http://feedburner.google.com/fb/a/mailverify?uri=IL_TUO_ID&quot;' target='_blank'><img alt='Iscriviti via mail' border='0' class='rsociales-sobre' src='http://i256.photobucket.com/albums/hh174/mozzy9/EmailRSS-1-1.png'/></a>
<a expr:href='&quot;http://www.google.com/reader/link?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title + &quot;&amp;srcTitle=&quot; + data:blog.title+ &quot;&amp;srcURL=&quot; + data:blog.homepageUrl ' target='_blank'>
<img alt='Buzz It' border='0' class='rsociales-sobre' src='http://i256.photobucket.com/albums/hh174/mozzy9/25yy8pd-1.png'/></a>
<a expr:href='&quot;http://oknotizie.alice.it/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='vota su OKNotizie' border='0' class='rsociales-sobre' src='http://i256.photobucket.com/albums/hh174/mozzy9/oknotizie-1.jpg'/></a>
<a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' target='_blank'><img alt='Agregar a Technorati' border='0' class='rsociales-sobre' src='http://2.bp.blogspot.com/_sunpK_FtO1E/Ssw9xEfnVJI/AAAAAAAAATM/NJoWIHqyRAs/s1600/technorati_32.png'/></a>
<a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Agregar a Del.icio.us' border='0' class='rsociales-sobre' src='http://3.bp.blogspot.com/_sunpK_FtO1E/Ssw9LEic-AI/AAAAAAAAASE/l25J2XE6NE8/s1600/delicious_32.png'/></a>
<a expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot;  + data:post.url' target='_blank'><img alt='Agregar a DiggIt!' border='0' class='rsociales-sobre' src='http://1.bp.blogspot.com/_sunpK_FtO1E/Ssw9LQPZ_bI/AAAAAAAAASM/3wodeV2Dlfo/s1600/digg_32.png'/></a>
<a expr:href='&quot;http://myweb2.search.yahoo.com/myresults/bookmarklet?t=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Agregar a Yahoo!' border='0' class='rsociales-sobre' src='http://4.bp.blogspot.com/_sunpK_FtO1E/Ssw9pFA99hI/AAAAAAAAATE/z3YVpemgXUQ/s1600/yahoo_32.png'/></a>
<a href='#' target='_blank'><img alt='Agregar a Google' border='0' class='rsociales-sobre' src='http://2.bp.blogspot.com/_sunpK_FtO1E/Ssw-NLNvvsI/AAAAAAAAATU/AeycHme5lrE/s1600/google_32.png'/></a>
<a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;t=&quot; + data:post.title' target='_blank'><img alt='Agregar a facebook' border='0' class='rsociales-sobre' src='http://1.bp.blogspot.com/_sunpK_FtO1E/Ssw9Mbxdb9I/AAAAAAAAASc/0-vXuuJEnk8/s1600/facebook_32.png'/></a>
<a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Agregar a twitter' border='0' class='rsociales-sobre' src='http://4.bp.blogspot.com/_sunpK_FtO1E/Ssw9o4xCM5I/AAAAAAAAAS8/YXxhdYoTYhA/s1600/twitter_32.png'/></a></div>

5- Sostituisci i tuoi link per i feed e salva

Altri articoli simili:



7 commenti:

ciao grazie del post ma ho provato sia con la prima opzione che con la seconda e non funziona. altre idee? nel tuo e' cosi' perfetto!!
grazie per ogni tuo aiuto :-)

Ciao!
Cosa intendi per ho provato sia con la prima che con la seconda opzione?

che ho provato ad inserire la barra dei social networks come indicato dal tuo post ma non riesco a farla funzionare...

riprovando piu' volte questo e' l'errore che mi da
"Your template could not be parsed as it is not well-formed. Please make sure that all XML elements are closed properly.
XML error message: Element type "a" must be followed by either attribute specifications, ">" or "/>"."

ciao
ti leggo spesso e quando posso cerco di applicare tuoi suggerimenti ...ma questa volta non funziona neppure a me! l'eerore che mi da è lo stesso che da a Marta ...sembra che qualche tag "a" non gli piaccia!
Eppure a rileggere sembra a posto...

SerenaMente

Ho cambiato il codice. Preovate a incollare questo nuovo e fatemi sapere se vi da ancora problemi. In teoria dovrebbe andare!
A presto