Cara Membuat Gambar melayang Pada blog

Salah satu hal terpenting dalam dunia blogging adalah melakukan publikasi. Baik publikasi blog kamu di blog lain dengan melakukan tukar link atau mempublikasikan posting kamu di blog kamu sendiri dengan menggunakan gambar melayang. Nah pertanyaanya apa itu gambar melayang?

Gambar melayang adalah gambar yang letaknya tidak berubag meskipun blog di scroll ke bawah atau keatas itu yang saya maksud floating image atau gambar melayang. contohnya bisa anda lihat pada blog ini juga. Nah untuk bisa membuat gambar melayang, berikut adalah cara untuk membuat gambar melayang pada blog :

1. Login ke blogger trus klik "Layout -->> Edit HTML
2. Cari kode ini ]]></b:skin> kalo dah ketemu taru kode berikut ini di atasnya.

#gambar_melayang {
position:fixed;_position:absolute;bottom:0px; left:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }

3. Text yang dicetak tebal adalah posisinya, kalo pingin ganti di posisi pojok kanan bawah tinggal text "left" diganti dengan "right". Begitu juga tulisan "bottom", jika pingin di posisi atas bisa diganti dengan "top".
4. Langkah selanjutnya yaitu letekkan script berikut ini sebelum kode </body>

<div id="gambar_melayang">
<a href="http://linkblogkamu.com">
<img src="http://linkgambarkamu " border="0" /></a>
</div>

5. Jika kamu pingin yang ada disitu bukan gambar tetapi jam/kalender/hit counter/widget-widget yg lain, maka ganti text yang berwarna merah dengan script widget-widget tersebut.
6. Simpan hasil kerja kamu dan lihat hasilnya.

READ MORE - Cara Membuat Gambar melayang Pada blog

Membuat Recent Comment dengan Scroll pada Blog

Udah lama neh gak Update posting tentang tutorial blog. Nah sekarang mumpung ada waktu saya ingin sedikit berbagi kepada sahabat blogger semua. Posting kali ini kita membahas tentang cara membuat Recent Comment dengan Fungsi Scroll pada blogger. Sebenarnya pada posting sebelumnya saya telah membahas tentang Membuat Recent Post dan Recent Comments blog. Namun pada cara tersebut tidak ada fungsi Scroll-nya.

Fungsi Scroll ini sebenarnya sangat bermanfaat untuk meningkatkan nilai estetika dari sebuah blog dan tentunya juga untuk menghemat tempat agar blog anda tidak terlalu memanjang ke bawah. Nah untuk Membuat Recent Comment dengan Scroll pada Blog berikut adalah langkah-langkahnya :

1. Login ke akun blogspot teman-teman,


2. Klik Design >> Page Element >> Add a Gadget >> HTML/Javascript,


3. Isi kontent gatget yang akan anda tambahkan dengan Kode HTML/Javascript sebagai berikut :

<div style="overflow:auto;width:240px;height:400px;border:1px solid #eee;padding:8px;margin:10px 0 0"> <script style="text/javascript" src="http://files.bloggerplugins.org/widgetcomments.js"></script><script style="text/javascript">var a_rc=10;var m_rc=true;var n_rc=true;var o_rc=60;</script><script src="http://agorepost.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script> <div style="font-size:9px; padding:8px 0px 0px 0px"><a href="http://agorepost.blogspot.com/2010/08/membuat-recent-comment-dengan-scroll.html"/>Grab this Widget</a> by agorepost</div></div>

4. Ganti tulisan yang berwarna merah dengan alamat Url blog teman-teman, lalu silahkan di atur sendiri seberapa lebar dan tinggi widgetnya dengan merubah tulisan yang berwarna biru, kemudian atur banyaknya recent comment yang masuk dengan merubah tulisan berwarna hijau dan terakhir atur jumlah karakter kata yang akan ditampilkan dengan merubah tulisan warna oranye.


5. Jika sudah klik Save dan lihat perubahannya, view blog. Selamat mencoba Membuat Recent Comment dengan Scroll pada Blog.

Sekian posting saya untuk kali ini, lain waktu saya akan tambahkan lagi. Semoga bermanfaat.

