| Optimasi Blog

Hampir semua narablog memiliki akun facebook dan/atau mungkin pula akun twitter. Tidak jarang kita menggunakan website social network tersebut sebagai salah satu aktivitas keseharian, baik hanya sekedar ngobrol maupun kegiatan yang lain. Dalam dunia blog, facebook & twitter mungkin lebih dikenal dengan istilah sebagai “ajang promosi”.

Bagaimana Anda melakukan update di facebook & twitter, jika posting telah diterbitkan di blog Anda? Mungkin Anda akan mengunjungi ke kedua website social network tersebut dan melakukan update secara manual. Salah satu alternatif agar posting yang diterbitkan akan ter-update secara otomatis di akun facebook & twitter Anda adalah dengan menggunakan layanan twitterfeed.

Twitterfeed merupakan web penyedia layanan update posting otomatis, baik di facebook maupun twitter. Update posting itu dilakukan dengan mengirimkan feed—suatu format data yang digunakan untuk menyediakan pembaharuan konten—ke website social network tersebut.

Caranya cukup mudah, Anda tinggal mendaftar di Twitterfeed dan memasukkan feed blog Anda dengan benar. Kemudian Anda perlu melakukan penambahan autority (wewenang) ke akun facebook & twitter, agar feed yang dikirim melalui twitterfeed dapat diterima dengan baik oleh kedua website social network tersebut. Anda pun dapat melakukan kostumisasi feed (update posting), seperti: menampilkan judul posting saja dan/atau disertai dengan ringkasan pendek isi posting.

Berikut ini merupakan “penampakkan” (screenshot) update posting yang dimaksud pada uraian di atas.

Twitterfeed to Facebook — Twitterfeed via facebook

Twitterfeed to Twitter — Twitterfeed via twitter

[ Baca selengkapnya ]

Twitter merupakan jejaring sosial yang menawarkan fitur microblog (posting pendek, kurang dari 200 karakter) yang memungkinkan penggunanya untuk mengirim & membaca pesan (tweets). Pengguna dapat menulis pesan berdasarkan topik dengan menggunakan ‘hashtags’ (#). Sedangkan untuk menyebutkan atau membalas pesan dari pengguna lain bisa menggunakan tanda ‘at’ (@).

Sekarang, bagaimana cara memasang widget “update via twitter” dalam blog? Anda dapat melakukannya melalui dua cara, otomatis atau manual. Ketika Anda memilih “otomatis”, maka yang perlu Anda lakukan adalah mengunjungi situs Twitter Resources & dibutuhkan beberapa kostumasi, agar widget yang Anda inginkan tampil maksimal dalam blog.

Apabila Anda memilih “manual”, maka terdapat beberapa langkah yang harus dipenuhi.

Download atau copypaste script blogger.js melalui situs resminya, yang tampak seperti di bawah ini:

function twitterCallback2(c){var a=[];for(var d=0;d<c.length;d++){var e=c[d].user.screen_name;var b=c[d].text.replace(/((https?|s?ftp|ssh)\:\/\/[^"\s\<\>]*[^.,;'">\:\s\<\>\)\]\!])/g,function(f){return'<a href="'+f+'">'+f+"</a>"}).replace(/\B@([_a-z0-9]+)/ig,function(f){return f.charAt(0)+'<a href="http://twitter.com/'+f.substring(1)+'">'+f.substring(1)+"</a>"});a.push("<li><span>"+b+'</span> <a style="font-size:85%" href="http://twitter.com/'+e+"/statuses/"+c[d].id_str+'">'+relative_time(c[d].created_at)+"</a></li>")}document.getElementById("twitter_update_list").innerHTML=a.join("")}function relative_time(c){var b=c.split(" ");c=b[1]+" "+b[2]+", "+b[5]+" "+b[3];var a=Date.parse(c);var d=(arguments.length>1)?arguments[1]:new Date();var e=parseInt((d.getTime()-a)/1000);e=e+(d.getTimezoneOffset()*60);if(e<60){return"less than a minute ago"}else{if(e<120){return"about a minute ago"}else{if(e<(60*60)){return(parseInt(e/60)).toString()+" minutes ago"}else{if(e<(120*60)){return"about an hour ago"}else{if(e<(24*60*60)){return"about "+(parseInt(e/3600)).toString()+" hours ago"}else{if(e<(48*60*60)){return"1 day ago"}else{return(parseInt(e/86400)).toString()+" days ago"}}}}}}};

