Download @Guusnara Blogger for Android

Kalian tidak perlu lagi buka blog ini di PC atau Laptop kalian, cukup dengan mendownload aplikasi untuk android ini, kalian bisa melihat update posting-posting di blog ini secara GRATISS !!!

www.guusnara.blogspot.com

Klik Codenya Lalu Tekan CTRL + C
Tampilkan postingan dengan label HTML. Tampilkan semua postingan
Tampilkan postingan dengan label HTML. Tampilkan semua postingan

Senin, 29 Oktober 2012

Membuat Anti Klik Kiri dan Kanan

Membuat Anti Klik Kiri dan Kanan ~ Nah selanjutnya Guusnara akan memberikan trik Membuat Anti Klik Kiri dan Kanan pada blog anda. Sebelumnya Guusnara sudah memberikan trik Membuat Anti Klik Kanan Dengan Message.Ok langsung saja ke scripnya.

  1. Loggin ke blogger anda.
  2. Klik Template > Edit HTML > Lanjutkan.
  3. Sebelum lanjut, terlebih dahulu backup Template anda.
  4. Cari kode </body>
  5. Kemudian masukkan script ini sebelum kode  </body>.
  6. Anda dapat mendownload scripnya "DISINI" dengan format "script.txt".
  7. Simpan Template anda.
  8. Anda juga bisa menempatkan script tersebut pada postingan anda cukup dengan Klik "Entri Baru" > "HTML" lalu masukkan script pada Step No.5.
  9. Done !!!
Selamat Mencoba. Happy Bloggers !!

Jumat, 05 Oktober 2012

Membuat Teks Alay

Membuat Teks Alay ~ Bagi anda yang suka sama tulisan-tulisan yang "4laY", Guusnara akan memberikan trik Membuat Teks Alay. Tidak perlu berbasa-basi lagi silahkan dicoba Tool dibawah ini dengan cara memasukkan teks anda pada kolom yang tersedia, kemudian centang pilihan yang tersedia sesuai dengan keinginan anda, dan Generate teks tersebut. Mudah Bukan, Selamat Mencoba !!. G0 4l4y !!.



Masukan Text Anda :

BeSaR keCil P4k3 4n9k4 Disngkt


Hasil Text Alay :

Membuat Teks Terbalik


Membuat Teks Terbalik ~ Guusnara akan memberikan trik Membuat Teks Terbalik. Perhatikan tulisan berikut ini. "¿ ıuı ıʇɹǝdǝs uɐsılnʇ ʇɐnqɯǝɯ uıƃuı ɐpuɐ ɥɐʞɐdɐ ˙ʞılɐqɹǝʇ uɐsılnʇ uɐʞɐdnɹǝɯ ıuı". Nah, jika anda ingin buat tulisan seperti tadi cukup memasukkan teks anda pada kolom yang tersedia, maka teks yang anda buat akan langsung menggenerate menjadi Tulisan Terbalik. Selamat Mencoba !!.

Masukkan Teks Anda :


Hasil Text Terbalik :
Powered by Guusnara : Various Tips and Trick

Sabtu, 15 September 2012

Membuat URL Tidak Terlihat

Membuat URL Tidak Terlihat ~ Tentu dari anda masih asing dengan Post Membuat URL Tidak Terlihat. Nah Guusnara akan memberikan sedikit tips cara Membuat URL Tidak Terlihat, Biasanya jika anda mengarahkan kursor salah satu link maka akan muncul URL seperti ini.
Biasanya akan terlihat pada pojok kanan atau kiri bawah pada Browser anda. Jika anda ingin URL anda tidak terlihat, cukup dengan mengisi kode berikut di Entri/Post anda.

<form action="http://contoh.com">
<input class="download" type="submit" value="Link Ini" /></form>
Untuk yang berwarna Merah isi dengan URL yang diinginkan, dan yang berwarna Biru ganti dengan judul untuk URL tersebut. Maka hasilnya akan seperti ini.

Semoga bermanfaat buat anda. Salam Bloggers !!!.

Minggu, 09 September 2012

Membuat Gambar Bergerak

Membuat Gambar Bergerak ~ Sebelumnya Guusnara sudah memberikan cara Membuat Tulisan Bergerak nah sekarang Guusnara akan memberikan trik Marquee dengan gambar. langsung saja.

  1. Login ke Blogger anda.
  2. Buat sebuah Entri Baru.
  3. Gunakan mode "HTML".
  4. Kemudian masukkan kode dibawah ini.
    <marquee onmouseout="this.start()" direction="up" align="center" scrollamount="2" onmouseover="this.stop()" width="100%" height="100"><img src="http://img716.imageshack.us/img716/8595/guusnaraexchangelinklog.png" alt=""/></marquee>
  5. Untuk tulisan yang berwarna Merah merupakan arah bergerak gambarnya, untuk lebih jelasnya silahkan kunjungi Membuat Tulisan Bergerak
  6. Sedangkan yang berwarna Biru ganti dengan URL gambar anda.
  7. Pratinjau atau publikasikan post anda.
  8. Hasilnya akan seperti ini.
  9. Done !!!.
