Template x blogger: Feed

In questo post voglio spiegarti come inserire all'interno del tuo blog su blogger una bellissima e utilissima sezione per la ricerca, per l'iscrizione ai feed, l'iscrizione alla mail, i link al tuo profilo di Twitter e facebook e i pulsanti per la condivisione in tutti i principali social network (Digg,Twitter,Facebook,Stumbleupon,Delicious).

Il tutto in modo quasi automatico, basta solamente cambiare qualche parte di codice.

Come inserirla:

1- Vai su Design --> modifica HTML

2- Espandi i modelli Widget e fai un backup del template

3- Ora cerca il tag </head> e incolla appena prima il codice che trovi qui:

<style type="text/css">
.subbox{width:305px;border:0 solid #141414;overflow:hidden}
.addthis_toolbox{padding:15px 0 5px 0;text-align:center}
margin:0 4px 0 4px;padding:0}
.addthis_toolbox .custom_images a:hover img{opacity:1}
.
.addthis_toolbox .custom_images a{width:32px;height:32px
;addthis_toolbox .custom_images a img{opacity:0.85}
padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}.rssbox:hover{border:1px solid #92aed1}





.rssbox a{c
.rssbox{background:#f7f6f6;border:1px solid #ccd1d7
;olor:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}.rssbox a:hover{color:#7c8a9b;text-decoration:underline}
s:10px;border-radius:10px;width:125px}
.emailsbox:hover{border:1px solid #92aed1}
.emailsbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}.emailsbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radi
u.emailsbox a:hover{color:#7c8a9b;text-decoration:underline}
.twitterbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.twitterbox:hover{border:1px solid #92aed1}
er-radius:10px;-webkit-border-radius:10px;border-radius:10px;width:125px}
.facebookbox:hover{border:1px solid #92aed.twitterbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.twitterbox a:hover{color:#7c8a9b;text-decoration:underline}
.facebookbox{background:#f7f6f6;border:1px solid #ccd1d7;padding:5px 10px;margin:10px 0 0 0;-moz-border-radius:10px;-khtml-bor
d1}
.facebookbox a{color:#7c8a9b;text-transform:uppercase;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif}
.facebookbox a:hover{color:#7c8a9b;text-decoration:underline}
#search{width:290px;padding:2px 2px;background:#f7f6f6;border:1px solid #ccd1d7;height:28px;margin-top:0;margin-left:5px;display:inline;float:left}
#search:hover{border:1px solid #92aed1}
#search form{margin:0;padding:0}
#search fieldset{margin:0;padding:0;border:none}
#search p{margin:0;font-size:85%}
#s{width:200px;margin:0 0 0 0;padding:5px 5px 5px 5px;border:none;font:normal 80% &quot;Tahoma&quot;,Arial,Helvetica,sans-serif;color:#000;float:left;background:#f7f6f6;display:inline}
input#searchsubmit{float:right;display:inline;margin:0 0 0 0;height:28px;background:#b2b2b2;color:#000;border:0 solid #222}
</style>

4- Salva

5- Ora vai su Design --> Elementi pagina e aggiungi dove preferisci un elemento tipo html/javascript

6- Incollaci all'interno questo codice:

<div class="subbox">
<div id='search' style='display:inline;'>
<form action='/search' id='searchform' method='get'>
<input id="s" name="q" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Search...&quot;;}" onfocus="if (this.value == &quot;Search...&quot;) {this.value = &quot;&quot;;}" type="text" value="Search..." />
<input id="searchsubmit" type="submit" value="Search" /></form>
</div>
<table><tr>
<td><div class="rssbox">
FEEDBURNER-ID" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4juf-jg11bZgRNPIcH8snDlE85IgUuxgDHiTTaSO9uxjWqGz9Fg7j_9XQajwlfh3Dp_RhEQGWmahHT9EuCyAhZUpXD2hZ5IgfwBtFGGx0DrSi16e2hgMoVG8cou6h7VomqvG1H1CtgBfU/"  alt="RSS Feed" title="RSS Feed" style="vertical-align:middle; margin-right: 5px;border:none;"  /></a><a href="http://feeds.feedburner.com/FEEDBURNER-ID" target="_blank" rel="nofollow">RSS Feed</a><a href="http://feeds.feedburner.com
/
</div></td>
<td><div class="emailsbox">
a/mailverify?uri=FEEDBURNER-ID" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkUy4SxWgasWF0Yf1VZUWh7HW6pISR03UUvzkTavlMMcCWNOvBfeHdNVYkvkYTwI34pog83MWSYBUKyk0uz4lo-nco9m8xybQofMXCuuIfFoIyAdMyxpp2ja_OhoHbRre7WfOLn5kN_ATY/"  alt="EMail Feed" title="EMail Feed" style="vertical-align:middle; margin-right: 5px;border:none;"  /></a><a href="http://feedburner.google.com/fb/a/mailverify?uri=FEEDBURNER-ID" target="_blank" rel="nofollow">EMail Feed</a><a href="http://feedburner.google.com/fb
/
</div></td>
</tr><tr>
box">
<a href="http://twitte<td><div class="twitte
rr.com/TWITTER-USERNAME" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEilIq8EfXH2e6dufs-P2_JEGrQEOu3ykY3YnFSME-R2CIYKTzdlJ8hPkcW5_-Li9qDi6CSygqJG-lERKsG8IblJEQeiIpJvMFEMACzzZBeVoGlVKtlkn4qHPhq94rEglsTbgY65ifQodDjZ/"  alt="Twitter" title="Twitter" style="vertical-align:middle; margin-right: 5px;border:none;"  /></a><a href="http://twitter.com/TWITTER-USERNAME" target="_blank" rel="nofollow">Twitter</a></div></td>
<td><div class="facebookbox">
FACEBOOK-USERNAME" target="_blank" rel="nofollow"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCoXZLd6aX2gMzslDNRjWVGkLc2PgFY_mRP5IO4bu6R27Wda9ayCAoVGj-KwD8QAf05zKy_FTGMsQgO5MivYwD55Z15jCLMx4XrYrXA_BjYXn55PVLNeTvytasQtQXrqJKwviCBst0D13r/"  alt="Facebook" title="Facebook" style="vertical-align:middle; margin-right: 5px;border:none;"  /></a><a href="http://www.facebook.com/FACEBOOK-USERNAME" target="_blank" rel="nofollow">Facebook</a><a href="http://www.facebook.com
/
</div></td>
</tr></table>
<p style="display:none;" align="center">Widget by <a href="http://www.bloggertipandtrick.net/" target="_blank">Blogger Tips And Tricks</a></p>
<div class='addthis_toolbox'>
<div class='custom_images'>
s' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjlL9m4inWH9hvgn2ogPGPyMMVMuuxHJBzxgwHnq1CtOdXJ2FarQ3nx1HdGNxeVOtlZadMCy4eYNe2FLX7-oTSFwNbo09k3X4sMPwUySXoSsEpoavndWIUldEKW36HOXUw0vMC4hl4EDw/' width='32'/></a>
<a class='addthis_button_facebook'><img alt='Fa<a class='addthis_button_twitter'><img alt='Twitter' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbPMj4euVArEhVxBA-YSIBScf_VJWHtN-CC6rNsyIhMboLjzVDA3waNvwn4vW2q-VBbgytlCpL39pIrVAKGavSQ-fLsbnpH-GDrmFyYNmahP_TzP-hR1HYyn1mzkp1EWNkUk4wdfNGQ9o/' width='32'/></a>
<a class='addthis_button_delicious'><img alt='Delicio
ucebook' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEQDhhcJFdjGULOEzudQxG148MKAvSw3fiJzSy3spEAsg-IMFbpWRetQW57SQwCNJSkKnwXSrWneUrhVyh13ohv3vMy3zP2bI_LF7QjexjpUaCd7MXS-W9EiovrryBIeub9p_whz7LqCs/' width='32'/></a>
<a class='addthis_button_digg'><img alt='Digg' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjemPhUuakwgpoMk_MdNaAaGYun6VkAuDitha_8q_QVKe6-Hd07d1I3JFd8JXe1_awFTBzQY0FW6MYf_1qQC5OGSxqkXAIq4JhJ4p7ghN8i6HU0WuyXZMlR8fK1xxuyRwgTXgr6tAstfHw/' width='32'/></a>
U/TIb9eJ5RTWI/AAAAAAAAB9c/tYvdT6xgaLw/favorites.png' width='32'/></a>
<a class='addthis_button_more'><img alt='More' height='32' src='http://3.bp.blogspot.com/_4HKUHirY_2U/TIb9egD8XSI/A<a class='addthis_button_stumbleupon'><img alt='Stumbleupon' height='32' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgifTZybwBa6MIJRwClB00TCiyVjJ5fTO6RxX6GjPBqHyED0IvKcDZ9MdyZFyWjt1HrQGsteqDDaPzgaA70wPKUEIl2DCsF1XXYailuYWNRWayHNkCRiAKx6kzQ0DGlLAtDvmYrEmdqLBk/' width='32'/></a>
<a class='addthis_button_favorites'><img alt='Favorites' height='32' src='http://2.bp.blogspot.com/_4HKUHirY_
2AAAAAAAB9k/rZY5eofO2SY/more.png' width='32'/></a>
</div>
<script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'/>
</div>
</div>

7- Sostituisci queste parti con i tuoi dati:

FEEDBURNER-ID con il tuo ID di feedburner.(Devi farlo 4 volte).

TWITTER-USERNAME con il tuo username di Twitter.

FACEBOOK-USERNAME con il tuo username di Facebook. Se non sai come trovarlo entra sul tuo profilo e copia l'URL; se vuoi puoi anche inserire l'URL ad una pagina specifica che hai creato tu.

8- Salva ed il lavoro è completo.

Se hai delle difficoltà scrivi un commento e ti risponderò in tempo record! :)

Nel frattempo... condividi l'articolo!

E' ormai nota l'importanza per i blogger di estendere la propria rete utilizzando anche tutti i vari social a disposizione. In Italia i più utilizzati al momento sono Twitter e Facebook e probabilmente google buzz tra qualche tempo entrerà a far parte di questa "cerchia ristretta".
Come cita anche tagliaerbe in un suo post di qualche tempo fa se usati nel modo giusto questi servizi possono diventare anche la prima fonte di traffico per un blog o sito e addirittura sopravanzare l'ormai leader indiscusso Google.
Ma gestire tutti i vari social, oltre al blog stesso, per chi ha poco tempo non è un'impresa facile. Ci viene quindi in aiuto un ottimo servizio, Twitterfeed.com, un servizio nato inizialmente per automatizzare i post su Twitter e poi esteso anche ad altri social network.