Rabu, 06 Januari 2010

Cara Menghilangkan Tulisan "Subscribe to: Posts (Atom)"

Bagi teman2 yang ingin menghilangkan tulisan "Subscribe to: Posts (Atom)" yang terletak tepat di bagian bawah entri/postingan blog, maka bisa diperaktekkan melalui langkah-langkah yang akan kita bahas di postingan kali ini. Sebelum menghapusnya teman-teman harus mengetahui apa fungsi dari fitur tersebut.


Fitur "Subscribe to: Posts (Atom)" atau "Langgan: Entri (Atom)" berfungsi sebagai jalur untuk berlangganan posting, dengan fitur ini setiap pengunjung yang ikut berlangganan akan langsung tahu tatkala ada postingan terbaru (update) dari blognya teman-teman.



Tulisan "Subscribe to: Posts (Atom)" yang dimaksud yaitu seperti berikut







Atau juga teman2 bisa melihatnya seperti di blog ini






Mengingat fungsinya sebagai jalur untuk berlangganan, saran saya sebelum menghapusnya teman2 sebaiknya memilki form berlangganan yang menggunakan jasa FeedBurner.


1. Untuk menghapusnya silahkan login dulu ke akun blogger, lalu klik Tata Letak >> Edit HTML, dan jangan lupa untuk mencentang kotak "Expand Widget templet"

2. Lalu cari kode berikut

<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div>




3. kalau dah ketemu silahkan dihapus, dan jangan lupa klik simpan template


Selesai


Semoga Bermanfaat []


Tags: cara menghilangkan Subscribe to: Posts (Atom), cara hapus Subscribe to: Posts (Atom), edit Subscribe to: Posts (Atom), agar Subscribe to: Posts (Atom) hilang

Selasa, 05 Januari 2010

Senang Menulis? Ayo Blogging!

Bagi teman-teman yang memiliki hobi menulis atau memang memiki cita-cita untuk menjadi seorang penulis, maka salah satu cara untuk mewujudkannya yaitu blogging (ngeblog). Teman-teman bisa menggunakan layanan pembuatan blog secara gratis, seperti yang telah disediakan oleh blogger[DOT]com dan juga wordpress[DOT]com. Mengingat ini hanya salah satu cara teman-teman mengasah kemampuan menulisnya, jadi teman-teman juga bisa menggunakan metode lain seperti rajin membaca, termasuk membaca tulisan-tulisan yang telah dibuat oleh para penulis ternama (nyari buku yang sesuai/cocok dengan mood-nya teman2).

Nah, tentu dengan ngeblog teman-teman lebih bisa mendapatkan banyak manfaat ketimbang hanya nongkrong di depan komputer dgn tema chatingan ala social network, seperti: FriendSter (FS), Twitter (Twit), lalu satu lagi yg sekarang ini lagi heboh-hebohnya FaceBook (FB). Boleh sih boleh... nongkrong depan komputer buat chatingan dengan alsan mempererat silaturrahmi, etc. Namun, dari realita keseharian kita "apakah benar layanan2 social network seperti yg tlah kita knal hanya untk sekedar mempererat silaturrahmi kita?", saya kira teman2 pasti sudah pada tahu bagaimana dan apa isi kegiatan teman2 ketika berada di situs jejaringan sosial tersebut.

Silahkan teman-teman isi blognya teman-teman dengan tulisan apa saja, yang penting ketika teman-teman ingin menulis jangan sampai ada rasa sungkan karena takut tulisannya gak berbobot atau semacamnya. Toh yang namanya lagi belajar memang harus dimulai dari awal. Nah, oleh karena itu kalau teman-teman sudah memilki opini mengenai sesuatu atau hanya sekedar iseng2 saja, silahkan dituang dalam bentuk tulisan, tentu ini semua akan memiliki nilai lebih ketimbang teman-teman hanya menuangkan ide-ide isengnya sebagai bahan update status seperti di FaceBook itu. Mungkin teman-teman akan bertanya apa nilai lebih yang dimaksud, teman-teman akan merasakannya di kemudian hari yaitu ketika hasil pemikiran teman-teman berupa blog tersebut telah menjadi bagian dari sejarah kehidupan teman-teman.(==>ex: Teman2 sekarang sedang remaja, besok kalau sudah masuk usia tua pasti akan tersenyum karena melihat hasil pemikiran teman2 sendiri yang berbentuk blog tersebut^)

Lalu tunggu apa lagi? (sebelum tua lho...hehehe), ayo ngeblog...ukirlah semua ide serta hasil pemikiranmu, dengan ngeblog semua orang akan/bisa melihat serta mengetahui isi pemikiranmu (opini)

"SO DON'T BE LAZY. SHARING IS COOL, SHARE YOUR KNOWLEDGE NOW!!!"

Senin, 04 Januari 2010

Membuat Mini Banner yang Cocok untuk Link Exchange

Mungkin teman-teman blogger sudah tidak asing lagi dengan istilah Link Exchange, beberapa manfaat melakukan link exchange juga pasti sudah pada tahu. Biasanya yang dilakukan oleh para blogger untuk saling menukar link yaitu mencantumkan link teman yang diajak tukaran link ke blognya masing2, dan penukaran link tersebut bisa berupa teks ataupun banner. Namun untuk pembahasan kita kali ini kita utamakan maslah banner blog, seperti apakah banner blog yang bagus untuk dijadikan bahan link exchange?

Beberapa Blogger menyediakan banner blog dengan tujuan agar bisa menjalin tukar link/link exchange sesama blogger lainnya. Oleh karenanya tidak sedikit dari mereka (para blogger) berlomba-lomba untuk mendesain button/banner blognya seindah dan semenarik mungkin. Namun yang perlu diperhatikan, apakah ukuran banner yang telah didesain sudah ideal untuk digunakan dalam hal link exchange? Kebanyakan dari para Blogger lebih memilih untuk memasang mini banner ketimbang banner yang memilki ukuran yang relatif besar, bisa saja alasannya karena takut memakan size/loading blog sehingga maslah ini dapat membuat blog si pemasang banner bertambah lemot/lambat, lalu alsan lainnya juga karena banner besar juga memakan tempat. Dan dikarenakan banyak alasan tersebut lah banyak dari para blogger lebih memilih untuk memasang mini banner ketimbang banner besar, walaupun proses link exchange terjadi, si pemasang banner akan lebih memilih untuk memasang link berupa teks ketimbang banner. Lalu bagaimana teman2, apakah banner blognya teman2 sudah starategis untuk digunakan sebagai bahan link exchange?

Dan banner blog yang cocok untuk digunakan sebagai bahan link exchange yang saya maksud yaitu seperti banner berikut ini:

www.terjorok.com

Lalu bagaimanakah cara membuat banner tersebut? Cara membuatnya sangat gampang, bagi teman2 yang jago dalam maslah desain dengan menggunakan program desain grafis (seperti corel, photo shop, dll) monggo...silahkan saja. Akan tetapi bagaimana bagi yang belum bisa menggunakan program desain grafis seperti yg telah disebutkan? Atau mungkin bagi yang tidak mau repot2? Yupz...gak usah khawatir, karena teman2 bisa langsung menggunakan jasa/layanan online untuk mendesain mini banner secara gratis. Silahkan untuk mengunjungi langsung web: Lucazappa.com