Mudah bukan. Untuk anda yang belum mengetahui cara memasukkan sebuah Link, silahkan kunjungi Cara Membuat Link. semoga bermanfaat. Happy Blogging !!!.

Cara Membuat Link

Cara Membuat Link ~ Guusnara akan memberikan tips untuk anda yang tidak mengetahui Cara Membuat Link dengan kode HTML. Sebelumnya Guusnara akan membahas sedikit mengenai pengertian dari Link.
Link adalah sebuah teks atau gambar yang menjadi perwakilan dari sebuah Url suatu situs dan apabila di klik maka muncul Url yang menjadi tautan pada teks atau gambar tersebut.
Lalu bagaimana Cara Membuat Link tersebut, Guusnara akan bahas disini.

~ Untuk membuat Link dalam bentuk teks pada HTML dasar, anda cukup menambahkan tag <a> serta menambahkan atribut href didalamnya, contohnya seperti ini.
  • <a href="url">Anchor Text</a>
  • Kode  <a> dan </a> merupakan tag HTML untuk membentuk suatu link. Jadi biasakan jika anda membuat kode html harus ditutup dengan penutup garis miring ( / ) seperti pada kode diatas.
  • href merupakan link Url yang akan dituju setelah diklik. contoh http://guusnara.blogspot.com.
  • Anchor Text merupakan isi atau perwakilan dari link yang akan anda klik.
  • Contoh pengisiannya akan seperti ini.
    <a href="http://guusnara.blogspot.com">Guusnara Blog</a>
  • Maka hasilnya akan seperti ini >> Guusnara Blog.
  • Jika anda ingin Url anda terbuka pada halaman baru cukup anda menambahkan kode target="_blank"
  • Contoh kodenya seperti ini.
    <a href="url" target="_blank">Anchor Text</a>
  • Sebagai contoh pengisian kodenya akan seperti ini.
    <a href="http://guusnara.blogspot.com" target="_blank">Guusnara Blog</a>
  • Hasilnya silahkan diklik >> Guusnara Blog

~ Untuk yang dalam bentuk gambar maka tagnya adalah <img> dengan format seperti dibawah ini.
<a href="url tujuan"><img src="url gambar"></a>
  • Contohnya seperti ini.
    <a href="http://guusnara.blogspot.com"><img src="http://img716.imageshack.us/img716/8595/guusnaraexchangelinklog.png"></a>
  • Hasilnya >>
Demikan tips dari Guusnara semoga dapat bermanfaat buat anda semua. Salam Bloggers !!!.

Membuat Tulisan Bergerak

Membuat Tulisan BergerakMembuat Tulisan Bergerak merupakan variasi suatu text yang bisa bergerak dari kiri ke kanan, atas kebawah maupun sebaliknya yang anda kenal dengan istilah Marquee. Bentuk Marquee pada umumnya mempunyai format seperti ini.
<marquee onmouseout="this.start()" direction="up" align="center" scrollamount="2" height="100px" onmouseover="this.stop()" width="100%">Isi Text dan URL Anda</marquee>
Isi Text dan URL Anda
Cara memasukkannya adalah :
  1. Login ke Blogger anda.
  2. Buat Entri Baru.
  3. Gunakan mode "HTML".
  4. Lalu masukkan kode yang ada diatas.
  5. Tulisan berwarna Merah bisa anda ganti sesuai dengan arah yang diinginkan seperti "down","left" atau "right"
  6. Lalu yang berwarna Orange merupakan text rata tengah
  7. Jika anda ingin mempercepat kecepatan berrgerak pada teks, silahkan ganti tulisan yang berwarna Hijau dengan angka yang anda inginkan. Semakin besar angka berarti semakin cepat.
  8. Yang warna Ungu merupakan batas vertical kotak Marquee.
  9. Dan untuk tulisan yang berwarna Biru anda dapat ganti dengan Teks atau URL anda.
  10. Untuk melihat hasilnya silahkan pratinjau ataupublikasikan post anda.
  11. Done !!!.
Bagi anda yang belum mengetahui cara memasukkan Link baik gambar maupun Teks silahkan kunjungi "Cara Membuat Link". Semoga bermanfaat buat anda semua. Happy Blogging !!!.

Jumat, 07 September 2012

Membuat Kotak Scroll Sederhana

Membuat Kotak Scroll Sederhana ~ Ngepost lagi nih, Guusnara sebelumnya memberikan tips Membuat Spoiler Pada Blog, selanjutnya akan memberikan tips yang berikutnya yaitu Membuat Kotak Scroll Sederhana. Gunanya jika anda memasukkan sebuah gambar,code dan semacamnya tapi tidak ingin menghabiskan banyak tempat nah inilah caranya, mari ikuti langkah-langkah berikut ini.

  1. Login ke Blogger anda.
  2. Buatlah sebuah post baru.
  3. Pilih mode "HTML".
  4. Lalu masukkan kode dibawah ini.
    Kode:
    <center> <div style="border: 1px solid rgb(153, 153, 153); overflow: auto; width: 400px; height: 100px; text-align: center;" > deskripsi apa saja yang ingin Anda masukkan </div></center>
  5. Untuk tulisan yang berwarna Merah isikan deskripsi anda dari gambar, tulisan atau semacamnya.
  6. Untuk mencobanya, publikasikan/pratinjau post yang anda buat.
  7. Hasilnya akan seperti ini.
    Deskripsi apa saja yang ingin Anda masukkan
  8. Anda dapat mengatur Height dan Width sesuai yang anda inginkan.
  9. Done !!!.