Script di atas sudah dikompres melalui Yui Compressor. Anda pun bisa menambah & memodifikasi kode yang berwarna merah, contoh: <span> menjadi <span style="color:#333333; font-size:1em;"> dan sebagainya.

Simpan script tersebut dalam situs layanan penyimpanan file Anda, seperti: Google Code atau simpan dalam media penyimpanan Anda.

Twitter menyediakan beberapa script yang bisa kita manfaatkan menjadi widget, antara lain:

User Timeline
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/username.json?callback=twitterCallback2&amp;count=5"></script>

Public Timeline
<script type="text/javascript" src="http://twitter.com/statuses/public_timeline.json?callback=twitterCallback2&amp;count=5"></script>

User Favorite
<script type="text/javascript" src="http://twitter.com/favorites/username.json?callback=twitterCallback2&amp;count=5"></script>

User Search
<script type="text/javascript" src="http://search.twitter.com/search.json?tag=jython&from=username&rpp=5&callback=twitterCallback2"></script>

Silakan ganti kode yang berwarna merah dengan username Anda.

Misalnya, Anda ingin memasang user timeline maka yang Anda lakukan adalah menambahkan kode berikut dalam “Add/tambah gadget” blogger:

<div id="twitter_div">
<ul id="twitter_update_list">
</ul>
<p>@<a href="###" title="Follow me">username</a> on Twitter</p>
</div>
<script type='text/javascript'>
//<![CDATA[
function twitterCallback2(c){var a=[];for(var d=0;d<c.length;d++){var e=c[d].user.screen_name;var b=c[d].text.replace(/((https?|s?ftp|ssh)\:\/\/[^"\s\<\>]*[^.,;'">\:\s\<\>\)\]\!])/g,function(f){return'<a href="'+f+'">'+f+"</a>"}).replace(/\B@([_a-z0-9]+)/ig,function(f){return f.charAt(0)+'<a href="http://twitter.com/'+f.substring(1)+'">'+f.substring(1)+"</a>"});a.push('<li><span>'+b+'</span> <a style="font-size:85%" href="http://twitter.com/'+e+"/statuses/"+c[d].id_str+'">'+relative_time(c[d].created_at)+"</a></li>")}document.getElementById("twitter_update_list").innerHTML=a.join("")}function relative_time(c){var b=c.split(" ");c=b[1]+" "+b[2]+", "+b[5]+" "+b[3];var a=Date.parse(c);var d=(arguments.length>1)?arguments[1]:new Date();var e=parseInt((d.getTime()-a)/1000);e=e+(d.getTimezoneOffset()*60);if(e<60){return"less than a minute ago"}else{if(e<120){return"about a minute ago"}else{if(e<(60*60)){return(parseInt(e/60)).toString()+" minutes ago"}else{if(e<(120*60)){return"about an hour ago"}else{if(e<(24*60*60)){return"about "+(parseInt(e/3600)).toString()+" hours ago"}else{if(e<(48*60*60)){return"1 day ago"}else{return(parseInt(e/86400)).toString()+" days ago"}}}}}}};
//]]>
</script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/username.json?callback=twitterCallback2&amp;count=5"></script>

atau

<div id="twitter_div">
<ul id="twitter_update_list">
</ul>
<p>@<a href="###" title="Follow me">username</a> on Twitter</p>
</div>
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="http://twitter.com/statuses/user_timeline/username.json?callback=twitterCallback2&amp;count=5"></script>

Ganti kode yang berwarna merah dengan alamat twitter & username Anda.

Sekarang bandingkan widget timeline Anda tersebut dengan akun profil timeline Anda di Twitter

Update (30 Oktober 2012) — Kode Widget Twitter Update di atas mungkin tidak dapat digunakan lagi, pihak pengembang Twitter telah menyediakan widget tersebut pada Create and manage your widgets dalam akun tiap pengguna Twitter. Sebagai tambahan, setelah membuat widget tersebut diharapkan tidak menghapusnya. Oleh karena sangat dimungkinkan script yang digunakan juga tidak dapat menampilkan pembaharuan timeline melalui Twitter.

<a class="twitter-timeline" href="https://twitter.com/twitterapi" data-widget-id="YOUR-WIDGET-ID-HERE">Tweets by @twitterapi</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

Demo tampilan widget “timeline via twitter” dapat Anda lihat pada posting widget update.

@Optimasi_Blog on Twitter

[ Baca selengkapnya ]

Optimasi Blog

Laman

Mengganti Nextprev dengan Judul Posting

Tahukah Anda?

Otomatis Update Posting di Facebook dan Twitter

Widget Update via Twitter