Nanti di sana teman2 bisa mendesain mini banner sesuka hati, dan nanti besarnya meneyerupai ukuran contoh banner di atas, teman2 bisa meneyesuaikan kata2 yang ingin dibubuhi di dalamnya, dan usahakan kata2 yg singkat. Selain itu juga teman2 bisa mengatur warna banner yang diinginkan.

Selanjutnya yang harus teman2 lakukan (setelah proses pembuatan selesai) yaitu menyimpan gambar/banner hasil bikinan teman2 ke web hosting-nya masing-masing. Lalu teman2 bisa menngunakan kode berikut untuk membuat banner link exchange (sebelumnya sudah saya bahas di postingan dengan judul cara memasang banner blog):

<a target="_blank" href="http://www.terjorok.com/"><img alt="www.terjorok.com" src="http://sites.google.com/site/t4belajarblogger/gambar/banner_t4belajarblogger.png" border="0" /></a><a target="_blank" href="http://www.terjorok.com/">
</a><textarea rows="4" cols="24" name="code"><a target="_blank" href="http://www.terjorok.com/"><img border="0" alt="www.terjorok.com" src="http://sites.google.com/site/t4belajarblogger/gambar/banner_t4belajarblogger.png" /></a></textarea>



Dan nanti hasilnya seperti berikut:

www.terjorok.com


Berhubung di atas itu adalah banner blog saya, maka teman2 harus mengganti beberapa link yang telah saya tandai... dengan link blog serta link gambarnya teman2, berikut keterangannya:

Biru= Yaitu Link Blog
Merah= Keterangan Banner (bisa diisi dengan alamat blognya teman2)
Hijau= Yaitu Link URL gambar/banner


Nah, sekarang silahkan mencoba. Kalau sudah nyoba jangan lupa tukaran link yak....^ (lumayankan saling nambah back link, ayo...buruan)


Semoga Bermanfaat []

Tags: cara membuat banner blog, banner mini untuk link exchange, kode HTML banner blog, cara buat banner kecil, buat banner online, script banner mudah

Jumat, 01 Januari 2010

Membuat Zooming Gambar untuk Blogger

Apa itu "zooming gambar"? Zooming gambar...kalau secara bahasa artinya memperbesar gambar, nah kalau dari sisi artinya saja teman2 pasti sudah pada paham maksud dari judul di atas. Namun yang ingin kita bahas kali ini yaitu "bagaimana cara memasang fasilitas zooming gambar tersebut ke dalam blog kita". Sebagai gambarannya, fasilitas ini sangat unik dan cocok bagi teman2 yang biasanya menyediakan gambar2 kecil di dalam blognya lalu menggunakan trik ini dengan tujuan agar setiap pengunjung blog teman2 bisa melihat dengan jelas bagaimana wujud gambar tersebut dalam skala yang lebih besar, dengan begitu tampilan gambar yang dimaksud lebih jelas untuk dipandang.


SCREENSHOT BLOG INI (TEMPLATE LAMA)


Bagi teman2 yang tertarik untuk membuat "Zooming Gambar", silahkan diperaktekkan melalui langkah2 berikut:

Login ke blogger, lalu klik Tata Letak >> Edit HTML

Selanjutnya yang harus teman2 lakukan yaitu meletakkan kode berikut tepat di bawah kode tag ]]></b:skin>


<script src='http://sites.google.com/site/t4belajarblogger/js_t4belajarblogger/zoom.js' type='text/javascript'/>
<script src='http://sites.google.com/site/t4belajarblogger/js_t4belajarblogger/nge.zoom.js' type='text/javascript'/>
<script type='text/javascript'>
jQuery.noConflict();
jQuery(document).ready(function(){
$(&quot;img.jqzoom&quot;).jqueryzoom({
xzoom: 400, //zooming div default width(default width value is 400)
yzoom: 400, //zooming div default width(default height value is 400)
offset: 30 //zooming div default offset(default offset value is 30)
//position: &quot;right&quot; //zooming div position(default position value is &quot;right&quot;)
});
});
</script>

<style type='text/css'>
div.zoomdiv {
z-index : 100;
position : absolute;
top:0px;
left:0px;
width : 200px;
height : 200px;
background: #ffffff;
border:1px solid #CCCCCC;
display:none;
text-align: center;
overflow: hidden;

}


img.jqzoom{
cursor:crosshair;
position:relative;

}
</style>




Lalu klik simpan template.


Selanjutnya teman2 harus menggunakan kode berikut (untuk membuat zooming gambar) di gadget HTML (tata letak) atau ke dalam postingannya teman2


<span class="tozoom"><img alt="URL Gambar Besar" src="URL Gambar Kecil" class="jqzoom"/></span>




Nih berikut ini contohnya


<span class="tozoom"><img alt="http://sites.google.com/site/t4belajarblogger/gambar/screenshot_t4belajarblogger_besar.JPG" src="http://sites.google.com/site/t4belajarblogger/gambar/screenshot_t4belajarblogger_kecil.JPG" class="jqzoom"/></span>



(yang di atas itu adalah contoh untuk screenshot blog saya, silahkan disesuaikan dengan URL gambarnya teman2)


Lalu untuk mengatur panjang lebar layar "gambar zooming"-nya teman2 bisa mengatur nilai panjang lebar (xzoom-yzoom-offset) yang telah saya tandai dengan warna BIRU.

Selamat mencobA.....

(kalau ada kesulitan silahkan untuk meninggalkan pertanyaan sobat pada kotak komentar postingan)


Semoga Bermanfaat []

Tags: membuat efek zoom gambar, zoom gambar untuk blogspot, agar gambar jadi besar, bagaimana buat gambar besar, efek gambar besar disorot, kode HTML zoom, zoom untuk gambar script

Kamis, 31 Desember 2009

Membuat Web Hosting di Google Sites

Web hosting berguna untuk menghosting atau menyimpan file kita, baik itu berupa gambar maupun teks. Untuk membuat web hsting di Google sites kita tidak membutuhkan biaya sepersen pun alias gratis. Beberapa keistimewaan membuat web hosting di Google sites yaitu ngaksesesnya gampang terutama bagi teman2 blogger, karena dengan terdaftarnya teman2 ke akun blogger maka secara otomatis teman2 sudah memilki akun di Google, oleh karena itu apabila ingin mengakses Google sites, teman2 tinggal pergi ke situsnya. lalu keistimewaan yang lain...fitur yang disediakan mantap, dan kita bisa membuat halaman/kategori file hostingan sesuka kita.

Selanjutnya saran saya bagi teman2 blogger untuk memiliki web hosting di google sites, masalahnya selain layanan dan fiturnya memadai juga hitung2 ngehemat waktu login ke suatu akun. Begitu teman2 login ke blogger, maka google site miliknya teman2 juga langsung aktif, dengan syarat sebelumnya sudah daftar ke google sites.

Bagi teman2 yang ingin memiliki web hosting di google sites, maka bisa membuatnya melalui langkah2 berikut

1. Surfing ke situs Sites.google.com

2. Kalau teman2 dalam keadaan offline dari akun google maka bisa langsung login melalui form login yg telah disediakan (bagi teman2 blogger silahkan langsung menggunakan email dan password login blogger)



3. Akan tetapi bagi teman2 yang sedang dalam keadaan online di akun google (termasuk blogger), maka teman2 akan langsung diantar ke halaman berikut ini, dan langsung saja untuk mengklik tombol "Buat Situs"