Kiranya itu yang Guusnara bisa berikan, semoga bisa bermanfaat buat anda semua. Happy Blogging !!!.

Membuat Spoiler Pada Blog

Membuat Spoiler Pada Blog ~ Pada kesempatan yang baik ini, Guusnara akan memberikan trick untuk menyembunyikan dan menampilkan suatu gambar, tulisan dan semacamnya yang biasanya dikenal dengan nama Spoiler. tentu anda sudah tidak asing lagi kegunaan dari spoiler tersebut. Contohnya seperti dibawah ini.
Ini Namanya Spoiler:
Ini merupakan isi dari spoiler anda yang berupa gambar, tulisan dan semacamnya.
Jika dari anda belum mengetahui cara membuatnya, ikuti langkah-langkah berikut.

  1. Login ke Blogger anda.
  2. Buatlah sebuah post baru.
  3. Pilihlah mode "HTML".
  4. Lalu masukkan kode dibawah ini.
    <div style="margin: 5px 20px 20px;"> <div class="smallfont" style="margin-bottom: 2px;"><b>Ini Namanya Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; font-size: 12px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button"> </div> <div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;"> <div style="display: none;"> Ini merupakan isi dari spoiler anda yang berupa gambar, tulisan dan semacamnya. <br> </div> </div> </div>
  5. Untuk Tulisan berwarna Orange adalah lebar kotak dan ukuran tulisan spoiler, anda dapat mengaturnya sesuai dengan keinginan anda.
  6. Tulisan yang berwarna Merah anda dapat menggantinya dengan judul spoiler anda.
  7. Lalu tulisan yang berwarna Hijau merupakan bagian yang diklik, anda dapat menggantinya sesuai dengan keinginan.
  8. Dan tulisan yang berwarna Biru isilah deskripsi anda seperti gambar, tulisan dan semacamnya.
  9. Done !!!.
Semoga Trik ini bermanfaat buat anda. Happy Blogging !!!.

Membuat Rekomendasi Post Slide

Membuat Rekomendasi Post Slide ~  Membuat Rekomendasi Post Slide maksudnya adalah sebuah widget yang bisa memunculkan sebuah posting blog secara acak yang berbentuk slide dan widget sangat populer di kalangan luar negeri. Biasanya widget ini muncul pada bagian paling bawah di suatu situs blog. Kebanyakan widget ini di pakai di Blog Wordpress. Nah Guusnara akan memberikan cara Membuat Rekomendasi Post Slide untuk Blogspot.
  1. Login ke Blogger anda.
  2. Lalu klik "Opsi Lainnya" > "Tata Letak" > "Tambah Gadget".
  3. Muncullah sebuah jendela baru dan klik pada menu "HTML/Java Script".
  4. Kemudian masukkan kode dibawah ini.
    <div id="bpslidein" style="display:none;"> <div class="help">?</div><div class="expand">+</div> <div class="close">X</div> <p>Recommended for you</p> <div id="bpslidein_image"></div> <div id="bpslidein_title">Loading..</div> </div> <script> if(document.location.href.split("/").length==6&&document.location.href.indexOf(".html")!=-1){if(typeof bp_onload_queue=='undefined')var bp_onload_queue=[];if(typeof bp_dom_loaded=='boolean')bp_dom_loaded=false;else var bp_dom_loaded=false;if(typeof bp_async_loader!='function'){function bp_async_loader(src,callback,id){var script=document.createElement('script');script.type="text/javascript";script.async=true;script.src=src;script.id=id;var previous_script=document.getElementById(id);if(previous_script)if(previous_script.readyState=="loaded"||previous_script.readyState=="complete"){callback();return}else{script=previous_script}if(script.onload!=null)previous_callback=script.onload;script.onload=script.onreadystatechange=function(){var newcallback;if(previous_script&&previous_callback)newcallback=function(){previous_callback();callback()};else newcallback=callback;if(bp_dom_loaded){newcallback()}else bp_onload_queue.push(newcallback);script.onload=null;script.onreadystatechange=null};var head=document.getElementsByTagName('head')[0];if(!previous_script)head.appendChild(script)}}if(typeof bp_domLoaded!='function')function bp_domLoaded(callback){bp_dom_loaded=true;var len=bp_onload_queue.length;for(var i=0;i<len;i++){bp_onload_queue[i]()}}bp_domLoaded();bp_async_loader("http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js",function(){bp_async_loader("http://guusnara.googlecode.com/files/bp-out-slide.min.js",function(){},"bp-out-slide")},"jQueryjs")} </script> <a href="http://guusnara.blogspot.com/2012/09/membuat-rekomendasi-post-slide.html" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCgJ1-PQFHoImarLuFBTWiNs9qWaHUBlaqFn89DGyscrHeu1gNdK98lREsIiBpNaOucoKYNIgwQhkukKGElxwZT6teuX-8JUmcVAX6Rwd-BrHQhjR0P7kF2zH7sif5p8ijznWyg1dqoRE/I/bloggerplugins.png" alt="Recommended Post Slide Out For Blogger" /></a>
  5. Simpan Gadget anda.
  6. Hasilnya akan seperti ini.
  7. Done !!!.
