Redes sociales (Social Bookmarking) en Blogger
Me preguntan como poner el icono de redes sociales o social bookmarking en cada uno de nuestros post, de modo que sí alguno de nuestros usuarios utiliza uno de ellos, tenga el link para agregarlo a sus favoritos de forma rápida.
Ahora vamos a ver como ponerlos:
- Entra a la pestaña “Plantilla” o también llamada “Diseño” desde el escritorio y después a la opción “Edición de HTML” donde activamos la casilla “Expandir plantillas de artilugios”
- Buscamos el siguiente codigo
<p class='post-footer-line post-footer-line-3'/>
3. Sustituye esa linea con el siguiente código:
<p class='post-footer-line post-footer-line-3'>
<div class='rsociales'>
Agregar a marcadores favoritos:
<ul>
<li><a expr:href='"http://www.technorati.com/faves?add=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Technorati' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgx91dCGriXSjPRj_SLD-G0eA7E54Jw70rUg1H58lo0Hyg-hh2SCLtwYGw_6-za7upuILQvld7hAGuJ_IfymlelDtVIjnmNT2ofWyg6FxRHzAYayKPwM-zx_-C2xG5gHo150UvwHJ2guvE/s1600/technorati.gif'/></a></li>
<li><a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Del.icio.us' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgy_7LYHZb19D-5xInjCX-XELHh7YQK7LfBGxJF4QtahIW67auPq3rpJmNKO0XX2XiWB8cs3vO82X9QtKZg01pcVpEiOJjwiPc41H8340FpKjNSygeGPoqlTfymV_dg4BoYjp3sxVy_dxE/s1600/delicious.gif'/></a></li>
<li><a expr:href='"http://digg.com/submit?phase=2&amp;url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a DiggIt!' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiKrRLjpvvhCr7ZNBc28VRJMrDYZfmWk40nzwiHflycy8IzAwVtVMdUGaNXZhtHxsJLrNN8QVBFk8ECsPJbSLGjlY2mniGZWJprjNxixySIzMYMWaOBVh3TV1Cw_du5aUnzKpDMbz5NlIY/s1600/digg.png'/></a></li>
<li><a expr:href='"http://myweb2.search.yahoo.com/myresults/bookmarklet?u=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Yahoo!' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiq-xQfqukyxgCs-csmQJcPukcL22BvfV2k_H-YCAO0k0Pm43jd2d6VliC64WwVXbxJtuI7NnW-AcPHu0zc2a7kt_vZWGK5sicm3tBnao7Q0PbS2rmQdlgTssunNmMjSiConHkurRbzJsw/s1600/yahoo.png'/></a></li>
<li><a expr:href='"http://www.google.com/bookmarks/mark?op=edit&output=popup&bkmk=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Google' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjUFWr6XOhHsmBzBtyupgiuTBtdPsur3m-fxMgPj1XSFfI06l_XTuWm95gFvy_HRAunvHjZb8y6I5qlqIbquHWx-ZpzIcC8UQEUD2B-6zyNcUsy3zG1G7-AFaOSU4OyHPDahyphenhyphenrRzuPxysQ/s1600/google.gif'/></a></li>
<li><a expr:href='"http://meneame.net/submit.php?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Meneame' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtr7lNVJCvqI8WkNQuOZ5u-opRhBrW3UhXm3PvdtDpHK5ZrYdwEFRr6X8eP3sOAvIpfYfXpeM-_NYic8Xd-Vpg0ovn4HEhW_NkwayF_hXHX6u_Vm_5CyZGZ84tTIpfSrnfScihIwxSNUs/s1600/meneame.png'/></a></li>
<li><a expr:href='"http://www.furl.net/storeIt.jsp?u=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Furl' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjkG74SBa87mKLzA1Th-Vgx1juPUSLqKnFLfDiqyHlzyYhZqe_2AsgXuBDlZMmmm769JHnYbLwUb0yEu55vmoc6GN3vNTsUVoq4VOpUz5r45KNfIWS41xKPNsJrop_nyl2TphyphenhyphenKp8iepT4/s1600/furl.png'/></a></li>
<li><a expr:href='"http://reddit.com/submit?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Reddit' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFehWk0DDszzVTpUYke-Jxae7-Ib4NtYLyd-En97UiU4nG1LPzhwShck_er155k8ReVFTVTlSf7timbvh2HLGx-vSwsIt59oJ6JUCsOk56gKIUKa6AcskRPQd9OZr2KRqflFsO985bgWo/s1600/reddit.gif '/></a></li>
<li><a expr:href='"http://ma.gnolia.com/beta/bookmarklet/add?url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Magnolia' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMTaPDmf7LpqRpuljfF_IUo8qkZVe-wePxgCwIU5TabxpXtBASOA8KBkAXJFviWj9JIiFZEjOvYKMtbIGoQbWBEF77TFTy2K2AreEPjSOSCHz-rGNXtIrbWHYLtu935foDfKQrvGhqDM8/s1600/magnolia.gif'/></a></li>
<li><a expr:href='"http://www.blinklist.com/index.php?Action=Blink/addblink.php&Description=&Url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Blinklist' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmjjzFslgS9N_cC9F2xsAzQqQLgZASniUyj3mcTBNoRphDftBBawo0mUqUCKk1TB9wbNe6GYH0zZHttIcXP6TdNwJNhpxUHzYyDdVh_byGqHz3GDUxCkVzZA3zbbwVuGvcwo27tP472Zc/s1600/blinklists.gif'/></a></li>
<li><a expr:href='"http://blogmarks.net/my/new.php?mini=1&simple=1&url=" + data:post.url + "&title=" + data:post.title' target='_blank'><img alt='Agregar a Blogmarks' class='rsociales-sobre' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgu0iaq1GpPiwNiu-87OhEjY_XRcL6DqV5brRbOif3-bJ2cCWCFg4o_NEjJnhXmMnSeWbOqJElEBsfMe_cBcNJQOZEjHLTenTPrJICZ5Iomw1uO-NYFWETVJ12F2J6md_agD_zZGr083tc/s1600/blogmarks.gif'/></a></li>
</ul>
</div>
</p> Estas son, a mi parecer, las redes sociales más populares.
4. Ahora busca el código:
]]></b:skin>
Y justo arriba pega lo siguiente:
.rsociales ul {
display:inline;
margin:0pt !important;
padding:0pt !important;
}
.rsociales li {
background:transparent none repeat scroll 0%;
display:inline;
list-style-type:none;
margin:0pt;
padding:2px;
}
.rsociales img {
border:0pt none;
float:none;
margin:0pt;
padding:0pt;
}
.rsociales-sobre {
opacity:0.4;
}
.rsociales-sobre:hover {
opacity:1;
}
display:inline;
margin:0pt !important;
padding:0pt !important;
}
.rsociales li {
background:transparent none repeat scroll 0%;
display:inline;
list-style-type:none;
margin:0pt;
padding:2px;
}
.rsociales img {
border:0pt none;
float:none;
margin:0pt;
padding:0pt;
}
.rsociales-sobre {
opacity:0.4;
}
.rsociales-sobre:hover {
opacity:1;
}
Comenta
Saludos
/*Anthony*/
Enlaces para compartir en tu blog o pagina web.
![[1] Crear una calculadora simple en Microsoft Visual Studio 2010 (El Diseño)](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihK06o3qxRgndTN83gagg5xMy8Y0s4rg9GCiBabAgKpoFDpCUkp8Al_rfR6HKBuaEHmmst0IOnxKE7V2kHfX63AoPgzF_mZQ-nZ-Bkj4vdbhyphenhyphenPMU_bP1Dk_0ZJf_4_NgJh7dzseZHN7Okh/s72-c/calculadora.JPG "[1] Crear una calculadora simple en Microsoft Visual Studio 2010 (El Diseño)")
No hay comentarios :
Publicar un comentario