4. Selanjutnya teman2 akan langsung diantar ke halaman pembuatan situs, maka teman2 di sana nanti akan disuruh untuk memilih template, memberi nama situs, memberi nama alamat URL situs, serta mengisi captcha/kode verifikasi pembuatan situs. Berhubung kita hanya ingin membuat web untuk hostingan file saja, maka gak usah ribet2. Silahkan untuk opsi template pilih opsi "template kosong"



Silahkan untuk memberi nama situs tman2 serta nama alamat URL situs. Contoh untuk nama situs "Web Hostingannya Iqbal", lalu untuk nama alamat URL situs "webhostingannyaiqbal" (biarkan penamaan alamat URL yang muncul secara otomatis ini, agar proses pendaftaran kita lancar)



Langkah selanjutnya langsung loncat ke opsi pengisian captcha/kode, lalu klik tombol "Buat Situs"




5. Selamat, sekarang teman2 sudah memiliki web hostingan sendiri.



6. Langkah selanjutnya, teman2 harus membuat laman baru (pojok kanan atas) untuk menyimpan file apa saja yang teman2 inginkan (saran: laman juga bisa dijadikan sebagai kategori file kita)



7. Sesampai di halaman pembuatan laman baru, silahkan pilih opsi "Lemari Berkas"



Dan silahkan beri nama laman, contoh: gambar2ku. Dan jangan lupa pilih opsi "letakkan laman di tingkat atas", dan diikuti dengan mengklik tombol "Buat Laman"




8. Sekarang "Laman Baru" telah dibuat, selanjutnya kita bisa mengupload file gambar kita (baik dari komputer maupun dari/berupa alamat URL ==> Bedanya kalau dari komputer maka file gambar yg telah kita upload tersebut sudah benar2 menjadi milik kita, sedangkan untuk opsi web/url hanya berupa catatan url saja, jadi saran saya mendingan menggunakan opsi komputer). Untuk memulai proses penguploadan/pengunggahan, silahkan klik tombol "+Tambahkan Berkas" >> Pilih berkas >> Pilih berkas dari komputer anda >> lalu klik tombol "unggah"/ upload



Selanjutnya file gambar telah berhasil di-upload, teman2 bisa mengambil link gambar yg telah diupload tersebut, mungkin untuk kepentingan yg berhubungan dgn pemostingan, dll. Cara pengambilan link gambar

-. Klik kanan pada tulisan "unduh"/download, lalu pilih opsi "Copy Link Location"



-. Link URL gambar yg telah didapatkan dapat di-paste ke notepad, contohnya seperti berikut ini:

http://sites.google.com/site/webhostingannyaiqbal/gambar2ku/banner_t4belajarblogger.JPG?attredirects=0&d=1

dan ketika teman2 ingin menggunakannya, maka tulisan: ?attredirects=0&d=1 harus dihapus, sehingga menjadi seperti berikut

http://sites.google.com/site/webhostingannyaiqbal/gambar2ku/banner_t4belajarblogger.JPG

Untuk memosting gambar, teman2 bisa menggunakan kode script gambar seperti biasanya, contoh


<img src='http://sites.google.com/site/webhostingannyaiqbal/gambar2ku/banner_t4belajarblogger.JPG' alt='t4belajarblogger' />


maka hasilnya seperti berikut ini

t4belajarblogger


Selesai....


Lalu bagaimana cara mengupload file Java Script/JS? Caranya sama saja. Agar file milik teman2 terkelompok dengan baik (sehingga mudah diambil linknya ketika dibutuhkan) maka ada baiknya jika teman2 sekarang membuat laman baru, tentu namanya mewakili file2 yg berada di dalamnya, contoh untuk laman baru kita beri nama "javascriptku". Untuk pembuatan laman baru teman2 bisa memperaktekkannya melalui langkah2 seperti tadi, yaitu klik tombol "+Buat Laman" >> pilih opsi "Lemari Berkas" >> memberi nama laman >> pilih opsi "Letakkan laman di tingkat atas" >> Klik tombol "Buat Laman". Sekarang laman "javascriptku" telah berhasil dibuat, dan kita bisa mengupload file JS kita. Jika teman2 tidak memiliki file JS, maka bisa di-download dulu file JS saya di SINI sebagai contohnya.

Setelah teman2 mendownload contoh file JS tersebut, maka teman2 bisa menguploadnya ke web hostingan masing2.

Setelah menguploadnya teman2 bisa mengambil URL file JS tersebut. Cara pengambilannya seperti biasa, Klik kanan pada tulisan "unduh" >> pilih opsi "Copy Link Location" >> lalu pastekan ke notepad atau ke program teks lainnya, maka URL File JS tersebut seperti berikut


http://sites.google.com/site/webhostingannyaiqbal/javascriptku/emoticonplus-v2.js?attredirects=0&d=1


Nah, untuk menggunakannya...teman2 harus menghapus tulisan ?attredirects=0&d=1, sehingga menjadi


http://sites.google.com/site/webhostingannyaiqbal/javascriptku/emoticonplus-v2.js


Selanjutnya URL file JS tersebut siap digunakan untuk membuat widget (NB: file JS di atas berfungsi untuk membuat widget emoticon di kotak komentar, untuk penjelasannya lihat di postingan: INI), contoh pembuatan:


<script src='http://sites.google.com/site/webhostingannyaiqbal/javascriptku/emoticonplus-v2.js' type='text/javascript'/>



Sekarang script widget siap digunakan, selamat mencoba...cara membuat web hosting di Google Sites SELESAI!


Semoga Bermanfaat []


Tags: Apa itu Google sites, bagaimana menggunakan google sites, cara daftar ke Google sites, memiliki web hosting di Google Sites

Rabu, 30 Desember 2009

Memasang Emoticon pada Kotak Komentar Blogger Versi Dua

Kalau kemarin-kemarin kita sudah membahas cara memasang emoticon pada kotak komentar postingan blogger (dah lama sekali sih), dan kali ini bisa dikatakan sebagai lanjutannya atau versi dua atau apa lah terserah teman2 mau menamakannya apa. Sebenarnya dari tata cara pemasangannya sama2 aja, hanya saja bedanya nih...jumlah emoticon pada pembahasan kita kali ini lebih banyak dari pada emoticon yang kemarin2 itu. Wohoooo...jadi lebih mantep kan, tatkala para pengunjung blog kita ingin mengekspresikan emosinya...wuohohoho mantep

Sebelumnya, walau emoticon ini hasil oprak-aprik saya sendiri...namun masih menggunakan gaya/style emoticon bikinannya mas Uda. Maslahnya bingung mau bikin gaya seperti apa, sebelumnya sih kepikiran ingin bikin dengan gaya sendiri, yaitu emoticon dengan gaya spoiler lalu untuk menambah emoticon pada kotak komen, para pengunjung tinggal mengkliknya (gak ada kopi-pastean), sampai2 gara2 terlalu semanggat saya juga dah download sampai 130-an lebih emoticon + cartoon lucu lainnya, wal akhir itu semua gagal dilaksanaken...maslahnya waktu buat bikin model yg satu ini memang butuh kesabaran n waktu yg super luang. Yah, sebagai penggantinya saya bikin yg satu ini aja lah, hanya membutuhkan waktu yg relatif sedikit (dibanding yg tadi). Dan sekali lagi thanks yo mas Uda, dah memberi inpirasi yg benar2 bermanfaat.

Yohooo...kembali ke tutorial. Jumlah emoticon kali ini sampai 54 buah emoticon (yg kemarin 36 buah), teman2 bisa melihatnya pada screen shot berikut