Semoga bermanfaat buat anda semua. Happy Blogging !!!.

Membuat Anti Klik Kanan Dengan Message

Membuat Anti Klik Kanan Dengan Message ~ Sebelumnya Guusnara sudah memberikan Membuat Blog Anda Anti Copas dan Anti Block, sekarang Guusnara akan memberikan tips yang kedua yaitu Membuat Anti Klik Kanan Dengan Message. Misalkan jika anda mengklik kanan di blog yang ada fitur ini, maka akan muncul pesan seperti digambar ini.
Nah, disini anda tidak perlu lagi mengedit HTML anda cukup dengan memasang sebuat Gadget saja. Caranya :

  1. Loggin ke Blogger anda.
  2. Lalu klik "Opsi Lainnya" > "Tata Letak" > "Tambah Gadget".
  3. Maka muncul jendela baru dan carilah "HTML/Java Script".
  4. Kemudian masukkan kode dibawah ini.
    <script> var message="Maaf, Saat Ini Fitur Klik Kanan Kami Disable, Demi Lancarnya Kinerja Browser Kalian !!. Dan Jika Ingin Mengcopy, Silahkan Tekan Ctrl + C !!."; /////////////////////////////////// function clickIE4(){if (event.button==2){alert(message);return false;}} function clickNS4(e){if (document.layers||document.getElementById&&!document.all){if (e.which==2||e.which==3){alert(message);return false;}}} if (document.layers){document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS4;} else if (document.all&&!document.getElementById){document.onmousedown=clickIE4;} document.oncontextmenu=new Function("alert(message);return false") </script>
  5. Tulisan yang berwarna Merah ganti dengan deskripsi sesuai yang anda inginkan.
  6. Simpan Gadget anda.
  7. Done !!!.
Nah untuk mencobanya silahkan langsung ke Url Blog anda dan langsung klik kanan, jika sudah muncul maka kode tersebut berjalan dengan baik. Pengalaman Guusnara kode-kode tersebut hanya bisa berjalan di Browser "Mozzila" dan "Google Chrome" sedangkan di "Opera" tidak berjalan. Selamat mencoba. Happy Blogging !!!.

Kamis, 06 September 2012

Membuat Kode Warna HTML 2