READ MORE - Membuat Recent Comment dengan Scroll pada Blog

Agorepost Free SMS

WIDGET SMS GRATIS

SELAMAT MENGGUNAKAN

Grab this Widget

Nb : Kami TIDAK BERTANGGUNG JAWAB atas isi Pesan yang dikirim Kami menjamin Privasi Nomor Kamu 100% TIDAK dishare, di Jual Belikan dll. Layanan ini di buat dan di berikan oleh Club IT Mahasiswa G X R G - Gunadarma Xmalang Research Groups, NON Profit.

READ MORE - Agorepost Free SMS

Membuat Widget Free Sms for Blogger

Kalo diperhatikan sekarang portal sms gratis di Internet sudah mulai menjamur dan ada dimana-mana. Kalau saya tidak salah awalnya portal sms gratis untuk indonesia ini bermula dari applikasi di Facebook, namun kini sudah banyak yang mendirikan portal sms gratis di situs mandiri.

Service sms gratis ini dipercaya mampu meningkatkan traffic bagi web atau situs yang memasangnya karena memungkinkan pengguna untuk selalu kembali menggunakan fasilitas service sms gratis ini. Nah, bagaimana dengan blogger??

Untuk blogger tidak usah khawatir, kalian semua juga bisa meletakan Fasilitas SMS gratis di blog kalian kok. Nah berikut adalah cara untuk membuat Widget Free Sms untuk Blogger. Berikut adalah Contoh Widget Free Sms yang dibuat pada Posting

1. Cara yang pertama adalah dengan log in ke akun blogger kalian.
2. Copy Kode berikut :

<iframe name="I2" src="http://s1.gxrg.org/home/"  style="border: 0px solid rgb(255, 255, 255);" frameborder="0" height="340" scrolling="no" width="85%"> not support</iframe><br /><small><center><a href="http://agorepost.blogspot.com/2010/08/membuat-widget-free-sms-for-blogger.html" rel='dofollow'>Grab this Widget</a></center></small><br />

3. Kemudian Pastekan kode tersebut pada Sidebar atau pada postingan blog sesuai selera kalian. Untuk kode yang berwarna merah, dapat kamu ganti ukurannya sesuai selera dan space blog yang kamu miliki.
4. Yang terakhir baca berdoa dan lihat hasilnya, dan yang terpenting jangan malu bertanya jika memang tidak bisa. Selamat mencoba kawan.

READ MORE - Membuat Widget Free Sms for Blogger

Membuat Scroll Box Pada Blog

Setelah beberapa minggu absen dalam membuat posting blog, akhirnya saya kembali menyempatkan waktu untuk menambahkan informasi di blog yang saya cintai ini, Kali Saya akan membahas beberapa cara untuk membuat Scroll Box pada blog. Mungkin Sudah sangat banyak sekali cara untuk membuat Scroll box di Internet, untuk itu saya mencoba merangkumnnya sehingga disini ada banyak cara untuk membuat Scroll box pada blog.

Fungsi Scroll Box sendiri adalah untuk menghemat tempat atau space pada blog sehingga blog/content yang isinya panjang bisa ditentukan Ukurannya. Contoh Scroll Box bisa dilihat pada salah satu posting saya disini.

Nah berikut adalah beberapa Cara untuk bisa membuat Scroll Box pada blog anda :

Cara pertama

<div style="overflow: auto;background-color:#C7DFB5; margin: 0px auto; padding: 5px; height: 200px;width: 94%;text-align: left;">
Copy paste yang ingin ditampilkan </div>

Cara pertama ini adalah cara favorit saya karena lebih mudah digunakan.

Cara Kedua

<div style="width: 395px; height: 400px; background-color: a0ffff; color: 000000; font-family: arial; font-size: 12px; text-align: left; border: 0px solid 00000; overflow: auto; padding: 4px;">Copy paste yang ingin ditampilkan</div>

Cara kedua ini anda bisa menentukan panjang dan lebar scroll box yang anda inginkan dan juga menentukan warna background scroll box.

Cara Ketiga

<div class="'rbbox'"><div style="'margin:0;"><Copy paste yang ingin ditampilkan></div></div>

Cara Keempat