Bagaimana...mantapkan? Bagi teman2 yang tertarik buat masang emoticon tersebut ke blognya, silahkan diperaktekkan langkah2 berikut ini...

Login dulu ke blogger, lalu klik Tata Letak/Layout >> Klik Edit HTML (dan jangan lupa untuk mencentang kotak expand widget templet)

Lalu letakkan kode script berikut tepat di atas kode tag </body>

<script src='http://sites.google.com/site/t4belajarblogger/js_t4belajarblogger/emoticonplus-v2.js' type='text/javascript'/>





Selanjutnya langkah terakhir...yaitu letakkan kode berikut di atas kode: <b:if cond='data:post.embedCommentForm'>


<div style='overflow:auto; width:100%px; height:200px; padding:5px 5px 5px 5px; background:#FFFFFF;'>
<center><b>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifAa0bGI1y3PyNentvIf1mOrfUZxfHYIp4BNtR0XoAfXOlP2YNfH6Sm0RWC9twBMxOx5XiMgwq2h_wPxmYb3nHsEfnAIqhrQuWgPqfFG0kCHMp6Q3QkwzDcEWqoo-01qeqF7ia9ls6doSA/s128/t4belajarblogger36.gif'/>:10
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjN6Mu8wLW9mrJhWOD0bmQ1bFCbGKbiIW4O8jJW9eAYxEqFzyOcqaIvagXKzScf5Y_HTtyUXQPzg0jFtHLSuMND3zu55n40MRelgoF9CMrBDvofNmc2yd1EyVLbacrCs3H0K5trsxA5D6az/s128/t4belajarblogger37.gif'/>:11
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-GV6BUVVVPtjqId6QbOAH9DK9BA5TLOrHE5aSPVqOE6t1UBP2LCeSbyS1zlSc0-M_2MkoPq-8OtYrpn1S8zNRf_S6U58IfYHnj5Tbt-Y1nNwnacqNn_na8Qvqs4eSQa3O0XDevkH7G73l/s128/t4belajarblogger38.gif'/>:12
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiq_3EzMo6n45wUzj1AF8_aYoRa5ILAWH-iIKLI3hSQKMZ9hkigOFl0C9EqMW4BxlG7ASvZkOIA9Jde90gX1LeiyO_jt9wNK28ReJ_4wA1ipHwYqaNdoedYV1BHys-6OsVA4fmkhBFBPlOF/s128/t4belajarblogger39.gif'/>:13
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEispaNee7StkC25Ux4apPpjWNj572J1E-C2wFCHdpvtq3Wz9lUhP62PAJyRrUhH-xDKtbc8-wHOAASgb0TWT57MbWiarBeA7shLJ9lXwF07rTnQ7l17CuCSU9mHiWZG4H3ZrxH6Srg9gRzt/s128/t4belajarblogger40.gif'/>:14
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGlH10gpnKo_RzAc1gu4juG0WXxhH0_EKLDt71cqfBNLeWgPspZ8S7eQ2CFeSYNc8SMuHy-HtQ9_P3TJcdpw5zkbtULJWRvNHTWQgRqGTzJZD5RdxmstplWqxqI-0mpn-UoYhaFJ37mHJn/s128/t4belajarblogger41.gif'/>:15
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA9CryIHKHn113ILaQgpfQ7HGVROYPIF60GVrjCjZk9vUQY59QHPz8-WKFXwqzSbQoL1BKyuBJKRE5Wnfmi-dkKIrQrdHhEB-u58oaOkwL9ZzCI42tNn_Hwmn1olAhRtDA85GLtYXkYgRP/s128/t4belajarblogger42.gif'/>:16
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdV8iVq5LmeSz4QpIcN4wQbeb4TLdGqAorHz_tCCc9iLVwFAZEWhMqd9h9WmiQrhA18uOtOsDwY3Yt1Ke1flkOuncjgESf6otMpfn0q4iSMY0VJ5vcKiS9HfWt4RojoxNFpUs5nZAcDi3l/s128/t4belajarblogger43.gif'/>:17
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9Or4rtC-C4n_sL9ugRmoezXu56TC3q7k54ZU57HoeRJCuE5HO4UhMtukFr-gVcpaDPR3L-yjIKjP0rmw2IKIMsiwTJRLKxfK5l7XbCvRvFqdEe5qNiqQ0ZZRQm9ZGK4pil9SYnooYOBnq/s128/t4belajarblogger44.gif'/>:18
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQE_2X6x5y9gQI2b8iwG1rie_A6RKOHym0pWUAa4W-XK8G5DuS4s1WJJtHraXZ_wBj4r1jj569OHJkk7gWaZyMkIt9EBtnkjV2rs3mVnEnngSyx7MVqlOkxfFgJR5cPUTupy47CPp3mbGL/s128/t4belajarblogger45.gif'/>:19
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT6_ptFmqvD39Vvo1TG34R1K8ttksn6yRoTbdf7DIXrbfZSigwUsJrG5LfIGGDAGpxKl8YYdKfi3Ukuisy0XHed5JeaMGWBkCm2QcbRmx1iyFPjad05Xi9DwRWltgAoat7L7LPl4z3B4uO/s128/t4belajarblogger46.gif'/>:20
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhVAwUk5hHvNH6dJfCSfuMy1Eq83Jjh1CFiSwMcwsYVxF9MNwNoaLrTPxcN9EozuYIVYLRtqg4TDKO0oUHuy0IgWSj3il5lyE72UkvwpxRk1xhGJuaB4ANb94SXCdGvM81QREuK2ms4tw3/s128/t4belajarblogger47.gif'/>:21
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHHE0b0o6WO2_ra570VjBC-0_ZRE32g2w4laByIM8nR8ubQCVt-clxq45_3dER7b-GkXg5IuKPrcN7O8j36nsEtFzGsXoAmvzbpWw4XcOmNjPCWGOle9S7oHw5oFmja5zSJfHohF-C_zFK/s128/t4belajarblogger48.gif'/>:22
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrIqV3hRr3yWRCi8KSJ1GoNF8lUPRQiAjnxywlSUj7yx70th796iAAHjxT10IE7WUl0fQ81A6ty2WDmdauKia2-xdY9tEVW5yPpD6XHB4zEeRBhu9JBL__Z9NKvnM03gXqq9vQHfYa2AJC/s128/t4belajarblogger49.gif'/>:23
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixA32Xs7RqJL38lQS2KFqxMxljh72LkxMvigWYSY3npN9Xybr1PclpHQ0HF3hcZo9ISfDjx0VBDbr0sp5SLQnj1Cih3RFc1BRuEmf4dcMd4dtsM4NWuA0dm3tWo-kYd34AgwBqGOxE-F7I/s128/t4belajarblogger50.gif'/>:24
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnaMuxktz_8oirAQqpi7dRCnGS2CgPxrphyYSmsS7gbzNCO-y1lKkfndfvo_wWkPoJnVK717cByAuibgZKKGStegyIg0q5PaV-lz6uH0TshvGhONtmrpTyaz3bkxlUc48Crk-pIZzZhsKJ/s128/t4belajarblogger51.gif'/>:25
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj1dgc0vqslhQoryXwVsr7TFXNP8bGwhqeN3GzU-coRKtR_f6YKXe0yNwkcYhVxTMJZuQ01P6CKm5gDkLDTgX6UPopRiAZiPp9mqiWfjGVP7DTrzp-sUs3nycRUVRKkHG7dpxz3AwUm9vdr/s128/t4belajarblogger52.gif'/>:26
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDdYin6u9DrXFvHB8GPLkJ07W4rKonCDF7qLTZuDVt0WRP16r08RzFcWdAxbJ6KjGhcNStra75Y7o-wGM7rbbMbIOqIkOkMXbzwbbeTrZVSRg6s3JixtIWpnPx-8AsVxwEkJ3-9V87ZLov/s128/t4belajarblogger53.gif'/>:27
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrS2Cv_qMD_HzN2qik8bfQM7grGbHEeZOE4Sf4CfimOGqFdgEyG3UnSSj5Fj13DDcNmXWtR39gXubY3amPG7czO12j1jWiUJpO6rGxd_gZAs6RfOEiNxD3zrvHwlePEu0lPoj5cXGM9jSX/s128/t4belajarblogger54.gif'/>:28
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiW8jAl8Ist6JXdFR8K95kBWYQF3Ac4bWw70e3n5LPmocPmY8bG16fB4gtv6lWVewXWf7yck-Z314DcKDW4AaI4XMXN0sGk02YU218OUJJHLxFE-3iDJNNcwwdVCGyrF1a4X8UwojgkToVO/s128/t4belajarblogger55.gif'/>:29
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgTfgU90qPRkAWLGlAaYvZF8cUV9Tf8IxV4IT8jGpuP2K-TIBCWc0hPQMxxdK2ukjzDR9MxJ9Mlh1txhev_Zm9ym1fb3X2lxlSAxolR1JbzMozNXDDTkWUUMHCFbpGY-9i8Mf7dUi2ZFv6/s128/t4belajarblogger56.gif'/>:30
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgo5S6HEJyEI3LfEedqXL-AWRcTbunRT4la7EYszFlBG8uB6HzlDQR37_ignv0t4x26Xo_tW9Y1za4RfEYUAIEZAiQ1RzTimNBPkfcdIa3mSyh7gU5Mdo0RYEiMvE_Cf7sNCkex65wZxcr9/s128/t4belajarblogger57.gif'/>:31
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhOv7vvuaLiXULFIAjpOK6ToGxjkwginWSJ-USzB1a0jzRVzwy_m3HpihAadXlq0Bp8dSru8DaW14KFWgObDbHeZsDJ51Zib5jq-NRudi8o2s38qSkg58muWQ-ijBchFVMxKQvjfJ77Avr/s128/t4belajarblogger58.gif'/>:32
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG0OuAwJkTjAXQSg-oBnvI07bMRuN5Co0Inmo1AvI7SgwyMknCBbZbPGpnQVbiiibE_juWpqwGHLXhkSiLvFDYGJLGdCdt4UF8Ld_NuYlXR5kV98RzQOVnqbMaZOiIzfuInvVE6CcBbgeg/s128/t4belajarblogger59.gif'/>:33
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpRaBFQX5mG_LKSdq8vnogClPQ4ASjxpQeKvaIN0VlqOvXhW38YCbZpg-qArsuEQSTefL3S0Ru79BYmj9rVWcZFbPtzVYxFstUT6mThiuaS4J5r6Kctjqg3o_S8XeoCNmoppy40pV0IJDx/s128/t4belajarblogger60.gif'/>:34
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLqKCjZB09NF3NMomgc_HzzqJZp4tNLaenvAMYN-7ytdhphRSp9rfwASuUQPPfp912j0O4h_Wqan3fnfI_VKePXoqHYL0cXgnmFGKR2aLDPF1Kudl4wwZ7II4Kt3-g8RLs4jeVwNNQCeG_/s128/t4belajarblogger61.gif'/>:35
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD5weneMBsXlVBrrpwtIMhKNZr6Ksjf4cJw-4fVqN0nkkr4VY0CZLM9Ou1sVhLfBT7nrC66zoT7Xt47UsWRaKrjUCfduyf7H_UnSY0IUYOFHdX-iOkADtT7xR3SmatNvxtpbhjEFGG_kgV/s128/t4belajarblogger62.gif'/>:36
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgT455nvIruDFIdPmiEHYkdipHOTIqs2Y3FIlkHpCFZk3Wy0D_y7DfGx93_5sAnhjMJWBsGs26x593MoGopnss0K1ElXkROh_207PetoMoSyaQnjKWlkdZKR9tF687WAfqYYw2eToBlF5yw/s128/t4belajarblogger63.gif'/>:37
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiTFBl_GWozLebhQ13OVS8W2QONEbyrUny2C0usowuZLgT8TgmwKuhtRj6d0Xic7-ypyImfev5TkKGLTIKdCoZc8vmrujer81BpzZFs4Vf-s-x_DssXTlkMNCVOfByUsufs28IVmp_T63G/s128/t4belajarblogger64.gif'/>:38
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZkhDvYPjRf7a_w9UzUQSdX8ivk8gkvjkMgjNLRy6_lFJyK4w068LFtvXDlHDw2rvEDD0KEQ6j5M1onVBY4fDoj23RE3niyIJ_pgi6cINJTY3oBaPFTRezYCR8rbyw7bHLpTJD13oKvn6U/s128/t4belajarblogger65.gif'/>:39
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQn7Bx3fA3aCXgPNI07oTqryADsHg9sygxegWj8rDao4rkY6ZGWfmVmpOTN8SsK9VbUleG94JE4wXv9DSWs04f8fB6zk3TqK9_CBn5it6yJxCvQe5v9q-uCSPwbZPzE_HvOFoEyoRJviWT/s128/t4belajarblogger66.gif'/>:40
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwStYuG_Ap4_aiOqwwWxHBIMhs2Yx7aplfATeKjbug1owypburVq1PMBGfEIVfEdRgzW1XkCU2rbvQnyzUlcn19qhCEpp2DN5XBPorFs36dBtvMl3BBE8dCVqRJnDZGOeBMGtdLeX96AtZ/s128/t4belajarblogger67.gif'/>:41
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjR4289nTkRXzUmTe9dolxMa8yVn5JJbruHKAtVXpjdQ1Vv-KT0huvObifYrA92hboaSSPFB_YW8y1ialZVSzYFs5TvCEeJXbcvIVnpe1lLfoU1tokP7I840klr6UbGBy68zfIMYC9YAnIt/s128/t4belajarblogger68.gif'/>:42
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhneV06ABR7qV84GzXZizN6x1XrjhMH7kfydxGX5SB3TiumAeskvgUPU4knCgAMglb0cKU6gKPceVA3ux_kKP5ntBUlg9gYBngtBSP9Pw4e_mMWTzav9K6F7qAVu3mbbGI1gvIlM95hpCul/s128/t4belajarblogger69.gif'/>:43
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxyMwTg-rbSXLLLcb79xwGrV2nOHXuMh847MZlrQ82lPRDvysYaJkupaA_cyAXW7Pm_bWglCNHk7yguE4B2rWtoHvBLhDP7AWADXyEr58825xXA73tbQdX1Hksj11E_emS03b844ehZiOS/s128/t4belajarblogger70.gif'/>:44
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbLxm7UXaxSw6Z9E9IE0_y-EMzLDtN-u4_ZUAG4TIhZqr2tKfKC-ONOdrXwTPVYFq3pco2TiQjHh1ocIxTCWwQzBicSQFtVn_KRvPoU_O6sX4tXkoiHYZ6v1wMjyIZFFX3aIFxqICk-lEe/s128/t4belajarblogger71.gif'/>:45
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhE8gvBxOgVMlHdeunykySLB2wFDuFajpNC7_3mt5RBUzrYgeAf89HctZd9SMkg4SgkHV9xnPXfF4G3lwyd70-tBUh7Rg34gdEyhapqyAk_2g3JJEuYkB29yg6e9-wKSmCU8qTk4SI1vURm/s128/t4belajarblogger72.gif'/>:46
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqfPTEBlSeRC2Q9cqrDTZAVw8xiBEntLKC5KSXQghKps2V-P4IpqFKqcuyMFUA1Ib8tvcIMrpZxT93xRi62NWZmzk6ny1hu6tLYBawFbqdeI15fAUq9bZ7yYTz-QmM7itdeEfeVmW1Ij5E/s128/t4belajarblogger73.gif'/>:47
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmiKFLyf3lAA9CNAONbaUiDsc1ZypVt73S3lMVNGu4TEHAHtVVKDcUICXtw-YKM6tBLE1OdvovzcRqRpBFfMWDII8HOlNYNRo7rAW8qxvjLpO8LksR_aTn9O05nsFneqz2W9IM9zD8Hkyw/s128/t4belajarblogger74.gif'/>:48
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwYbgwvCmdV0Mzy2Rbu2MUtMK6Nluih1Lq68OW6JBxV4MghPQhHD0_sb6HEdHZ_GRRsuQSeQDgdodEJdwMvUZMqKxKanjEReZ4ymaSoOphixydnFXnQLvOct9Tvly4uxsQ4c_LnHlffwXl/s128/t4belajarblogger75.gif'/>:49
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh82P2L9ZaEd8BJ6_PyEaBD3TCZGAXPszKwhszy0BLrDgwTdZ1w7x2WKQSkmRdxrdZORL7aYQFxHvzUwnITwjN32L6CKkZhCY6zFMLX-lCiaLRYLjfuyW57DkCA7LynjzojQO78WA3sakmH/s128/t4belajarblogger76.gif'/>:50
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_QZzaKHhhFq7CVhSrx2coLdPGZIJCTDXG0Y97FyFMpcoRMYWLUJiH0IzlATPN1HAYgiqD03PeHdCZasLnG-3XaYAgIXQyhj5IfwhRFHliLsJVr4jIxvjJ_Eh-wNYDh0ZiQwWpcKSualfv/s128/t4belajarblogger77.gif'/>:51
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGlUisDMhUXfGLOAh_pUevaxpg5gOZ9AnHnYWEcorNyLUEX8ZesbHKoDQe_yAQ_N0OHtMzRwjt34aB1WS_KdrR-R398yTV2uuUHp53Jh2F6jvpI-qmyn73FbXIQ4t-7wsblgQh56iIt5Ed/s128/t4belajarblogger78.gif'/>:52
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeS5O3dbBH_OjVrxi6hQoFFeCHDZaVL5K1q9B8pZAjKcKlE7Inv926dyVqCbpfYoNIUkxhporsv18k5CfGv0UqSuwhDqnQaKdfZOknmb7pJMC_78Wtx51NEj2x9KZIB700Vh3m-RdItQK4/s128/t4belajarblogger79.gif'/>:53
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvuwn-T1m1LBhA7Ksx-YNW12xGOC5ygI70Ff7nqJaC7v8uJhkx9fZqZh4RUsgX7tTtMUSP9JPRkkGJy_3VT0YcUFRc_1f2lDsNllEs7NGEZJvfuh9G9dVckCuazFmcjFrzwb8ow4Joe3zk/s128/t4belajarblogger80.gif'/>:54
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEien4nMJQqUpmLL-T0NLq3KksnJP3VxILYDaPJOvUEegXMXCOFudswq3RR2ybxY95FWK4l7D-aRm-weR9vc_9bWbSJ1HiTDAtrnRT1XJuzzObMEEaRCsDZM566C28sdPIf_TAcjSucdskSo/s128/t4belajarblogger81.gif'/>:55
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpWNUdX2-J1_3hnxBtlI0HpwlpBe3fEtjNZbFUfHU8qE8u1gxNGanzMnfZXSZbEqSngy-BhKtJmW1D6PEYi20vmfksTvgnzx7pKGmThEkEZBxuv1Q2gLpZlgr4zv88iB-0ROpoVfgzoOBA/s128/t4belajarblogger82.gif'/>:56
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuV03fQnfGBL2pP8JUOK_btvAtO9jpC3olatTBjNgq4uAVYkH0SlBOJSlg1q0p5QVzfi3ISl4iWA1jbeanWoHOeg4Bc0C_vcs_Wf7ZNEhlcaRzt8BBs_azqI796Ng8E9f5po2QuiGJrfK4/s128/t4belajarblogger83.gif'/>:57
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRyFQafy8Li_UxPlAZdeKHcgKRevRzlp3b1SFz0RPgfpfoYFEVM7B8IuDtMmAIORlpA5nPXyOSSkfQegTL6VugOlPXYxdYJ_tgO7-7-UhJB6DEb7LFUmtKBSjvOe8rmWtXt7EsGoOoOmrl/s128/t4belajarblogger84.gif'/>:58
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBWZiwOPcFESUxAwBadVkViYYF6JkPYX3calsEEU6lfVSukAoZ5TaxycrGB_IWzMUphQ0GePDh2cYAikC5zjOWeakrB5cGBOpazq-Kkkf-KLgosWNmLaYBXKFRFEkkX4F-mv4X110D9_ZJ/s128/t4belajarblogger85.gif'/>:59
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEja_0EJF6htCLwNLnkGAj1UOXT1jkWlem2zzJ4PCVzxCLsOYdwO6qfhIhuqgXzGMgEw7LDDBYV5r7wYWQdlnX4OMXCL23-KzAnnoJPhksR4f6zeBl1qlQjae1XmD0uUpaAWsa97X8rrK8VW/s128/t4belajarblogger86.gif'/>:60
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrt1gT-jVaCW4p9qgoigQJVbvyBP-sqm-_3GzP38LNoI9U1hOywoe-MnR3ytvapDt0L_3TYW5Aa7HVCKiu8lBoKmpVln1vdbpNYUxIQ3jftbfl2WHV7NoynZhdF723cMwcoUOVwlRBNclc/s128/t4belajarblogger87.gif'/>:61
<br/>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-fwWne_A3tuQWLCSxfuLHCZnPRRsO1F_xDeJ8olakLpYURWN-PFTYFGixLr96QO3EslkXFKnNadB3TRThVhlFAVQ_ni2lgtmWyPrf7iSVAnzpEohyphenhyphenZA6SKlyZxb8tMhvOMwwK6MusGCq6/s128/t4belajarblogger88.gif'/>:62
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGM8mIaJnMSEVN2ZUmQI6lO8k8s_XKholmf1lPckgl8RMRm6bhgCmbhpqJWeeyU6st0loWPbToompDFi8q7OGLWgm5Rae4GLz4siKHlT49xxlB_V7CmSV1qISb4ETAK3IGiIay-OXauSSy/s128/t4belajarblogger89.jpg'/>:63
</b></center>
</div>






