Bikin Short URL Otomatis di Blog

Lama nggak bikin thread di sini

Kali ini ane mau bikin tutorial (yang mungkin) bermanfaat buat kalian semua para sesepuh blogger
Tutorialnya adalah Buat Short URL Otomatis untuk Blog. Tutorial ini sementara hanya untuk pengguna Blogger, selain itu (ex: Wordpress, dll) ane belum nyoba. kaga tau cara pasangnya contoh bisa lihat di blog ane http://www.opesite.web.id

oke langsung saja.

1. Daftar/buat akun di bitly.com
2. Masuk ke link ini https://bitly.com/a/your_api_key. Perhatikan Bitly Username dan Bitly API Key-nya
3. Masukkan CSS ini ke blog ente. Caranya? cari Gugel!

Code:

form#shorturl {
color:#fff;
font-size:12px
z-index:99;
margin:5px;
}
#shorturl input {
color:#fff;
border:1px solid #FF6666;
width:300px;
font-weight:bold;
background-color:#FF6666  ;
}
#short-inner{
width:510;
padding:0px;
background-color:#FF6666  ;
z-index:-1;
margin-top:1px;
margin-bottom:1px;
}

4. Copy dan Paste script berikut ini diatas </head>

Code:

<script charset='utf-8' src='http://bit.ly/javascript-api.js?version=latest&amp;login=BITLY USERNAME&amp;apiKey=BITLY API KEY' 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[&#39;longUrl&#39;] = r;
break;
}
document.getElementById(&quot;shorturl&quot;).innerHTML = &quot;Short link untuk artikel ini adalah: &lt;input type=&#39;text&#39; value=&#39;&quot; + result[&#39;shortUrl&#39;] + &quot;&#39; name=&#39;bitlyurl&#39;/&gt;&quot;;
}
BitlyClient.shorten(document.location, &#39;BitlyCB.myShortenCallback&#39;);
});
</script>

Perhatikan Bitly Username dan Bitly API Key. Gantilah dengan punya ente sendiri (cara nomer 2)

5. Selanjutnya copy script berikut ini dan paste entah di mana terserah ente. Bisa di bawah judul atau di akhir postingan.

Code:

<div id='short-inner'>
<form id='shorturl'/>
</div>

6. Simpan template dan lihat hasilnya. Taraaaa!!! uwowo...

Silahkan utak-atik sendiri CSS-nya untuk modifikasi tampilannya

source : Opesite

 

Sip Den
Akhirnya bisa buat short url otomatis dari Bitly

 

Wordpress sepertinya sama saja, tinggal paste di templatenya doang (Wordpress Self Hosting).
tapi sudah disediakan juga sih shorturl dari wordpress

 

Keren nih, tapi saya suka pke adf.ly wkwkw

 

Tapi g bisa lihat statistiknya dong? berapa kali link yang kita shorten diklik.

 

Mantabbb , ditunggu thread-thread sejenis yang lainnya om

 

hahah.. iye karena berbayar

 

bisa, lihat di akun bitly-nya
contoh: http://prntscr.com/6damr1

 

oh iya wp ada sendiri

 

mantap

 

Setelah saya lihat gambarnya, sepertinya suatu artikel berjudul 'Konflik Ahok vs DPRD Jakarta Karena USB?'. Hehehe, cuma ingin kasih tau Mas. Bukan USB tapi UPS.

 

kalau cara buat url shortener seprti milihnya den @Samehadaku ada yang tahu ? kalau ada yang share pasti manteb banget

 

wkwk , mungkin nulisnya terllau cepat bro . jadi salah ketik , tapi lucu juga sih
update : setelah saya baca memang seperti itu judulnya

 

Ane coba ah den, terima kasih tips nya

 

ngoprek css paling males dan bikin pusing..

 

Manteb nih kayaknya, bisa bikin sendiri...

 

bleh jga ni gan, kpn2 bsa dicoba.. thanks for share..

 

wew mantap nih tutorialnya bisa menghemat tenaga.. thanks..

 

Wah keren nih short cut nya. makasih gan