It's not about me, it's my blog!

28.1.10

Rangkuman pengalaman ngeblog, saya bukukan

Akhir tahun 2006 saya membuat blog ini. Namun, dibiarkan begitu saja. Baru April 2008 mulai aktif menulis. Bongkar pasang template, gadget, dan modifikasi telah dilakukan. Mungkin akan terus dilakukan sampai menemukan atau bahkan mampu membuat tampilan sendiri yang lebih nyaman dilihat.

Semuanya saya tulis dan kumpulkan dalam beberapa artikel. Akhirnya, memenuhi kriteria menjadi sebuah buku. Jika Anda tertarik membacanya, silakan beli buku ini di toko buku Gramedia terdekat. Informasi harga, bisa dilihat di sini.

25.1.10

Menghilangkan border pada kumpulblogger

Meskipun tampak sepele, tetapi bisa saja mengganggu. Misalnya, jika kita memasang kode kumpulblogger, ada garis tepi (border). Jika kita pasang di gadget yang memiliki garis tepi, tentu akan terlihat ada dua garis tepi di gadget tersebut. Untuk itu, dengan sedikit trik, garis tepi pada kumpulblogger bisa kita hilangkan.

Caranya sebagai berikut.

Salin kode di bawah ini.

.garping,.garpinghor {
border: none !important;
}
.garping table,.garpinghor table {
border:#FFFFFF solid 1px !important;
background-color:#FFFFFF !important;
}
.garping td,.garpinghor td{
color:#000000 !important;
background-color:#FFFFFF !important;
font-family:arial !important;
font-weight: !important;
font-style: !important;
}
.garping a,.garpinghor a{
color:#000080 !important;
font-family:arial !important;
font-weight: !important;
font-style: !important;
}
.garping a:hover,.garpinghor a:hover{
color:#FF0000 !important;
}