Dah itu jangan lupa klik simpan template...


Gampang tooo...coba sekarang lihat tuh hasilnya di blognya tman2, sekalian nyoba bikin komen sendiri buat testing awal.

Kalau ada maslah atau pertanyaan, langsung saja diposting pertanyaan teman2 di kolom komentar, atau bisa juga kontak admin (bagi tman2 yg gak mau pertanyaan dilihat yg lain ==> tapi saya balasnya agak lama lho)...dah dulu ya


Semoga Bermanfaat []

Tags: Cara memasang emoticon untuk blogspot, cara memasang emoticon untuk blogger, memasang emoticon di komentar, cara pasang emoticon dengan kode, HTML emoticon ,kode script emoticon, emoticon versi dua

Senin, 28 Desember 2009

Memasang Navigasi Halaman Posting Ala Google

Kalau kemarin2 kita sudah membahas cara memasang fitur navigasi halaman biasa (bertombol), nah sekarang waktunya kita membahas cara memasang navigasi halaman ala Google. Seperti yang telah teman2 ketahui, bagaimana bentuk dan wajah navigasi halaman google, pasti sederhana dan menarik, yang kemudian memilki corak warna-warni yang semisal dengan logonya (Google). Bagi teman-teman yang tertarik untuk menampilkan navigasi halaman ala Google ke dalam blognya, monggo bisa diperaktekkan melalui langkah2 yang akan kita bahas dalam postingan kali ini.