Membuat Kode Warna HTML 2 ~ Guusnara akan memberikan Tips kedua yaitu Membuat Kode Warna HTML 2 yang sebelumnya  Guusnara sudah memberikan Tips yang pertama yaitu Membuat Kode Warna HTML 1. Untuk kode-kodenya silahkan ikuti cara dibawah ini.
  1. Loggin ke Blogger anda.
  2. Klik "Opsi Lainnya" > "Template" > "Edit HTML".
  3. Sebelum ke langkah selanjutnya, terlebih dahulu backup template anda jika misalnya terjadi salah penempatan coding.
  4. Centang "Expand Template Widget".
  5. Masukkan kode dibawah ini.
    <script language='javascript'> function Barva(koda) { document.getElementById("vzorec").bgColor=koda; document.hcc.barva.value=koda.toUpperCase(); document.hcc.barva.select(); } function BarvaDruga(koda) { document.getElementById("vzorec2").bgColor=koda; document.hcc.Barva2.value=koda.toUpperCase(); document.hcc.Barva2.select(); } </script> <script src='http://guusnara.googlecode.com/files/kodewarna.js' type='text/javascript'></script>
  6. Kemudian simpan template anda.
  7. Jika sudah, selanjutnya klik "Post" > "Buat Entri Baru". atau bisa juga di Gadget anda.
  8. Pilihlah mode "HTML".
  9. Masukkan kode dibawah ini.
    <form id="hcc" name="hcc"> <table align="center" border="1" bordercolor="#cccccc" cellpadding="0" cellspacing="0" style="border-collapse: collapse;"><tbody> <tr><td><table align="center" border="0" cellpadding="0" cellspacing="1" style="width: 375px;"><tbody> <tr height="24"><td bgcolor="#190707" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2a0a0a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#3b0b0b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#610b0b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#8a0808" onclick="Barva(this.bgColor)"> </td><td bgcolor="#b40404" onclick="Barva(this.bgColor)"> </td><td bgcolor="#df0101" onclick="Barva(this.bgColor)"> </td><td bgcolor="#ff0000" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fe2e2e" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fa5858" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f78181" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f5a9a9" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f6cece" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f8e0e0" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fbefef" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#191007" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2a1b0a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#3b240b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#61380b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#8a4b08" onclick="Barva(this.bgColor)"> </td><td bgcolor="#b45f04" onclick="Barva(this.bgColor)"> </td><td bgcolor="#df7401" onclick="Barva(this.bgColor)"> </td><td bgcolor="#ff8000" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fe9a2e" onclick="Barva(this.bgColor)"> </td><td bgcolor="#faac58" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f7be81" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f5d0a9" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f6e3ce" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f8ece0" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fbf5ef" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#181907" onclick="Barva(this.bgColor)"> </td><td bgcolor="#292a0a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#393b0b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#5e610b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#868a08" onclick="Barva(this.bgColor)"> </td><td bgcolor="#aeb404" onclick="Barva(this.bgColor)"> </td><td bgcolor="#d7df01" onclick="Barva(this.bgColor)"> </td><td bgcolor="#ffff00" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f7fe2e" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f4fa58" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f3f781" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f2f5a9" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f5f6ce" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f7f8e0" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fbfbef" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#101907" onclick="Barva(this.bgColor)"> </td><td bgcolor="#1b2a0a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#243b0b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#38610b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#4b8a08" onclick="Barva(this.bgColor)"> </td><td bgcolor="#5fb404" onclick="Barva(this.bgColor)"> </td><td bgcolor="#74df00" onclick="Barva(this.bgColor)"> </td><td bgcolor="#80ff00" onclick="Barva(this.bgColor)"> </td><td bgcolor="#9afe2e" onclick="Barva(this.bgColor)"> </td><td bgcolor="#acfa58" onclick="Barva(this.bgColor)"> </td><td bgcolor="#bef781" onclick="Barva(this.bgColor)"> </td><td bgcolor="#d0f5a9" onclick="Barva(this.bgColor)"> </td><td bgcolor="#e3f6ce" onclick="Barva(this.bgColor)"> </td><td bgcolor="#ecf8e0" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f5fbef" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#071907" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0a2a0a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b3b0b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b610b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#088a08" onclick="Barva(this.bgColor)"> </td><td bgcolor="#04b404" onclick="Barva(this.bgColor)"> </td><td bgcolor="#01df01" onclick="Barva(this.bgColor)"> </td><td bgcolor="#00ff00" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2efe2e" onclick="Barva(this.bgColor)"> </td><td bgcolor="#58fa58" onclick="Barva(this.bgColor)"> </td><td bgcolor="#81f781" onclick="Barva(this.bgColor)"> </td><td bgcolor="#a9f5a9" onclick="Barva(this.bgColor)"> </td><td bgcolor="#cef6ce" onclick="Barva(this.bgColor)"> </td><td bgcolor="#e0f8e0" onclick="Barva(this.bgColor)"> </td><td bgcolor="#effbef" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#071910" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0a2a1b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b3b24" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b6138" onclick="Barva(this.bgColor)"> </td><td bgcolor="#088a4b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#04b45f" onclick="Barva(this.bgColor)"> </td><td bgcolor="#01df74" onclick="Barva(this.bgColor)"> </td><td bgcolor="#00ff80" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2efe9a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#58faac" onclick="Barva(this.bgColor)"> </td><td bgcolor="#81f7be" onclick="Barva(this.bgColor)"> </td><td bgcolor="#a9f5d0" onclick="Barva(this.bgColor)"> </td><td bgcolor="#cef6e3" onclick="Barva(this.bgColor)"> </td><td bgcolor="#e0f8ec" onclick="Barva(this.bgColor)"> </td><td bgcolor="#effbf5" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#071918" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0a2a29" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b3b39" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b615e" onclick="Barva(this.bgColor)"> </td><td bgcolor="#088a85" onclick="Barva(this.bgColor)"> </td><td bgcolor="#04b4ae" onclick="Barva(this.bgColor)"> </td><td bgcolor="#01dfd7" onclick="Barva(this.bgColor)"> </td><td bgcolor="#00ffff" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2efef7" onclick="Barva(this.bgColor)"> </td><td bgcolor="#58faf4" onclick="Barva(this.bgColor)"> </td><td bgcolor="#81f7f3" onclick="Barva(this.bgColor)"> </td><td bgcolor="#a9f5f2" onclick="Barva(this.bgColor)"> </td><td bgcolor="#cef6f5" onclick="Barva(this.bgColor)"> </td><td bgcolor="#e0f8f7" onclick="Barva(this.bgColor)"> </td><td bgcolor="#effbfb" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#071019" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0a1b2a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b243b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b3861" onclick="Barva(this.bgColor)"> </td><td bgcolor="#084b8a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#045fb4" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0174df" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0080ff" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2e9afe" onclick="Barva(this.bgColor)"> </td><td bgcolor="#58acfa" onclick="Barva(this.bgColor)"> </td><td bgcolor="#81bef7" onclick="Barva(this.bgColor)"> </td><td bgcolor="#a9d0f5" onclick="Barva(this.bgColor)"> </td><td bgcolor="#cee3f6" onclick="Barva(this.bgColor)"> </td><td bgcolor="#e0ecf8" onclick="Barva(this.bgColor)"> </td><td bgcolor="#eff5fb" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#070719" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0a0a2a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b0b3b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b0b61" onclick="Barva(this.bgColor)"> </td><td bgcolor="#08088a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0404b4" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0101df" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0000ff" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2e2efe" onclick="Barva(this.bgColor)"> </td><td bgcolor="#5858fa" onclick="Barva(this.bgColor)"> </td><td bgcolor="#8181f7" onclick="Barva(this.bgColor)"> </td><td bgcolor="#a9a9f5" onclick="Barva(this.bgColor)"> </td><td bgcolor="#cecef6" onclick="Barva(this.bgColor)"> </td><td bgcolor="#e0e0f8" onclick="Barva(this.bgColor)"> </td><td bgcolor="#efeffb" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#100719" onclick="Barva(this.bgColor)"> </td><td bgcolor="#1b0a2a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#240b3b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#380b61" onclick="Barva(this.bgColor)"> </td><td bgcolor="#4b088a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#5f04b4" onclick="Barva(this.bgColor)"> </td><td bgcolor="#7401df" onclick="Barva(this.bgColor)"> </td><td bgcolor="#8000ff" onclick="Barva(this.bgColor)"> </td><td bgcolor="#9a2efe" onclick="Barva(this.bgColor)"> </td><td bgcolor="#ac58fa" onclick="Barva(this.bgColor)"> </td><td bgcolor="#be81f7" onclick="Barva(this.bgColor)"> </td><td bgcolor="#d0a9f5" onclick="Barva(this.bgColor)"> </td><td bgcolor="#e3cef6" onclick="Barva(this.bgColor)"> </td><td bgcolor="#ece0f8" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f5effb" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"> <td bgcolor="#190718" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2a0a29" onclick="Barva(this.bgColor)"> </td><td bgcolor="#3b0b39" onclick="Barva(this.bgColor)"> </td><td bgcolor="#610b5e" onclick="Barva(this.bgColor)"> </td><td bgcolor="#8a0886" onclick="Barva(this.bgColor)"> </td><td bgcolor="#b404ae" onclick="Barva(this.bgColor)"> </td><td bgcolor="#df01d7" onclick="Barva(this.bgColor)"> </td><td bgcolor="#ff00ff" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fe2ef7" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fa58f4" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f781f3" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f5a9f2" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f6cef5" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f8e0f7" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fbeffb" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#190710" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2a0a1b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#3b0b24" onclick="Barva(this.bgColor)"> </td><td bgcolor="#610b38" onclick="Barva(this.bgColor)"> </td><td bgcolor="#8a084b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#b4045f" onclick="Barva(this.bgColor)"> </td><td bgcolor="#df0174" onclick="Barva(this.bgColor)"> </td><td bgcolor="#ff0080" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fe2e9a" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fa58ac" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f781be" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f5a9d0" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f6cee3" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f8e0ec" onclick="Barva(this.bgColor)"> </td><td bgcolor="#fbeff5" onclick="Barva(this.bgColor)"> </td></tr> <tr height="24"><td bgcolor="#000000" onclick="Barva(this.bgColor)"> </td><td bgcolor="#0b0b0b" onclick="Barva(this.bgColor)"> </td><td bgcolor="#151515" onclick="Barva(this.bgColor)"> </td><td bgcolor="#1c1c1c" onclick="Barva(this.bgColor)"> </td><td bgcolor="#2e2e2e" onclick="Barva(this.bgColor)"> </td><td bgcolor="#424242" onclick="Barva(this.bgColor)"> </td><td bgcolor="#585858" onclick="Barva(this.bgColor)"> </td><td bgcolor="#6e6e6e" onclick="Barva(this.bgColor)"> </td><td bgcolor="#848484" onclick="Barva(this.bgColor)"> </td><td bgcolor="#a4a4a4" onclick="Barva(this.bgColor)"> </td><td bgcolor="#bdbdbd" onclick="Barva(this.bgColor)"> </td><td bgcolor="#d8d8d8" onclick="Barva(this.bgColor)"> </td><td bgcolor="#e6e6e6" onclick="Barva(this.bgColor)"> </td><td bgcolor="#f2f2f2" onclick="Barva(this.bgColor)"> </td><td bgcolor="#ffffff" onclick="Barva(this.bgColor)"> </td></tr> </tbody></table> </td></tr> </tbody></table> <table align="center" border="0" cellpadding="0" cellspacing="2"><tbody> <tr height="24"><td height="24" id="vzorec" width="24"> </td><td valign="bottom">Kode warna yang terpilih : <input id="barva" maxlength="7" name="barva" size="9" style="font-family: Verdana; font-size: 12px; font-weight: bold; height: 16px; width: 74px;" type="text" /></td></tr> </tbody></table> </form>
  10. Publikasikan Post anda. Dan Hasilnya akan seperti INI.
  11. Done !!!