<div class="'rbbox'"><div style="'margin:0;"><Copy paste yang ingin ditampilkan></div></div>

Nah anda tinggal meng-Copy kode tersebut ke posting blog anda dan menambahkan Isi Scroll box dengan content yang ada inginkan dengan mengganti kode yang berwarna biru. Untuk kode warna merah dapat kawan-kawan ganti sesuai keinginannya baik untuk menentukan ukuran atau sekedar merubah warna. Selamat mencoba semoga bermanfaat.

READ MORE - Membuat Scroll Box Pada Blog

Cara Memasang TV Online di Blog Anda

Anda punya blog? pasti…
Anda sering ngeblog ? pasti…Nah…kalo anda lagi ingin ngeblog …tapi acara TV lagi bagus2 gimana caranya , acara ngeblog jalan terus nonton TV bisa..ya caranya Nonton TV Online di Blog aja.
Ok pada bagian kali ini saya mau ngasih tahu ( bagi yang belum tahu aja nich …) cara instal atau memasang TV online di Blog kita.Berikut adalah Cara Mudah Nonton TV Online di Blog :

1. Anda copas aja script di bawah ini dan anda tempatkan di blog anda.

 <span style="font-weight:bold;">Live TV (Mivo TV-RCTI-TRANS TV-SCTV-GLOBAL TV):</span><br /><br /><iframe src="http://zons.000a.biz/etc/tv/multitv01.html" scrolling="no" frameborder="0" height="321" width="376"></iframe><br />

1. Save hasil kode kamu.
2. Yang terakhir adalah berdoa. hehehe...

Kode bisa di sidebar, postingan, page baru atau di mana aja terserah anda.
Terus anda gak perlu khawatir dengan di pasangin TV Online apa membuat loading blog kita jadi lambat?Kode ini tidak terlalu mempengeruhi load blog kamu, jadi gak terlalu menjadi permasalahan. Berikut adalah hasilnya jika di pasang di posting blog :
Live TV (Mivo TV-RCTI-TRANS TV-SCTV-GLOBAL TV):

READ MORE - Cara Memasang TV Online di Blog Anda

Membuat Widget Artikel Terfavorit pada Blogger

Salah satu cara untuk meningkatkan page view pada blog yang kalian buat adalah dengan menambahkan link-link posting favorit yang sudah banyak dikunjungi dan dikomentari oleh para pengunjung blog. Dengan menambahkan widget artikel terfavorit masalah di atas dapat terjawab dengan sempurna. Mau tau bagaimana cara membuat widget untuk Artikel Terfavorit?? Berikut adalah panduannya untuk membuat widget artikel terfavorit bagi pengguna blogger atau blogspot.

Langkah-langkah yang wajib dilakukan untuk membuat widget artikel terfavorit pada blogger :