Sebagai gambaran, berikut ini adalah navigasi halaman asli milik Google



Lalu yang di bawah ini adalah (gambaran) navigasi halaman yang terpasang di blog kita



Ok, cuap2nya kita sudahi. Langkah pembuatannya seperti biasa, sekarang silahkan login dulu ke akun blogger, lalu klik Tata Letak >> Edit HTML (Expand widget templet-nya gak usah dicentang)

Selanjutnya letakkan kode berikut di atas kode tag ]]></b:skin>


#nav a,#nav a:visited,.blk a{color:#000}
#nav a{display:block}
#nav .b a,#nav .b a:visited{color:#20c}
#nav .i{color:#a90a08;font-weight:bold}
.csb,.ss{background:url(http://sites.google.com/site/t4belajarblogger/gambar/nav_logo_ala_google.png) no-repeat 0 0;height:26px;display:block}
.ss{background-position:0 -88px;position:absolute;left:0;top:0}
.cps{height:18px;overflow:hidden;width:114px}
.mbi{width:13px;height:13px;background-position:-91px -74px;margin-right:3px}
#nav td{padding:0;text-align:center}




Lalu letakkan kode berikut tepat di atas kode tag </body>

<script type='text/javascript'>

var home_page_url = location.href;


var pageCount=10;
var displayPageNum=6;
var upPageWord ='Previous';
var downPageWord ='Next';


function showpageCount(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';



htmlMap[htmlMap.length]='/';
postNum++;

for(var i=pageCount-1, post; post = json.feed.entry[i]; i=i+pageCount) {


var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);
var title = post.title.$t;
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'&amp;max-results='+pageCount;

}

var banyaknomer = htmlMap.length;
if (json.feed.entry.length % pageCount == 0){
var banyaknomer = htmlMap.length -1 ;
postNum=postNum-1;
};


for(var p =0;p&lt; banyaknomer;p++){
if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){
if(fFlag ==0 &amp;&amp; p == thisNum-2){
if(thisNum==2){
upPageHtml = '&lt;a href=&quot;/&quot;&gt;&lt;span class=&quot;csb ch&quot; style=&quot;background-position: 0pt 0pt; margin-left: auto; width: 44px;&quot;&gt;&lt;/span&gt;&lt;div style=&quot;margin-right: 8px;&quot;&gt;'+ upPageWord +'&lt;/a&gt;&lt;/td&gt;';
}else{
upPageHtml = '&lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;&lt;span class=&quot;csb ch&quot; style=&quot;background-position: 0pt 0pt; margin-left: auto; width: 44px;&quot;&gt;&lt;/span&gt;&lt;div style=&quot;margin-right: 8px;&quot;&gt;'+ upPageWord +'&lt;/a&gt;&lt;/td&gt;';
}

fFlag++;
}

if(p==(thisNum-1)){
if(p==0){
html += '&lt;span class=&quot;csb&quot; style=&quot;background-position: -26px 0pt; width: 18px;&quot;&gt;&lt;/span&gt;&lt;/td&gt;&lt;td class=&quot;cur&quot;&gt;&lt;span class=&quot;csb&quot; style=&quot;background-position: -44px 0pt; width: 16px;&quot;&gt;&lt;/span&gt;'+thisNum+'&lt;/td&gt;';
}else{
html += '&lt;td class=&quot;cur&quot;&gt;&lt;span class=&quot;csb&quot; style=&quot;background-position: -44px 0pt; width: 16px;&quot;&gt;&lt;/span&gt;'+thisNum+'&lt;/td&gt;';
}
}else{
if(p==0){
html += '&lt;td&gt;&lt;a href=&quot;/&quot;&gt;&lt;span class=&quot;csb ch&quot; style=&quot;background-position: -60px 0pt; width: 16px;&quot;&gt;&lt;/span&gt;1&lt;/a&gt;&lt;/td&gt;';

}else{
html += '&lt;td&gt;&lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;&lt;span class=&quot;csb ch&quot; style=&quot;background-position: -60px 0pt; width: 16px;&quot;&gt;&lt;/span&gt;'+ (p+1) +'&lt;/a&gt;&lt;/td&gt;';
}
}

if(eFlag ==0 &amp;&amp; p == thisNum){
downPageHtml = '&lt;td class=&quot;b&quot;&gt; &lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;&lt;span class=&quot;csb ch&quot; style=&quot;background-position: -76px 0pt; margin-right: 34px; width: 66px;&quot;&gt;&lt;/span&gt;'+ downPageWord +'&lt;/a&gt;&lt;/td&gt;';
eFlag++;
}
}
}

if(thisNum&gt;1){
html = ''+upPageHtml+' '+html +' ';
}
html2 = '&lt;table id=&quot;nav&quot; style=&quot;margin: auto auto 1.4em; border-collapse: collapse;text-align: center; direction: ltr;&quot; align=&quot;center&quot;&gt;&lt;tbody&gt;&lt;tr valign=&quot;top&quot;&gt;&lt;td class=&quot;b&quot;&gt;Page ('+(postNum-1)+') &lt;/td&gt;&lt;td class=&quot;b&quot;&gt;';
html3 = '&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;';
html = html2+html;

if(thisNum&lt;(postNum-1)){
html += downPageHtml;
}else{
html += '&lt;td class=&quot;b&quot;&gt;&lt;span class=&quot;csb&quot; style=&quot;background-position: -76px 0pt; width: 42px;&quot;&gt;&lt;/span&gt;&lt;/td&gt;';
}



if(postNum==1) postNum++;
html += html3+ '&lt;/div&gt;';


var pageArea = document.getElementsByName(&quot;pageArea&quot;);
var blogPager = document.getElementById(&quot;blog-pager&quot;);

if(postNum &lt;= 2){
html ='';
}

for(var p =0;p&lt; pageArea.length;p++){
pageArea[p].innerHTML = html;
}


if(pageArea&amp;&amp;pageArea.length&gt;0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}


}