Klik Edit HTML lalu cari kode <b:skin><![CDATA[LETAKKAN KODE DISINI/*.
Klik SAVE TEMPLATE.

Membuat readmore otomatis di blogger

Secara default, artikel pada blogger tidak dipenggal. Kita bisa saja menyisipkan kode untuk memenggal artikel. Namun, tetap merepotkan bila harus selalu menyertakan kode untuk memenggal saat menulis artikel. Supaya hal itu tidak dilakukan, kita bisa membuat penggalan artikel secara otomatis.

Caranya sebagai berikut.

Sisipkan kode ini di atas kode </HEAD> pada halaman EDIT HMTL.

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 350;
summary_img = 350;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

Klik SAVE TEMPLATE.

Ceklis Expand Widget Templates.
Cari kode <data:post.body/> lalu ganti (replace) menjadi kode di bawah ini.

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

Klik SAVE TEMPLATE.

Hasilnya seperti blog ini.

Jika Anda sudah menyisipkan kode readmore sebelumnya, hapus dulu kode tersebut baru masukkan kode seperti di atas.

Memasang random banner di blog

Punya banyak banner yang mau dipasang di blog? Pasti bingung menempatkannya di mana. Kalau dipasang semua kemungkinan memenuhi tampilan blog. Untuk mengatasinya, buat saja random banner. Kita hanya menempatkan satu banner dan berubah otomatis ketika blog kita direfresh.

Caranya sebagai berikut.

Salin kode berikut.

<script language="JavaScript">  </script>

Ganti tulisan yang berwarna merah dan biru sesuai kebutuhan lalu masukkan ke gadget HMTL/JavaScript atau tempat lain yang Anda inginkan.

Untuk melihat hasilnya, refresh (F5) browser beberapa kali.

Jumlah iklan bisa ditambah maupun kurangi. Jika ingin menambah, cukup menambahkan kode berikut ini.

if (pasang_iklan==4) {

url="alamat url";

alt="alamat/nama url";

banner="alamat gambar";

width="468";

height="60";

Hasilnya bisa dilihat di blog ini.

22.1.10

Membuat komentar di blog via aplikasi facebook

Berawal dari iri ketika melihat situs MetroTV, pada live streaming bisa ngirim komentar via facebook. Saya coba menggunakan facebook developer ternyata harus mengupload file xd_receiver.htm. Padahal, di blogger tidak bisa mengupload file tersebut. Namun, ternyata ada alternatif lain. Caranya sebagai berikut.

Klik link ini lalu beri nama aplikasi. Klik Create Application.

Catat API Key yang diberikan. Kalau punya, upload ikon maupun logo blog Anda.

Klik tab Connect lalu isi Connect URL dengan blog Anda.

Klik tab Widget. Lakukan pengaturan sesuai keinginan Anda. Misalnya, tidak mengizinkan orang tak dikenal memberi komentar, pilih No pada Allow Anonymous Comments. Klik Save Changes.

Klik Edit HTML.

Klik Download Full Template untuk berjaga-jaga terjadi kesalahan. Ceklis Expand Widget Templates. Cari kode di bawah ini.

xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

Simpan xmlns:fb='http://www.facebook.com/2008/fbml' di akhir kode tersebut seperti di bawah ini.

xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml'>

Letakkan kode di bawah ini sebelum tag </head>.

<script src='http://static.ak.connect.facebook.com/js/api_lib/v0.4/

FeatureLoader.js.php'type='text/javascript'/>

Letakkan kode di bawah ini sebelum tag </body>.

<script type='text/javascript'>
FB.init("LETAKKAN_API_KEY_ANDA_DISINI", "");
</script>

Letakkan kode di bawah ini di tempat yang Anda inginkan. Misalnya, Gadget HTML/JavaScript.

<fb:comments width='250'/>

Hasilnya seperti gambar berikut.

21.1.10

Menggabungkan banyak dokumen menjadi satu

Ketika membuat artikel untuk blog, saya biasa menulisnya dalam Ms. Word satu dokumen untuk satu artikel. Jika sudah banyak, saya suka menggabungkannya dalam satu dokumen. Biasanya, saya buka satu per satu dokumen lalu copy – paste.

Jika puluhan dokumen kayaknya bisa memakan waktu dan tenaga. Ternyata, ada fasilitas supaya proses itu dilakukan lebih cepat. Caranya sebagai berikut.

Buat dokumen baru. Klik ribbon Insert lalu klik Object > Text for File.

Seleksi dokumen yang akan disisipkan lalu klik Insert.

Semua dokumen yang dipilih, otomatis masuk ke dalam satu dokumen.

Catatan:

Jika ingin memasukkan bab secara berurutan, klik di akhir bab, tekan Shift lalu klik di bab pertama. Jika di klik dari bab pertama, urutannya menjadi bab terakhir, bab pertama sampai satu bab sebelum akhir.
Jika dokumen yang dimasukkan puluhan, sebaiknya diseleksi per tiga puluh dokumen. Jika dipilih semua, kadang tidak masuk seluruhnya. Supaya berurutan, ikuti catatan ke-1.

Menghilangkan tulisan di header

Setiap template memiliki desain yang berbeda. Salah satunya ada yang menyertakan nama situs dan slogan dari situs tersebut. Ketika akan menggunakannya, mungkin di situs kita tidak perlu.

Kita bisa menghilangkannya dengan cara sebagai berikut.

Buka folder template > nama template. Klik kanan file index.php lalu klik Open with > WordPad.

Cari dan hapus kode seperti ini.

<div class="art-Logo">

<h1 id="name-text" class="art-Logo-name"><a href="<?php echo $baseUrl; ?>/">mediakita</a></h1>

<div id="slogan-text" class="art-Logo-text">agar kita lebih tahu</div>

</div>

Refresh halaman utama situs. Hasilnya seperti gambar berikut.

13.1.10

Membuat module YM di Joomla! 1.5.15

Kalau kita menggunakan modul Yahoo! Messenger yang sudah ada, kebanyakan hanya ada satu akun. Padahal, mungkin kita ingin menampilkan lebih dari akun bila website kita terdiri dari beberapa admin atau kontributor.

Untuk mengatasinya, bikin modul sendiri saja. Kali ini saya mencobanya di Joomla! 1.5.15. Caranya sebagai berikut.

Klik Extensions > Module Manager.

Klik New.

Pilih Custom HTML.

Klik Next.

Ketik nama modul.

Klik ikon HTML.

Masukkan kode berikut ini. Tag <br> supaya antar ikon YM beda baris. Klik Update. Angka pada (t) bisa diganti antara 1 sampai 15.

<a href="ymsgr:sendIM?id_ym"><img src="http://opi.yahoo.com/online?u=id_ym&m=g&t=1" border=0></a>

Hasil sementara seperti ini.

Klik Save.

Buka atau refresh tampilan website Anda. Hasilnya seperti ini.

11.1.10

Sharing koprol via facebook

Untuk mencari teman di koprol, bisa mengetik nama teman di kotak pencarian atau mengundang via email. Selain itu, kita juga bisa mengajak secara tidak langsung dengan menghubungkannya ke akun Facebook. Dengan demikian, mungkin saja ada teman di Facebook yang tertarik bergabung setelah melihat status kita.

Caranya sebagai berikut.

Klik ikon Share on Facebook pada status yang kita buat.

Klik Connect. Jika belum login ke Facebook, ada permintaan untuk memasukkan username dan password.

Ketik status (optional) lalu klik Publish.

Hasilnya seperti gambar berikut.

Koprol: sedang di mana dan sedang apa?

Sebenarnya sudah lama register di koprol, tetapi sampai sekarang belum dioptimalkan. Kalau melihat fiturnya, lumayan bagus. Kita bisa menyampaikan informasi, sedang di mana dan sedang melakukan apa. Dengan begitu, jika kita akan menuju ke suatu tempat, kita bisa tahu ada siapa saja di tempat itu dan sedang ngapain mereka.

Untuk itu, sangat disarankan ketika pertama kali masuk, checkin tempat dulu baru update status. Caranya sebagai berikut.

Ketik lokasi Anda sekarang atau yang akan dikunjungi lalu tekan ENTER.

Klik Checkin tempat yang akan dituju.

Kita bisa melihat ada siapa saja di tempat tersebut.

8.1.10

Hanya iseng: merotasi tampilan situs

Kalau membuat tulisan terbalik, saya yakin sudah banyak yang tahu dan bisa. Namun, kalau website terbalik, mungkin baru sedikit orang tahu. Memang tidak ada manfaatnya sih. Ini hanya iseng saja dan bisa untuk ngerjain temen yang baru belajar komputer.

Caranya sebagai berikut.

Buka situs ini, lalu ketik url situs yang akan dibalikkan.

Pilih jenis rotasi lalu klik Rotate!

Hasilnya seperti ini.

Rotasi ke kiri.

Rotasi ke kanan.

Miror.

6.1.10

Google Translate for Client

Untuk urusan menerjemahkan sebuah situs, kita bisa memanfaatkan Google Translator. Namun, kita harus melakukan beberapa tahap untuk menerjemahkannya. Meskipun kita bisa menginstal toolbar Google Translator, tetapi akan diterjemahkan satu halaman dalam halaman yang berbeda. Supaya lebih sederhana, kita bisa menginstal Google Translate for Client.

Aplikasinya bisa didownload di sini. Cara menggunakannya sebagai berikut.

Saat pertamakali dibuka, atur bahasa yang akan digunakan. Baik bahasa sumber maupun bahasa terjemahannya.

Klik Main > Settings.

Supaya lebih cepat, pilih opsi Just select text lalu klik OK.

Ketika kita ingin menerjemahkan sebuah kalimat atau paragraf, cukup sorot kalimat/paragraf tersebut. Terjemahannya langsung muncul.

Lebih cepat dan mudah, bukan? Saya menggunakan versi gratis. Kalau ingin mengupgrade ke profesional, Anda harus membayar $15.95 untuk satu tahun.

4.1.10

Menyisipkan teks bergerak di blog

Berbagai cara bisa dilakukan untuk membuat blog lebih atraktif. Salah satu yang paling sederhana adalah menampilkan teks berjalan. Bisa disisipkan di dalam artikel maupun gadget. Baik teks biasa maupun dalam bentuk link.

Berikut ini, beberapa alternatif teks berjalan yang bisa Anda gunakan.

Bergerak biasa.

<marquee>masukkan teks sederhana di sini</marquee>

Hasilnya seperti ini.