Jadi anda bisa memilih salah satu diantara cara Membuat Kode Warna HTML 1 atau Membuat Kode Warna HTML 2 sesuai dengan keinginan anda. Semoga bermanfaat. Happy Blogging !!!.

Membuat Kode Warna HTML 1

Membuat Kode Warna HTML 1 ~ Guusnara akan memberikan tips untuk anda bila anda mengalami kesulitan untuk mencari kode warna di HTML. Sekarang Guusnara akan berikan step by step  Membuat Kode Warna HTML 1.
  1. Login ke Blogger anda.
  2. Klik "Buat Entri Baru", atau juga bisa di Gadget anda.
  3. Pilih mode "HTML".
  4. Masukkan kode dibawah ini.
    <object border="0" classid="clsid:D27CDB6E-AE6D-11CF-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" height="480" id="obj1" width="420"> <param value="http://www.2createawebsite.com/build/color.swf" name="movie"> <param value="High" name="quality"> <embed pluginspage="http://www.macromedia.com/go/getflashplayer" quality="High" src="http://www.2createawebsite.com/build/color.swf" name="obj1" type="application/x-shockwave-flash" width="420" height="420"> </object> <object align="middle" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" height="420" id="col" width="420"> <param value="sameDomain" name="allowScriptAccess"> <param value="http://www.2createawebsite.com/build/col.swf" name="movie"> <param value="high" name="quality"> <param value="#ffffff" name="bgcolor"> <embed pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" src="http://www.2createawebsite.com/build/col.swf" bgcolor="#ffffff" name="col" width="420" align="middle" height="420"> </object>
  5. Publikasikan post anda.
  6. Hasilnya akan seperti DISINI.
  7. Done !!!.
