Com posar a Blogger els enllaços a la Tafanera o a Menéame

Fa un parell de dies vaig rebre aquest mail al correu del bloc (si si, aquest que comença per "laveudet" i acaba amb "gmail.com" i que està disponible a la part dreta):

Hola!

Avui he descobert el teu bloc i m'he fixat que a sota de cada entrada, ofereixes al lector l'opció d'afegir la notícia a menéame, a la tafanera, etc. M'agradaria posar-ho al meu bloc (http://empremtes.blogspot.com), però no sé com es fa. És molt complicat?

Gràcies!

No és el primer cop que m'ho pregunten, així que he decidit publicar una petita explicació que vaig enviar a les felines amigues de Cat People fa uns mesos. Ho vaig extreure d'algun altre bloc però no me'n recordo de la direcció. Si l'autor llegeix aquest article, que posi un comentari i posaré una actualització amb la direcció immediatament.

Com afegir les icones de menéame a blogger

0.- L'explicació està plena de codi XML, no us espanteu. A més, Blogger no m'ho ha posat gaire fàcil, així que el format del codi no és precisament llegible.

1.- Aneu a "Plantilla-> Edición de HTML"

Accés al codi HTML

2.- Feu clic a "Descargar Plantilla Completa" i descarregueu-vos l'actual. sempre anirà bé tenir una còpia se seguretat per si alguna cosa surt malament.

Fer una còpia de seguretat

3.- Marqueu "Expandir plantillas de artilugios" per veure tot el codi de la pàgina.

Veure tot el codi HTML

4.- busqueu on posa quelcom de l'estil:

<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>
</span> </p>
<p class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data: label.url' rel='tag'><data:label.name/>
</a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span></p>
<p class='post-footer-line post-footer-line-3'/>
</div>
</div>
</b:includable>

5.- El codi que posareu serà

<br/>
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img align='absbottom' src='http://www.feedforall.com/delicious.png' style='border:none;'/></a>
<a expr:href='"http://meneame.net/submit.php?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img align='absbottom' src='http://img243.imageshack.us/img243/5545/meneame1vs2.png' style='border:none;'/></a>
<a expr:href='"http://tec.fresqui.com/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img align='absbottom' src='http://img110.imageshack.us/img110/6861/fresquiwo3.gif' style='border:none;'/></a>
<a expr:href='"http://latafanera.net/submit.php?url=" + data:post.url' target='_blank'><img align='absbottom' alt='Tafaneja aquesta notícia' src='http://latafanera.net/rebost/blogger-tafanera.gif' style='border:none;' title='Tafaneja aquesta notícia'/></a>

i anirà entre el "</b:if>" i el "</span></p>".

6.- Us quedarà més o menys així:

<!-- quickedit pencil -->
<b:include data='post' name='postQuickEdit'/>
</span> </p>
<p class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data: label.url'
rel='tag'><data:label.name/>
</a>
<b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>

<br/>
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img align='absbottom' src='http://www.feedforall.com/delicious.png' style='border:none;'/></a>
<a expr:href='"http://meneame.net/submit.php?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img align='absbottom' src='http://img243.imageshack.us/img243/5545/meneame1vs2.png' style='border:none;'/></a>
<a expr:href='"http://tec.fresqui.com/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img align='absbottom' src='http://img110.imageshack.us/img110/6861/fresquiwo3.gif' style='border:none;'/></a>
<a expr:href='"http://latafanera.net/submit.php?url=" + data:post.url' target='_blank'><img align='absbottom' alt='Tafaneja aquesta notícia' src='http://latafanera.net/rebost/blogger-tafanera.gif' style='border:none;' title='Tafaneja aquesta notícia'/></a>

</span> </p>
<p class='post-footer-line post-footer-line-3'/>
</div>
</div>
</b:includable>

7.- Deseu els canvis

Desa els canvis

8.- I ja hauria de funcionar

Tachan!

Per si no us n'heu adonat, tot els enllaços són iguals. Anem a veure quin és el format:

<a expr:href='" http://meneame.net/submit.php?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img align='absbottom' src='http://img243.imageshack.us/img243/5545/meneame1vs2.png' style='border:none;'/></a>

De cadascun dels article se n'agafa la url i el títol. Pel que a mi respecta aquesta codificació és errònia i hauria de ser:

<a expr:href='" http://meneame.net/submit.php?url=" + data:post.url + "&title=" + data:post.title + "' target='_blank'><img align='absbottom' src='http://img243.imageshack.us/img243/5545/meneame1vs2.png' style='border:none;'/></a>

Però al blog d'on ho vaig treure ho feien així i no filaré tant prim.

NOTA: no totes les plantilles de Blogger són iguals, i molt menys si ja heu fet canvis sobre l'HTML. És possible que us costi una mica localitzar on posar el codi.

NOTA: perquè els de Blogger posen tant difícil publicar fragments de codi font. Vull una etiqueta <code> o alguna cosa per l'estil ja!

ACTUALITZACIÓ: en un dels comentaris, el/la lector/a Hinfra ha comentat que falta un enllaç a remoume.net. Doncs bé, per afegir-lo només cal posar el codi.

<a expr:href='"http://remoume.net/submit.php?url=" + data:post.url' target='_blank'><img align='absbottom' alt='Remou aquesta notícia' src='http://remoume.net/bloc/images/ruc.gif' style='border:none;' title='Remou aquesta notícia'/></a>

just sota de l'enllaç a la tafanera.