El resultado es muy similar a este:
Añadiendo el footer en Blogger:
Paso 1: Añadiendo las secciones:
En ''Diseño | Edición HTML'' marcaremos ''Expandir plantillas de artilugios'', buscaremos la siguiente sección:
<data:post.body/>Justo debajo, pegaremos el siguiente código:
<b:if cond='data:blog.pageType == "item"'>
<div id='contenedor'>
<div id='compartir'>
<p>Compartir:</p>
<a class='twitter' expr:href='"http://twitter.com/home?status=" + data:post.title + ": " + data:post.url' rel='nofollow' target='_blank' title='Twittear'><img src='https://lh3.googleusercontent.com/-ZMNstTQBIDA/TYLOGEj41uI/AAAAAAAAAdM/n_4rUoHcKJo/s1600/twitter.png' width='20'/></a>
<a class='facebook' expr:href='"http://www.facebook.com/sharer.php?u=" + data:post.url+ "&title=" + data:post.title' rel='nofollow' target='_blank' title='Compartir en Facebook'><img src='https://lh4.googleusercontent.com/-CUtQ6kBQkTg/TYLOEdjw_AI/AAAAAAAAAdA/pHni6wywITA/s1600/facebook.png' width='20'/></a>
<a class='digg' expr:href='" http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Digg This'><img src='https://lh4.googleusercontent.com/-ovYjTuczvP8/TYLOBtxn9uI/AAAAAAAAAc4/ujelP_eOGkw/s1600/digg.png' width='20'/></a>
<a class='delicious' expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Delicious'><img src='https://lh3.googleusercontent.com/-1sMwHkUe9vU/TYLQmuhuhDI/AAAAAAAAAdU/ophW59l0LNU/s1600/delicious.png' width='20'/></a>
<a class='myspacee' expr:href='"http://www.myspace.com/Modules/PostTo/Pages/?u=" + data:post.url + "&t=" + data:post.title ' rel='nofollow' target='_blank' title='Compartir en Myspace'><img src='https://lh3.googleusercontent.com/-3XMmSAIqSqs/TUt-_5lsyzI/AAAAAAAAAGU/xBZu64-48S0/s1600/myspace.png' width='20'/></a>
<a href="javascript:popw='';Q='';x=document;y=window;if(x.selection) {Q=x.selection.createRange().text;} else if (y.getSelection) {Q=y.getSelection();} else if (x.getSelection) {Q=x.getSelection();}popw = y.open('http://www.blogger.com/blog_this.pyra?t=' + escape(Q) + '&u=' + escape(location.href) + '&n=' + escape(document.title),'bloggerForm','scrollbars=no,width=475,height=300,top=175,left=75,status=yes,resizable=yes');if (!document.all) T = setTimeout('popw.focus()',50);void(0);"><img src='https://lh5.googleusercontent.com/--XlBitL13CA/TUt-3Mh5MoI/AAAAAAAAAEw/TBRYqetuXB4/s1600/blogger.png' width='20'/></a>
<a class='fresqui' expr:href='"http://tec.fresqui.com/post?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank' title='Fresqui'><img src='https://lh3.googleusercontent.com/--W41bK3eeVI/TYLRpFtsaKI/AAAAAAAAAdc/evQOnl5TAi8/s1600/fresqui.png' width='20'/></a>
<p><label for="aa-url">URL para compartir:</label><br /><input size="40" readonly="readonly" onclick="this.focus();this.select();" type="text" id="aa-url" value="<data:post.url/>" /></p>
<div id='ab_shorturl'>
<form expr:id='"ab_short_holder_" + data:post.id'/></div>
<script type='text/javascript'>
acortador_url.init("ab_short_holder_<data:post.id/>","<data:post.url/>")
</script>
<p>Votar:</p>
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'/>
<g:plusone expr:href='data:post.url' size='small'/>
<a expr:href='"http://bitacoras.com/anotaciones/" + data:post.url'><img alt='votar' expr:src='"http://widgets.bitacoras.com/votar/mini/" + data:post.url' title='Votar este artículo en Bitacoras.com'/></a>
</div>
<div id='related-posts'>
<p>Posts Relacionados: </p>
<font color='#FFFFFF'><b:loop values='data:post.labels' var='label'><b:if cond='data:label.isLast != "true"'/><b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=2"' type='text/javascript'/></b:if></b:loop> </font>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</div>
</b:if>
Paso 2: Añadiendo los scripts de bit.ly y de las entradas relacionadas:
Ahora busca la siguiente sección:
</head>Arriba de esta, deberás pegar el siguiente código:
<script charset='ISO-8859-1' src='http://archivos.ayuda-bloggers.info/Scripts%20Recuperados/posts-relacionados-blogger.js' type='text/javascript'/>
<script charset='utf-8' src='http://bit.ly/javascript-api.js?version=latest&login=cloudx18&apiKey=R_42c899cd058d1c93edca0e05ffee5a33' type='text/javascript'/>
<script src='http://archivos.ayuda-bloggers.info/Scripts%20Recuperados/acortador%20bitly.js' type='text/javascript'/>
Paso 3: Añadiendo CSS:
Ahora deberás buscar la siguiente sección:
]]></b:skin>Arriba de esta deberás pegar el siguiente fragmento:
#compartir {width:230px;padding:2px;float:left;background:#fff;line-height: 1.5em;}
#contenedor {border-top:1px solid #c5c5c5;padding:2px 13px;margin-bottom:3px;margin-top:50px;}
#contenedor img {border:none;padding:0px;}
#related-posts {padding-left:3px;float:right;width:230px;}Guarda los cambios y listo.
Importante:
Como puedes apreciar, son combinaciones de distintos tutoriales, simplemente las he añadido de forma conjunta, si sólo quieres algunas funciones sólamente, puedes revisar los siguientes posts:
En el caso del script de Bit.ly, es necesario una API Key, pero como he agregado la mía no será necesario.
No hay comentarios:
Publicar un comentario