Karena ini menggunakan Flash, jadi jika anda belum memiliki flash player silahkan dapat mendownloadnya di SINI. Jika anda tidak ingin memakai Flash, silahkan kunjungi cara Membuat Kode Warna HTML 2. Selamat Mencoba.

Membuat Link ke Banyak Tujuan

Membuat Link ke Banyak Tujuan ~ Para Bloggers sekalian, Guusnara akan memberikan tips dan trick lagi mengenai cara Membuat Link ke Banyak Tujuan. Contohnya silahkan anda mengklik Link Ini. Untuk kodenya, silahkan ikuti cara berikut ini.

  1. Login ke Blogger anda.
  2. Buat Post Baru atau Di Gadget sesuai dengan keinginan anda.
  3. ~ Untuk di Post Baru anda, silahkan klik mode "HTML".
  4. Masukkan kode dibawah ini.
    <a onclick="window.open('http://google.com');window.open('http://yahoo.com')" href="javascript:void(0)">Link untuk bagian post baru</a>
  5. ~ Untuk di bagian Gadget silahkan klik "Tambah Gadget" > " HTML/Java Script".
  6. Masukkan kode dibawah ini.
    <script type="text/javascript"> function open_win() { window.open("http://google.com"); window.open("http://yahoo.com"); } </script> <a href="javascript: void(0)" onclick="open_win()">Klik Disini</a>
  7. Untuk tulisan yang berwarna merah, silahkan ganti dengan URL yang anda inginkan. Dan yang berwarna biru masukkan judul yang ingin anda masukkan.
  8. Done !!!.
Semoga bermanfaat buat anda semua. Salam Bloggers !!!.

Membuat Blog Anda Anti Copas dan Anti Block

Membuat Blog Anda Anti Copas dan Anti Block ~ Jika anda tidak ingin artikel anda di copy paste sama orang lain, disini Guusnara akan memberikan cara Membuat Blog Anda Anti Copas dan Anti Block. Tidak ada salahnya untuk anda mencoba. Langsung aja.
  1. Login ke Blogger anda.
  2. Klik "Opsi Lainnya".
  3. Lalu Klik "Template".
  4. Untuk berjaga-jaga kemungkinan terjadinya salah coding, silahkan backup Template anda terlebih dahulu dengan mengklik "Cadangkan/Pulihkan" > "Unduh Template Lengkap".
  5. Klik "Edit HTML".
  6. Lalu Centang pada "Expand Template Widget".
  7. Kemudian cari kode <head> dengan menekan CTRL + F di browser anda.
  8. Masukan kode dibawah ini tepat setelah kode <head>.
    <SCRIPT type="text/javascript">if (typeof document.onselectstart!="undefined") {document.onselectstart=new Function ("return false");}else{document.onmousedown=new Function ("return false");document.onmouseup=new Function ("return true");}</SCRIPT>
  9. Simpan Template Anda.
  10. Done !!!.
Semoga bisa bermanfaat buat para bloggers sekalian.

Sabtu, 01 September 2012

Memverifikasi ID Alexa Blog (Claim Your Site)

Memverifikasi ID Alexa Blog (Claim Your Site) ~ Sebelumnya Guusnara memberikan cara Memasang Widget Alexa di Blog sekarang Guusnara akan memberikan cara Memverifikasi ID Alexa Blog (Claim Your Site). Langsung aja.

  1. Login seperti biasa ke akun Alexa.
  2. Pilih "Produts"
  3. Pilih "See Other Tools for Site Owners".
  4. Klik "Claim Your Site".
  5. Masukkan URL Blog anda lalu klik "Claim your site".
  6. Tunggu beberapa saat, lalu muncul pilihan, silahkan anda pilih yang "Free Sign Up".
  7. Maka akan muncul 2 pilihan, kita akan pilih yang opsi 2 karena cara tersebut sangat mudah. ikuti ya cara dibawah ini.
  • Copy meta tag ID verifikasi alexa tersebut dan paste di bawah kode tag <head> atau di atas kode </head>
  • Jika sudah memasukkan Meta tag ID verifikasi alexa tersebut silahkan klik Save Template
  • Kembali kehalaman alexa lalu klik Verify my ID.
  • Jika berhasil maka akan ada konfirmasi bahwa anda sukses mengklaim blog anda.
  • Done !!!
