Acortador de URLS automático en Blogger
Acortar una URL puede ser algo muy ventajoso, ya que hace mas vistoso el enlace y mucho mas corto, lo que se convierte en una mayor probabilidad que los usuarios compartan el enlace en sus redes sociales.
Seguro que ya conoces muchos acortadores de URL'S pero la mayoría acorta los enlaces de forma individual y tenemos que hacerlos nosotros mismos haciendo de esta tarea manual algo tedioso e incomodo.
Pero con el truco de hoy le dirás adiós a eso, ya que basta con agregar un par de lineas de código que hará todo el trabajo por ti de forma automática en todos los posts.
Como dice el titulo, se trata de un acortador de URLS automático en Blogger.
Seguro que ya conoces muchos acortadores de URL'S pero la mayoría acorta los enlaces de forma individual y tenemos que hacerlos nosotros mismos haciendo de esta tarea manual algo tedioso e incomodo.
Pero con el truco de hoy le dirás adiós a eso, ya que basta con agregar un par de lineas de código que hará todo el trabajo por ti de forma automática en todos los posts.
Como dice el titulo, se trata de un acortador de URLS automático en Blogger.
Para agregar este truco a tu blog ve a Plantilla, Editar HTML, y busca lo siguiente:
<b:skin>...</b:skin>Allí das clic en la flecha que aparece al lado de este código y busca la etiqueta ]]></b:skin> y arriba de esta añade lo siguiente:
#shorturl {
float: left;
background: #F8F8F8;
padding-bottom: 10px;
border-top: 1px solid #d2d2d2;
border-bottom: 1px solid #d2d2d2;
padding-top: 10px;
width: 570px; /Ancho del contenedor general/
}
#shorternh2 {
float: left;
padding-left: 20px;
padding-right: 10px;
}
.textinpo {
float: left;
font-family: "verdana",helvetica,Tahoma,Arial,sans-serif;
font-size: 12px;
color: #666;
border: 1px solid #ccc;
border-radius: 3px;
background: #fff;
width: 150px; /Ancho del contenedor del enlace/
padding: 0px!important;
padding-left: 10px!important;
height: 20px!important;
margin: -4px!important;
}
Ahora busca <div class='post-footer'> (si te aparecen 2 usa el segundo) y debajo de esa etiqueta pega lo siguiente:
<!-- Short URLs Script by Mil Trucos Blogger -->
<b:if cond='data:blog.pageType == "item"'>
<div id='shoternUrl'>
<form id='shorturl'/>
<!-- short url widget script start -->
<script charset='utf-8' src='http://bit.ly/javascript-api.js?version=latest&login=unbfacts&apiKey=R_cb436480530becb8bb6e628aa34520f2' type='text/javascript'/>
<script charset='utf-8' type='text/javascript'>
BitlyClient.addPageLoadEvent(function(){
BitlyCB.myShortenCallback = function(data) {
// this is how to get a result of shortening a single url
var result;
for (var r in data.results) {
result = data.results[r];
result['longUrl'] = r;
break;
}
document.getElementById("shorturl").innerHTML = "<div id='shorternh2'>Sorprende a tus amigos con este hecho,Comparte este enlace!</div> <input type='text' class='textinpo' value='" + result['shortUrl'] + "' name='bitlyurl'/>";}
BitlyClient.shorten(document.location, 'BitlyCB.myShortenCallback');
});
</script></div>
</b:if>
<!-- Short URLs Script by Mil Trucos Blogger -->
Ahora solo guarda los cambios y comprueba que todo este funcionando bien.
El acortado usado en este truco es bitly, puedes ver el truco en acción en el siguienteblog de pruebas.
Coméntanos que te ha parecido este truco, y si ya lo usaste dinos cual fue tu experiencia.