function showpageCount2(json) {

var thisUrl = home_page_url;
var htmlMap = new Array();
var isLablePage = thisUrl.indexOf(&quot;/search/label/&quot;)!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf(&quot;/search/label/&quot;)+14,thisUrl.length) : &quot;&quot;;
thisLable = thisLable.indexOf(&quot;?&quot;)!=-1 ? thisLable.substr(0,thisLable.indexOf(&quot;?&quot;)) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';



var labelHtml = '&lt;a href=&quot;/search/label/'+thisLable+'?&amp;max-results='+pageCount+'&quot;&gt;';
var thisUrl = home_page_url;

htmlMap[htmlMap.length]=labelHtml;
postNum++;

for(var i=pageCount-1, post; post = json.feed.entry[i]; i=i+pageCount) {
var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);


var title = post.title.$t;

if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&amp;max-results='+pageCount;

itemCount++;
}

var banyaknomer = htmlMap.length;
if (json.feed.entry.length % pageCount == 0){
var banyaknomer = htmlMap.length -1 ;
postNum=postNum-1;
};

for(var p =0;p&lt; banyaknomer;p++){
if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){
if(fFlag ==0 &amp;&amp; p == thisNum-2){



if(thisNum==2){
upPageHtml = labelHtml +'&lt;span class=&quot;csb ch&quot; style=&quot;background-position: 0pt 0pt; margin-left: auto; width: 44px;&quot;&gt;&lt;/span&gt;&lt;div style=&quot;margin-right: 8px;&quot;&gt;'+ upPageWord +'&lt;/a&gt;&lt;/td&gt;';
}else{
upPageHtml = '&lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;&lt;span class=&quot;csb ch&quot; style=&quot;background-position: 0pt 0pt; margin-left: auto; width: 44px;&quot;&gt;&lt;/span&gt;&lt;div style=&quot;margin-right: 8px;&quot;&gt;'+ upPageWord +'&lt;/a&gt;&lt;/td&gt;';
}

fFlag++;
}





if(p==(thisNum-1)){
if(p==0){
html += '&lt;span class=&quot;csb&quot; style=&quot;background-position: -26px 0pt; width: 18px;&quot;&gt;&lt;/span&gt;&lt;/td&gt;&lt;td class=&quot;cur&quot;&gt;&lt;span class=&quot;csb&quot; style=&quot;background-position: -44px 0pt; width: 16px;&quot;&gt;&lt;/span&gt;'+thisNum+'&lt;/td&gt;';
}else{
html += '&lt;td class=&quot;cur&quot;&gt;&lt;span class=&quot;csb&quot; style=&quot;background-position: -44px 0pt; width: 16px;&quot;&gt;&lt;/span&gt;'+thisNum+'&lt;/td&gt;';
}
}else{
if(p==0){
html = '&lt;td&gt;'+labelHtml+'&lt;span class=&quot;csb ch&quot; style=&quot;background-position: -60px 0pt; width: 16px;&quot;&gt;&lt;/span&gt;1&lt;/a&gt;&lt;/td&gt;';
}else{
html += '&lt;td&gt;&lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;&lt;span class=&quot;csb ch&quot; style=&quot;background-position: -60px 0pt; width: 16px;&quot;&gt;&lt;/span&gt;'+ (p+1) +'&lt;/a&gt;&lt;/td&gt;';
}
}


if(eFlag ==0 &amp;&amp; p == thisNum){
downPageHtml = '&lt;td class=&quot;b&quot;&gt; &lt;a href=&quot;'+htmlMap[p]+'&quot;&gt;&lt;span class=&quot;csb ch&quot; style=&quot;background-position: -76px 0pt; margin-right: 34px; width: 66px;&quot;&gt;&lt;/span&gt;'+ downPageWord +'&lt;/a&gt;&lt;/td&gt;';
eFlag++;
}
}
}




