Make Short Link on Blogger

Postingan gaya kali ini...hmmm...bertemakan memendekan (membuat pendek) ;)) Kalau menyangkut urusan mendek memendekkan pasti tidak jauh dengan link :D Yes thats right...:) Sebenarnya artikel ini Beben (si bloglang ganteng kalem) awali sejak membaca postingan dari salah satu web template for blogger BTemplates. Jika sobat memasuki halaman tersebut, maka akan mendapatkan cara memperpendek link pada post satu halaman penuh berdasarkan bit.ly API google project.

Karena trik tersebut tidak jalan pada blog aku ini, maka aku meneruskan bertualang tanpa menyerah, tidak kenal lelah, penuh harapan dan semangat Ramadhan menyertai :-" Ternyata harapan itu muncul pada seorang sobat berkenegaraan India (Baruva) :-bd Engineer, Programmer, Designer dan juga pecinta web :x Tanpa ragu 9lessons.info mengeluarkan trik "Create Bit.ly Short URLs Using Jquery and Ajax" ;) Disana sudah jelas sekali bagaimana untuk membuat semua link yg panjang menjadi pendek dengan basis jQuery and Ajax terintergrasi pada Bit.ly.

Sign up dulu nih To use the bit.ly javascript client library, you must pass your login and apiKey in the URL instead of the sample ones above. If you do not have an apiKey, sign up for a bitly account and go to your Account page to get your apiKey. Kalau urusan sign up dah beres baru perhatikan deh pada script yg telah dibuat oleh teman kita dari india :P "Project Hosting on Google Code"

<script type="text/javascript" src="http://ajax.googleapis.com/
ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{

//bit_url function
function bit_url(url)
{
var url=url;
var username="username"; // bit.ly username
var key="bit.ly API key";
$.ajax ({
url:"http://api.bit.ly/v3/shorten",
data:{longUrl:url,apiKey:key,login:username},
dataType:"jsonp",
success:function(v)
{
var bit_url=v.data.url;
$("#result").html('<a href="'+bit_url+'" target="_blank">'+bit_url+'</a>');
}
});
}


$("#short").click(function()
{
var url=$("#url").val();
var urlRegex = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
var urltest=urlRegex.test(url);
if(urltest)
{
bit_url(url);
}
else
{
alert("Bad URL");
}
});

});
</script>

//HTML Code
<input type="text" name="url" id="url"/>
<input type="submit" id="short" value="Submit"/>
<div id="result"></div>

Keterangan warna pada script diatas:

1. Biru / Blue
Jika sobat sudah mempunyai script tersebut jangan dipakai lagi.
2. Merah / Red
Isikan dengan nama pendaftaran pada bit.ly (sign up)
3. Hijau Terang / Greenlight
Isikan dengan angka API key yg diperoleh setelah melakukan registrasi juga.

Masukan seluruh script tersebut dengan melakukan on Dashboard ► Design ► Page Elements ► Add a Gadget ► HTML/Javascript :D Kalau sobat bisa memadukan script diatas yg dari india dengan keluaran btemplates, mungkin akan lebih gaya tuh :)) dan jangan lupa untuk melapor sama bloglang kalo berhasil yak ;)) :">

Jika sobat pusing dan mau cara yg instant dalam memendekan link postingan sobat untuk blog tersayang :x ada juga. Trik ini Beben buat sendiri setelah melakukan semedi 100 tahun sob :D Untuk meletakannya sobat tinggal atur saja sendiri deh yah!!! Kalau bisa dibagian category setelah readmore! terserah!!!

<a expr:href='"http://ggl-shortener.appspot.com/?url=" + data: post.url' target='_blank'>Short URL this page</a>

Salam bloglang GAYA!!! :-bd
Wassalam :-h