1. Log in ke account blog kamu di blogger.com
2. Setelah masuk di dashboard pilih design atau rancangan.
3. Pada tab page elements pilih add a gadget dan pilih HTML/JavaScript.
4. Setelah window add HTML/Javascript terbuka, masukan kode berikut ini :
<script type="text/javascript"> function pipeCallback(obj) { document.write('<ul style="text-transform: capitalize;">'); var i; for (i = 0; i < obj.count ; i++) { var href = "'" + obj.value.items[i].link + "'"; var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>"; document.write(item); } document.write('</ul>'); } </script> <script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=28a6afad7c6ba1288c1b738277e42385&url=http%3A%2F%2Fwww.urlblogkamu.blogspot.com&num=7" type="text/javascript"></script> <a href="http://agorepost.blogspot.com/2010/07/membuat-widget-artikel-terfavorit-pada.html" target="_blank"><span style="font-size: xx-small;">Popular Posts Widget</span> | <a href="http://bloggerstop.net" target="_blank"><span style="font-size: xx-small;">Free code</span></a>
5. Jangan lupa untuk mengganti tulisan berwarna merah yang ada pada kode di atas tersebut.
   ganti urlblogkamu (JANGAN PAKAI HTTP:// ) dengan nama blog kamu dan angka 7 dengan angka lain sejumlah posting / artikel favorit yang ingin anda tampilkan.
6. Save widget yang telah kamu buat tersebut dan segera liat hasilnya.

Jika kamu benar mengikuti langkah-langkah diatas maka widgetnya akan tampak sebagai berikut (hasil akan berbeda-beda pada tiap blog berdasarkan template yang digunakan.)

Selamat mencoba, baca juga Menghilangkan Judul Pada Widget Blogger (HTML/Java Script dan Text).

READ MORE - Membuat Widget Artikel Terfavorit pada Blogger

Membuat Recent Post dan Recent Comments blog

Recent posts dan recent comments merupakan salah satu widget dasar yang sering digunakan oleh para blogger. Fungsi dari widget ini adalah untuk menampilkan komentar dan posting terbaru yang ditinggalkan oleh yang bersangkutan. Sehingga pembaca blog ataupun penulis blog bisa langsung menindaklanjuti hal tersebut.

Dulu untuk membuat recent post dan recent comment perlu yang namanya javascript, namun sekarang kita tidak perlu susah-susah lagi untuk membuat widget tersebut dengan menggunakan javascript karena blogger sudah menyediakan widget ini di widget featured blogger.

Bagi Anda yang belum tau tentang cara menggunakan widget ini silahkan ikuti panduan dibawah ini. Karena cara memasang widget ini di blog anda sangatlah mudah :

1. Masuk pada "Design→ Page Elements"
2. Lalu Klik tombol "Add a Gadget"
3. Kemudian klik tombol "Featured"
4. Cari gadget Recent Comments ataupun Recent Post (tergantiung kebutuhan anda), untuk menggunakan widgetnya klik tanda (+) atau bisa juga klik gambarnya.
5. Nanti akan muncul window baru, kemudian Isi nama widget dan juga Tinggi widget dan beberapa entry lainnya yang diminta.
6. Selesai dan lihat hasilnya.

Bagaimana cukup mudah bukan?? saya yakin tanpa gambar pun anda sudah bisa membuatnya dengan mengikuti langkah di atas. Adanya dua widget diatas adalah bukti bahwa blogger semakin maju dan memperhatikan para penggunanya.

READ MORE - Membuat Recent Post dan Recent Comments blog

Membuat daftar Isi Blogger Berdasarkan Katagori

Salah satu hal terpenting untuk memperbanyak page views dari blog adalah ketersediaan list content / artikel yang dimiliki oleh blog tersebut. Salah satu cara meningkatkan page views adalah dengan membuat daftar isi dari blog tersebut. Adanya daftar isi pengunjung akan lebih mudah untuk "berjalan-jalan" di blog kita. Apalagi jika daftar isinya bisa diplih berdasarkan Katagori yang ada.

Daftar isi ini merupakan hasil olahan seorang blogger muda asal Makasar, Copycat91. Kelebihan lain dari daftar isi ini adalah bisa melihat ringkasan dan bisa mencari berdasarkan katagori blog, atau lebih tepatnya melihat paragraf awal, dari sebuah artikel (jumlah karakternya bisa kita tentukan sendiri), sehingga dapat menarik pembaca untuk mengetahuinya lebih lanjut.

Berikut adalah langkah untuk Membuat daftar Isi Blogger Berdasarkan Katagori:

1. Login ke blogger.com
2. Setelah di dashboard pilih New Post / Entri Baru.
3. Kemudian berilah judul posting kamu dengan nama Daftar isi atau apapun yang tujuannya memberitahu kalau link tersebut adalah daftar isi blog kamu.
4. Langkah selanjutnya cantumkan kode java script dibawah ini :

<div style="overflow:auto; border: 1px solid #CCC; margin:0px; padding:10px; width:auto; height:900px; background-color:#E1D8D8; text-align:left;"> <div id="cl_option"> Loading... </div>

<div id="cl_content_list"> </div> <script type="text/javascript">var jumlah_kata_dalam_ringkasan = 200;</script> <script src="http://agorepost.googlecode.com/files/daftar_isi.js"></script> <script src="http://Agorepost.blogspot.com/feeds/posts/default?alt=json-in-script&callback=onLoadFeed&max-results=9999"></script></div>

5. Untuk merubah warna background kamu dapat merubah kode warna #E1D8D8 sesuai dengan keinginan kamu agar warna lebih sesuai dengan tampilan blog kamu.
6. Jangan lupa untuk mengganti Agorepost dengan URL / nama blog kamu.
7. Kamu juga bisa mengatur jumlah kata dalam ringkasan dengan mengubah nilai variabel jumlah_kata_dalam_ringkasan disini saya menggunakan 200. Kamu bisa menggantinya degan 500, 400, 300 dsb.
8. Setelah selesai jangan lupa pilih Publish Post dan lihat hasilnya.

Sebagai tambahan, Letakan link post daftar isi ini di halaman utama (home) blog kamu atau letakan di sidebar atau di menubar blog kamu agar orang mudah untuk melihatnya dan tertarik untuk mengeclik-nya. Selamat Mencoba.

READ MORE - Membuat daftar Isi Blogger Berdasarkan Katagori

Membuat Live Traffic Feed Widget pada Blogger

salah satu cara untuk menghiasi blog adalah dengan menambahkan widget yang juga bisa menunjang penampilan serta kinerja blog. Widget yang sering digunakan oleh kebanyakan blog salah satunya adalah Live Traffic Feed dari feedjit. Keunggulan widget ini adalah kita mengetahui siapa saja yang datang ke blog kita, waktu datang, dan daerah asal pengunjung. Contohnya ada disini Pada bagian ini akan dibahas cara untuk membuatnya.

1. Login dulu di blogger anda. (hal ini dikarenakan pada widget Feedjit Live Traffic tidak menyediakan copy paste kode HTML melainkan secara otomatis akan terhubung dengan blog anda).
2. Silakan buka page baru lalu kunjungi http://feedjit.com/hpt/botw/
3. setelah halaman terbuka sempurna akan tampil tawaran untuk meng-Coztumize tampilan Live Traffic widget yang akan anda pasang di Blog anda. Setelah selesai menyesuaikan penampilan dan memilih blogger sebagai blog anda, Klik Go.
4. Maka akan muncul halaman istruksi untuk menginstal widget ini ke blog anda, klik pada tombol "click to open in new window and install on blogger"
5. Kemudian saat dihalaman blogger, pilih blog kamu dan beri nama widget ini. Lalu click add Widget.

Setelah semuanya selesai silakan lihat blog anda. Apabila letak widget yang baru saja anda buat tidak sesuai dengan harapan anda, silakan anda masuk kembali ke "Dasboard" pilih "Design/Rancangan", kemudian cari Widget sesuai judul yang anda beri tadi. Silahkan geser widget dengan men-drag sesuai dengan letak yang anda inginkan. Selamat mencoba...

READ MORE - Membuat Live Traffic Feed Widget pada Blogger

Menghilangkan Judul Pada Widget Blogger (HTML/Java Script dan Text)

Baru-baru ini Blogger mengeluarkan kebijaksanaan baru dalam dunia blognya, yaitu dengan mengharuskan pemberian judul pada setiap elemen / widget yang akan kita buat. Bagi yang sekarang masih aktif menggeluti blog di blogger mungkin akan tahu. Ketentuan ini berlaku untuk Elemen yang berjenis HTML/Java Script dan juga Teks.
Kebijakan baru ini mungkin lebih banyak mengganggu daripada menguntungkan, apalagi untuk para publisher adsense yang sering bertujuan untuk menyamarkan iklan yang mereka buat agar lebih menyatu dengan blog mereka.

Perhatikan gambar di atas. Gambar di atas merupakan gambar contoh peringatan kepada blogger agar tidak mengosongkan kolom judul. (wah, gimana dong mas, saya inginnya kan kosong....??). Jangan khawatir pada bagian ini akan dibahas trik untuk mengosongkan judul elemen tersebut. Perhatikan langkah Menghilangkan Judul Pada Widget Blogger berikut ini :

1. Login seperti biasa
2. Klik Rancangan/Design
3. Klik "Tambah Gadget" pilih Gadget dengan tema HTML/Java Script atau bisa juga yang Teks
4. Isilah kolom konten widget dengan kode HTML maupun script yang anda inginkan. Lalu pada judul widget (widget title) isikan kode berikut:

<agorepost></agorepost>


5. Lalu pilih Save...

Nah dengan cara tersebut di atas Insya Allah Blogger akan terkecoh sehingga judul yang seharusnya tampil tidak akan tampil. (Semoga Om Blogger tidak marah yah...). Untuk kode yang digunakan sebenarnya tidak mutlak harus <agorepost></agorepost>. Namun yang perlu ditekankan adalah Tag HTML-nya. Dapat juga digunakan kata sembarang seperti <Tipsblog></Tipsblog>  dll yang penting kata awal dan akhir harus sama dan jangan lupa dengan format kode seperti pada contoh. Selamat Mencoba.

READ MORE - Menghilangkan Judul Pada Widget Blogger (HTML/Java Script dan Text)

Merubah icon Bloger pada Address Bar

Salah satu ciri dari blog mungkin bisa dilihat dari bentuk tampilannya dan Icon Blog tersebut. Icon ini berperan penting sebagai brand dari blog tersebut. layaknya Logo Facebook yang mungkin semua orang sudah paham bagaimana bentuk dan warnanya.

Walau sudah banyak yang memposting tentang bagaimana cara merubah Icon, tidak ada salahnya bila saya juga menambahkan informasi tersebut dengan cara saya. Pada posting kali ini kita akan membahas bagaimana cara merubah Icon Blog pada Address Bar anda yang berbasis Blogspot. berikut adalah contohnya :

Yang perlu anda sediakan adalah sebuah gambar yang bisa mencirikan blog anda. Gambar bisa berformat JPG, PNG atau bahkan GIF dalam bentuk animasi. Untuk hasil yang lebih baik, gambar tersebut sebaiknya berukuran 32x32pixel.

Pada blog ini saya menggunakan gambar huruf B tersebut. Gambar ini nantinya yang akan diletakan pada blog yang akan kita rubah tampilan Icon pada Address-nya. Langkah yang harus dilakukan adalah dengan mencari atau membuat gambar icon yang akan digunakan pada blog kita (saran saya sih lebih baik untuk membuat sendiri karena akan lebih identik dan tidak ada yang menyamai). Gambar bisa dibuat dengan Corel atau Adobe Photoshop. Jika gambar telah ada, lakukan langkah berikut :

1. Upload gambarnya (saran saya diphotobucket.com jika belum terdaftar di photobucket.com silakan register disini)
2. Setelah selesai upload akan muncul gambar anda dan ambil kode URL gambar anda. berikut adalah contoh URL gambar saya.

http://i771.photobucket.com/albums/xx351/agonaldo/Blog%20image/Untitled-2.png

3. Untuk memasukkan ke blog anda silakan kembali ke Dasboard blogger anda, masuk ke menu Design kemudian pilih Edit HTML, jangan lupa klik Expand Widget kemudian temukan kode berikut

</head>

4. Setelah itu letakkan kode dibawah ini diatas kode </head>

<link href='http://i383.photobucket.com/albums/oo276/0512_photo/enny-1.jpg' rel='SHORTCUT ICON'/>

ganti kode yang berwarna merah dengan URL gambar yang anda dapatkan di photobucket.com tadi
5. Kemudian save template dan liat hasilnya.

Terkadang kita tidak bisa langsung melihat perubahannya pada browser kita setelah menempatkan kode tersebut.untuk bisa langsung melihatnya, hapus history dari web browser anda terlebih dahulu. Selamat mencoba.

READ MORE - Merubah icon Bloger pada Address Bar

Membuat Flag Counter

Pernahkah anda melihat blog yang dipercantik dengan adanya widget Flag Counter. Bagi anda yang belum pernah melihatnya anda bisa melihatnya di sini. Untuk gambaran bagi anda, ini ada screen shoot gambar flag counter yang bisa dijadikan pilihan untuk mempercantik blog kamu.

Fungsi dari Flag Counter ini adalah untuk menampilkan negara yang berkunjung ke Blog atau web kamu.untuk bisa mendapatkannya anda cukup mengklik Disini. Setelah itu silakan kostumasi Flag Counter sesuai keinginan kamu dan dapatkan kodenya.

Setelah itu pasang kode tersebut di blog kamu. Jika kamu masih bingung dan jika blog kamu blogger kamu bisa ikuti panduan cara pemasangan widget disini.

READ MORE - Membuat Flag Counter

Menampilkan Kode HTML di posting blog

Dalam dunia blogging sudah bukan cerita kalo kita sering berbagi widget ataupun berbagi tips tentang bagaimana mempercantik tampilan blog. Namun terkadang kita mendapati kesulitan saat akan menampilkan kode html taupun java script pada suatu posting. Pasalnya kode tersebut pasti akan terjalankan dan bukan tampil sebagai tulisan. untuk mengatasi masalah tersebut anda bisa gunkan link berikut :

• http://centricle.com/tools/html-entities/
• http://www.opinionatedgeek.com/

Copy kode html atau java script yang akan anda ingin tampilkan, dan kemudian click encode.

Hasil Encoding ini yang nanti bisa anda tempel di posting blog anda.
Selamat Mencoba.
Baca juga "Cara Praktis Tingkatkan Back Link Blog Kamu"

READ MORE - Menampilkan Kode HTML di posting blog

Translator Bendera mini untuk Blogger

Perbahkah anda melihat widget translator dengan bendera-bendera unik? Kalo belum tau anda bisa melihatnya disini. Nah untuk membuatnya, kamu cukup mengcopy kode html dibawah ini dan memasangnya di blog kamu.

<style>
.translate img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
border:0;
padding-left:0px;
}
.translate:hover img {
filter:alpha(opacity=50);
-moz-opacity: 0.50;
opacity: 0.50;
border:0;
}
</style>

<div style="text-align:center">
<a class="translate" href="#" target="_blank" rel="nofollow" title="English" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cen&hl=en'); return false;"><img alt="English" border="0" align="absbottom" title="English" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7xqRuOKxUDGRO2hzBic1YW_2EvQ2jPlzoFRqabGwh0koG0k91PQ0xoAJ_TE7tYHoKQE0Gr8zffFIh1uKCqCKi3aWpWXMGg8VEZNlc4HgrhhQvChQHTJrshFn4oxMeESKHyJlNb9HIWN4y/s144/uk-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="French" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cfr&hl=en'); return false;"><img alt="French" border="0" align="absbottom" title="French" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSzZB8CCx-NvK5togxu-DAHvqDqqg9gamF6k3nrWuQDRl02ORPj0A9rsU7XTkBHqOmOnNufjnfeixncTCbDKNglhpkWE-yLiD7mRKh3Rhxn_YC66T3SKSlCaLDIWSKo5g1FL0_m9mdw1xq/s144/france-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="German" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cde&hl=en'); return false;"><img alt="German" border="0" align="absbottom" title="German" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnCQpTs0KY7Sq_OcpoBOJnDlEaQBGP_JU7Ay6u1eXOxFRQCv-UpbUylQOJ0WGCMk9WoYzdmFRxJKT5bgoHrBMo-avjPtVCSiJyFTFHR3crbkUjl8JJxkDmOajj-qRSyX2_NoSxmxggxDr5/s144/german-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="Spain" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Ces&hl=en'); return false;"><img alt="Spain" border="0" align="absbottom" title="Spain" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic3G4gPLKJRjhtXv6kZPYJjT1CCUSVdQexhHe-t1sJXz7MjvlwLrTbke3ZEwD3s0QvJSQIhKSYJnZAu2HUhd-QH1agW0bnxAV17DZBEaHxzrwXUkiICv13brD0S3K7-TAe-SWLkOK8UgAv/s144/spain-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="Italian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cit&hl=en'); return false;"><img alt="Italian" border="0" align="absbottom" title="Italian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiM3PoW4jmMVKIKuyjWOCwze_njORpB4GDajeImaeidTm2O3U6hRsyCpKSiZ0qj5CRXd3lqNKYDQM9-oFzzhirMIRpAfBKDjTysCMvz8_1ZOPAvAlUF4APCzlr3xmxrijDCfuQj5H-nWtVf/s144/italy-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="Dutch" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cnl&hl=en'); return false;"><img alt="Dutch" border="0" align="absbottom" title="Dutch" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPZPbpA0sZbzkJLcR9EekGzeSs9Pfil8FJCtIPGiRYHZQXOEQSaPbrdH8LZ0wnXTioJAlqrdOlA2mlMfa7k-B0_3MXJq1Id0SgPPWsxGuwUsK3nucHH-rKG4KFHepO7MpN6UhpSnzcrV9Y/s144/dutch-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>
<br/><br/>
<a class="translate" href="#" target="_blank" rel="nofollow" title="Russian" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cru&hl=en'); return false;"><img alt="Russian" border="0" align="absbottom" title="Russian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxoO5Jy859kkVklHGkyfmizBPtzOregS4c0GU6H8jYFKaxfCmm3_Kw-YDlWbWyGv3bERSF98czmJr4gsB4Mieqaw8epub56cdN_bmkn0TIihlbRM7NDhPpohsqfiLCW3_HFoxlua9plXgC/s144/russian-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="Brazil" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cpt&hl=en'); return false;"><img alt="Brazil" border="0" align="absbottom" title="Brazilian" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEbUlmX73SGg0imdA_KTLVH19GuU9vVk2ncID2maTt4_8gctY972k5SrL0fbj5R-CkFyhbvO3cgZtrTGVWU3BO11DghVkbCnviHDYHc14WDXRshUrBy8YaUfK9Uw_1NYnTPcdwAOYAsPth/s144/brazil-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="Japanese" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cja&hl=en'); return false;"><img alt="Japanese" border="0" align="absbottom" title="Japanese" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8y6RBoo0vUgUHsEyN_oDF9ZwxyuKpuXrm6W326vrskXyMIZe2kNHC_RrBSyYIBNg4E2PyBW2mITvThrJlw_RWG5vXkKsBJ3fkyURu-_wCWMLL-huCJar1NBAyUUDQxpiKt9Lab-7QIA7i/s144/japan-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="Korean" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Cko&hl=en'); return false;"><img alt="Korean" border="0" align="absbottom" title="Korean" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb0vIVD8z9uPpMJuv-WlzB0IwNBDnNu-SbNsoYmSz6oElZ192cotvrCoh2vOIJEDQL7M17BDdz9fMxWzJR5tluQhSrKb2xRgdL4DzD1IA4JpaugqUkx32qgs7HympwYR__DRgIXVMhaWBD/s144/korean-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="Arabic" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Car&hl=en'); return false;"><img alt="Arabic" border="0" align="absbottom" title="Arabic" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAozNfBLr8jJJ9Z9t2RzM6ADR24uICNbFDGodNav6kso_qV3p6fDgGMRc6bgrW1kp9pyZdsgh8_1pwaWYWUqiYaTnQxLJbZj7XKXgFE2PXq_AN0ZGLSuu-wXzh6N8XKXMVMZeypdoKbQZh/s144/arab-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<a class="translate" href="#" target="_blank" rel="nofollow" title="Chinese Simplified" onclick="window.open('http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&langpair=id%7Czh-CN&hl=en'); return false;"><img alt="Chinese Simplified" border="0" align="absbottom" title="Chinese Simplified" height="24" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWnRfAwL4hsC2YueWAeuXpV1VH-p4reXhWHOhvwLW1s79DATuVA1s5M8Lph3iEBb-dzMtAQjHFZK9hhiE5chdfZuzl1pOmj2d7BDVOKjaFRGq79p3ejOO5XLMKz4lJSLZkv6i-tGjeYbS7/s144/china-flag.png" style="cursor: pointer;margin-right:8px" width="24"/></a>

<div style="font-size:9px; padding:8px 0px 0px 0px">
<a href="http://agorepost.blogspot.com/2010/05/translator-bendera-mini-untuk-blogger.html"/>Grab this Widget</a>
</div></div>

 Kalo belum tau cara pasang widget kamu bisa ikutin langkah berikut :

    * Login ke Blogger dengan id kamu
    * Klik Dashboard
    * Pilih menu Layout dan pilih page element
    * Pilih add a Gadget
    * Pilih HTML/JavaScript
    * Pastekan kode html tadi di kolom yang disediakan
    * Klik Done
    * Klik Save Changes
    * Kunjungi Blog Anda
Selamat mencoba, kalo artikel ini membantu tolong tinggalkan komentar yah.

READ MORE - Translator Bendera mini untuk Blogger