if(thisNum&gt;1){
if(!isLablePage){
html = ''+upPageHtml+' '+html +' ';
}else{
html = ''+upPageHtml+' '+html +' ';
}
}

html2 = '&lt;table id=&quot;nav&quot; style=&quot;margin: auto auto 1.4em; border-collapse: collapse;text-align: center; direction: ltr;&quot; align=&quot;center&quot;&gt;&lt;tbody&gt;&lt;tr valign=&quot;top&quot;&gt;&lt;td class=&quot;b&quot;&gt;Page ('+(postNum-1)+') &lt;/td&gt;&lt;td class=&quot;b&quot;&gt;';
html3 = '&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt;';
html = html2+html;

if(thisNum&lt;(postNum-1)){
html += downPageHtml;
}else{
html += '&lt;td class=&quot;b&quot;&gt;&lt;span class=&quot;csb&quot; style=&quot;background-position: -76px 0pt; width: 42px;&quot;&gt;&lt;/span&gt;&lt;/td&gt;';
}

if(postNum==1) postNum++;
html += html3+ '&lt;/div&gt;';

var pageArea = document.getElementsByName(&quot;pageArea&quot;);
var blogPager = document.getElementById(&quot;blog-pager&quot;);

if(postNum &lt;= 2){
html ='';
}

for(var p =0;p&lt; pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&amp;&amp;pageArea.length&gt;0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}


}


</script>

<script type='text/javascript'>

var thisUrl = home_page_url;
if (thisUrl.indexOf(&quot;/search/label/&quot;)!=-1){
if (thisUrl.indexOf(&quot;?updated-max&quot;)!=-1){
var lblname1 = thisUrl.substring(thisUrl.indexOf(&quot;/search/label/&quot;)+14,thisUrl.indexOf(&quot;?updated-max&quot;));
}else{
var lblname1 = thisUrl.substring(thisUrl.indexOf(&quot;/search/label/&quot;)+14,thisUrl.indexOf(&quot;?&amp;max&quot;));
}
}

var home_page = &quot;/&quot;;
if (thisUrl.indexOf(&quot;?q=&quot;)==-1 &amp;&amp; thisUrl.indexOf(&quot;.html&quot;)==-1){
if (thisUrl.indexOf(&quot;/search/label/&quot;)==-1){
document.write('&lt;script src=&quot;'+home_page+'feeds/posts/summary?alt=json-in-script&amp;callback=showpageCount&amp;max-results=99999&quot; &gt;&lt;\/script&gt;')
}else{document.write('&lt;script src=&quot;'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&amp;callback=showpageCount2&amp;max-results=99999&quot; &gt;&lt;\/script&gt;')
}
}
</script>





Klik Simpan Template.


Silahkan lihat hasil kerjaan anda. Kalau navigasi halamannya kok gak bisa muncul...berarti ada satu kemungkinan besar penyebabnya, yaitu postingan anda masih terlalu sedikit untuk menggunakan fitur navigasi. Oleh karena itu bagi teman2 blogger yang ingin menggunakan trik ini, disarankan untuk memilki jumlah postingan dgn jumlah minimal 15-21 ke atas...

Wah...itu kok kode yang harus di taruh di atas kode tag </body> kok panjang sekali...? Iya sob, memang panjang. Tapi kan gampang to, tinggal kopi lalu paste di atas kode tag </body> miliknya anda (gitu aja kok repot, hohoho^). Jangan khawatir maslah trik ini dapat bekerja atau tidak. Karena kalau gak dapat bekerja, pasti gak saya posting (lihat bikinan saya di T4bb-demo.blogspot.com Maaf, blog demo telah saya hapus. InsyaAllah fungsi akan terus bekerja, thanks).

Kalau ada maslah atau pertanyaan mengenai navigasi halaman ala google, silahkan post pertanyaannya teman2 di halaman komentar, ntar saya jawab. Atau bisa juga nanya lewat form kontak admin, dah dulu ya...





Semoga Bermanfaat []

Tags: Cara membuat navigasi seperti Google, memasang halaman dengan nomor seperti google, navigasi halaman HTML, script navigasi halaman Google

Sumber Trik: Abu Farhan
Tutorial Style: Iqbal