Gimana, Berhasil bukan ? . Selamat mencoba para Bloggers !!!. Semoga bermanfaat.

Kamis, 30 Agustus 2012

Konversi Kode HTML Menjadi Encode

Konversi Kode HTML Menjadi Encode ~ Nah Guusnara akan memberikan solusi bagi anda yang kesulitan memposting artikel yang berhubungan kode HTML/Java Script. Namanya Parse HTML yang berguna untuk menampilkan  kode HTML/Java Script menjadi sebuah karakter biasa, contohnya seperti pada postingan Guusnara yang berikut ini. Silahkan Di Klik.

Jika anda tidak mem Parse HTML maka saat memposting yang berhubungan kode HTML/Java Script tidak akan tampil seperti karakter biasa, melaikan sebuah widget. Silahkan di coba tool dari Google yang kami berikan dibawah ni.

Selamat mencoba. Salam Bloggers !!!.

Membuat Navigasi Breadcumb SEO


Membuat Navigasi Breadcumb SEO ~ Sesuai dengan gambar diatas adalah Navigasi Breadcumb pada Guusnara. Untuk membuatnya silahkan ikuti langkah-langkah Membuat Navigasi Breadcumb SEO ini.
  1. Buka Blogger kalian.
  2. Masuk ke menu Desain.
  3. Pilih Edit HTML
  4. Pastikan backup terlebih dahulu Template anda untuk menghindari kesalahan dalam pengetikan.
  5. Centang "Expand Widget Template".
  6. Cari kode ]]></b:skin> dengan menekan CTRL + F.
  7. Masukkan kode ini.
  8. Kode 1:
    .breadcrumbs {padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:85%; line-height: 1.4em; border-bottom:3px double #e6e4e3;}
  9. Kemudian cari kode ini <div class='post hentry uncustomized-post-template'> jika tidak ada carilah kode yang ini <div class='post hentry'>
  10. Masukkan kode dibawah ini.
  11. Kode 2:
    <b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'> Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</a> &#187; <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag,nofollow'><data:label.name/></a> <b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if> </b:loop> </b:if> &#187; <data:post.title/> </div> </b:if> </b:if>

Kemudian simpan template anda. Selamat mencoba. Salam Bloggers !!!.

Cara Membuat Breadcumbs Terindex

Cara Membuat Breadcumbs Terindex ~ Guusnara Come back nih. langsung aja, tujuan adanya Breadcumbs ini untuk mempermudah Indexisasi pada Google Search. Tentunya perlu waktu kurang lebih lama untuk mengIndeks Breadcumbs ini. Lalu bagaimana Cara Membuat Breadcumbs Terindex :
  1. Buka Blogger anda.
  2. Pilih Template.
  3. Pilih HTML, lalu centang "Expand Widget Templates"
  4. Kalo anda sudah memiliki Breadcumbs, silahkan hapus dulu kode Breadcums yang lama.
  5. Carilah kode ]]></b:skin> dengan menekan CTRL + F untuk mempermudah pencarian.
  6. Masukkan kode dibawah ini tepat diatas kode  ]]></b:skin>
  7. Kode 1:
    .breadcrumbs {padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:85%; line-height: 1.4em; border-bottom:3px double #e6e4e3;}
  8. Lalu carilah kode <b:includable id='main' var='top'>  dengan menekan CTRL + F.
  9. Gantilah kode  <b:includable id='main' var='top'> ini dengan kode dibawah ini.
  10. Kode 2:
    <b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'> <b:if cond='data:blog.pageType == &quot;static_page&quot;'> <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span><data:blog.pageName/></span></div> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <!-- breadcrumb for the post page --> <b:loop values='data:posts' var='post'> <b:if cond='data:post.labels'> <div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'> <span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span> <b:loop values='data:post.labels' var='label'> &#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span> </b:loop> &#187; <span><data:post.title/></span> </div> <b:else/> <div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div> </b:if> </b:loop> <b:else/> <b:if cond='data:blog.pageType == &quot;archive&quot;'> <!-- breadcrumb for the label archive page and search pages.. --> <div class='breadcrumbs'> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Archives for <data:blog.pageName/></span> </div> <b:else/> <b:if cond='data:blog.pageType == &quot;index&quot;'> <div class='breadcrumbs'> <b:if cond='data:blog.pageName == &quot;&quot;'> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>All posts</span> <b:else/> <span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></span> </b:if> </div> </b:if> </b:if> </b:if> </b:if> </b:if> </b:includable> <b:includable id='main' var='top'> <b:include data='posts' name='breadcrumb'/>

Terakhir simpan template anda. Pastikan sebelum mengedit HTML terlebih dahulu backup templatenya jika ada kodenya nanti terjadi error. Selamat mencoba. Salam Bloggers !!!.

Selasa, 13 Maret 2012

Cara Membuat Read More

Nah disini saya akan share bagaimana cara read more ?. cara untuk membuat readmore :

Kirim Update Artikel dan Software Terbaru Dari "Guusnara | Various Articles and Free Software" Untuk Anda Langsung ke Email Anda, Disini !!

Related Posts Plugin for WordPress, Blogger...