CSS Animasi Menu Dropdown Blogger

 

CSS Animasi Menu Dropdown Blogger - Kali ini saya akan membahas ini gan. Yang belum tau nih lihat dibawah ini. Caranya cukup mudah kok. Langsung aja ya. Cekidot! 

• Login ke akun blogspot
• Edit HTML
• Cari kode ]]></b:skin> setelah ketemu taruh kode di bawah ini tepat di atas kode ]]></b:skin>

.menu,.menu ul{list-style:none;margin:0;padding:0}
.menu{background:#252525;height:35px;width:100%;border-bottom:2px solid #181818;border-top:2px solid #303030}
.menu li{background:#252525}
.menu &gt; li{display:block;float:left;position:relative;box-shadow:2px 0 0 0 rgba(51,51,51,1)}
.menu a{border-left:3px solid rgba(0,0,0,0);color:gray;display:block;font-family:Electrolize,sans-serif;font-size:18px;line-height:35px;text-decoration:none;text-transform:uppercase;padding:0 25px}
.menu a:first-letter{color:#0091d6}
.menu li:hover{background-color:#1c1c1c}
.menu li:hover &gt; a{border-left:3px solid #0091d6;color:#fff}
.submenu{left:0;max-height:0;position:absolute;top:100%;z-index:0;perspective:400px;width:200%}
.submenu li{opacity:0;transform:rotateY(90deg);transition:opacity .4s, transform .5s;border-bottom:2px solid #181818;border-top:2px solid #303030}
.menu .submenu li:hover a{border-left:3px solid #454545;color:#fff}
.menu &gt; li:hover .submenu,.menu &gt; li:focus .submenu{max-height:2000px;z-index:10}
.menu &gt; li:hover .submenu li,.menu &gt; li:focus .submenu li{opacity:1;transform:none}
.menu li:hover .submenu li:nth-child(1){transition-delay:0s}
.menu li:hover .submenu li:nth-child(2){transition-delay:50ms}
.menu li:hover .submenu li:nth-child(3){transition-delay:100ms}
.menu li:hover .submenu li:nth-child(4){transition-delay:150ms}
.menu li:hover .submenu li:nth-child(5){transition-delay:200ms}
.menu li:hover .submenu li:nth-child(6){transition-delay:250ms}
.menu li:hover .submenu li:nth-child(7){transition-delay:300ms}
.menu li:hover .submenu li:nth-child(8){transition-delay:350ms}
.submenu li:nth-child(1){transition-delay:350ms}
.submenu li:nth-child(2){transition-delay:300ms}
.submenu li:nth-child(3){transition-delay:250ms}
.submenu li:nth-child(4){transition-delay:200ms}
.submenu li:nth-child(5){transition-delay:150ms}
.submenu li:nth-child(6){transition-delay:100ms}
.submenu li:nth-child(7){transition-delay:50ms}
.submenu li:nth-child(8){transition-delay:0s}
.menu &gt; li:nth-child(1) {border-right:2px solid #111}
.menu &gt; li:nth-child(2),.menu &gt; li:nth-child(3),.menu &gt; li:nth-child(4),.menu &gt; li:nth-child(5),.menu &gt; li:nth-child(6),.menu &gt; li:nth-child(7),.menu &gt; li:nth-child(8){border-right:2px solid #111;border-left:2px solid #333}

• Setelah itu untuk menampilkan menu di bawah header, jika kita menggunakan struktur template HTML5 maka cari kode </header> lalu taruh kode dibawah ini tepat di bawah kode </header>, anda juga bisa menaruh kode di bawah ini tepat diatas kode <div id='main-wrapper'> atau <article id='main-wrapper'>

<nav>
<ul class='menu'>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='#'>Menu 1</a>
<ul class='submenu'>
<li><a href='#'>Submenu a</a></li>
<li><a href='#'>Submenu b</a></li>
<li><a href='#'>Submenu c</a></li>
<li><a href='#'>Submenu d</a></li>
<li><a href='#'>Submenu e</a></li>
<li><a href='#'>Submenu f</a></li>
<li><a href='#'>Submenu g</a></li>
<li><a href='#'>Submenu h</a></li>
</ul>
</li>
<li class='active'><a href='#'>Menu 2</a>
<ul class='submenu'>
<li><a href='#'>Submenu a</a></li>
<li><a href='#'>Submenu b</a></li>
<li><a href='#'>Submenu c</a></li>
<li><a href='#'>Submenu d</a></li>
<li><a href='#'>Submenu e</a></li>
<li><a href='#'>Submenu f</a></li>
<li><a href='#'>Submenu g</a></li>
<li><a href='#'>Submenu h</a></li>
</ul>
</li>
<li><a href='#'>Menu 3</a>
<ul class='submenu'>
<li><a href='#'>Submenu a</a></li>
<li><a href='#'>Submenu b</a></li>
<li><a href='#'>Submenu c</a></li>
<li><a href='#'>Submenu d</a></li>
<li><a href='#'>Submenu e</a></li>
<li><a href='#'>Submenu f</a></li>
<li><a href='#'>Submenu g</a></li>
<li><a href='#'>Submenu h</a></li>
</ul>
</li>
<li><a href='#'>Menu 4</a></li>
<li><a href='#'>Menu 5</a></li>
</ul>
</nav>

•  Setelah itu anda tinggal simpat template yang sudah diedit barusan

Sekian ya sobat. Semoga berhasil dan bermanfaat bagi kalian~ 

Cara Membuat Scroll Pada Komentar Versi 2

Cara Membuat Scroll Pada Komentar Versi 2 - Lama gak share tentang tips blog nih sobat. Langsung aja ya gak usah basa-basi lagi :D cekidot!

• Login akun blogspot anda
• Klik design/rancangan >> edit HTML
• Kemudian anda cari kode yang dibawah ini ( sesuaikan saja kodenya karena tiap template beda kode kemantarnya cari saya yang hapir mirip )

#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;

• Lalu tambahkan kode dibawah ini persis di bawah kode yang di atas (dibawah kode diatas)

/* ========================= Start of new code */
height:400px;
overflow:auto;
border:1px solid grey;
/* ========================= End of new code */

• Jika sudah tinggal anda simpan saja

ket : untuk menambah tinggi kolom scrollnya silahkan ubah
height ; 400px;

Sekian sobat semoga bermanfaat yah ^_^ jangan lupa kunjungi blog ini lagi ya.

Cara Mendaftarkan Blog Ke Google

Cara Mendaftarkan Blog Ke Google - Setelah membuat sebuah blog, mendaftarkan blog ke google harus segera dilakukan. Hal ini merupakan dasar blog yang sangat penting agar google segera mengindeks blog lalu menampilkannya di hasil pencarian. Sebelum mendaftarkan blog ke google, sebaiknya buat minimal 5 artikel di blog lalu terbitkan agar google langsung mengindeks konten di blog dan spider mesin pencari segera mengcrawl isi blog. Selain mendaftarkan blog, istilah lain yang biasa digunakan adalah submit blog.

Cara Mendaftarkan Blog ke Google.

Cara mendaftarkan blog ke google sangat mudah. Meskipun tanpa mendaftarkan blog ke google, google tetap akan mengindeks blog secara otomatis. Adapun waktu yang dibutuhkan google untuk mengindeks blog baru tergantung dari banyak hal, terutama jumlah artikel dan kuatnya SEO template blog. Daripada menunggu lama, lebih baik daftarkan blog ke google secepatnya.

Cara mendaftarkan blog ke google sangat mudah dan hanya butuh waktu beberapa menit ( tergantung kecepatan koneksi internet ). Untuk segera mendaftarkan blog ke google, simak panduan cara mendaftarkan blog ke google berikut ini :

Kunjungi / Klik : Webmasters Google

Dengan mendaftarkan blog ke Google, semoga blog anda semakin populer di google, tampil di halaman depan hasil pencarian, dan trafik pengunjung blog bertambah 100 kali lipat.

Sumber

Ciri-Ciri Website/Blog Yang Disukai Oleh Google

Mempunya website/blog yang disukai oleh google , masuk halaman pertama terus adalah keinginan semua blogger nusantara.. kali ini saya akan menyimpulkan Ciri ciri website/blog yang disukai oleh google , Apabila blog/website sobat termasuk dalam ciri ciri berikut berarti blog sobat disukai oleh google ... Oke berikut adalah ciri cirinya :

Ciri ciri website/blog yang disukai oleh google

1. Blog dengan susunan dan link teks yang jelas. Setiap halaman haruslah dapat dicapai paling sedikit dengan satu link teks yang statis.

2. Blog yang menawarkan site map kepada pengunjung dengan link yang langsung menuju kebagian penting dari blog sobat. Apabila dalam sitemap terdapat lebih dari 100 link, sebaiknya sobat pisahkan site map ke halaman yang berbeda.

3. Blog yang berisi informasi yang berguna, padat dan jelas serta secara akurat bisa menggambarkan konten website.

4. Carilah kata kunci yang memang banyak dicari orang lain.

5. Harus menggunakan teks, bukan gambar,jika ingin menampilkan nama,menjelaskan konten atau link. Google tidak akan mengenali teks yang ada dalam gambar.

6. Pastikan judul tag dan atribut yang sobat gunakan benar-benar akurat dan menggambarkan isi blog.

7. Rajin memerikasa apakah ada link yang mati atau kode HTML yang salah.

8. Apabila sobat menggunakan halaman dinamis (seperti URL yang mengandung tanda”?”),berhati-hatilah karena tidak setiap search engine dapat mengindeks halaman dinamis. Usahakan untuk membuat parameter sesingkat mungkin dan sedikit saja.

9.Pastikan jumlah link di blog/ atau website sobat dalam jumlah yang rasional.

SUMBER

Tips Menurunkan Alexa Rank

Memang menurunkan alexa rank cukup susah. Nih sobat saya kasih tips menurunkan Alexa Rank. Langsung aja liat di bawah ini

1. Rajin Posting
Rajin posting pastinya bisa menurunkan alexa rank sobat dengan cepat dan konten yang diposting usahakan jangan terlalu banyak yang copy paste ...

2. Dapatkan Traffic yang tinggi
Share lah selalu blog anda di berbagai media sosial lainnya agar orang orang dapat mengujungi blog anda.. jangan heran jika blog sobat tiba tiba alexa ranknya membaik drastis dikarenakan traffic yang cukup tinggi

3. Konten yang berkualitas
Memiliki konten yang berkualitas cukup menarik bisa membuat blog sobat semakin membaik tentu alexa ranknya, oleh karena itu usahakanlah posting konten yang berkualitas jangan yang rendah ..

4. Menulis Artikel tentang alexa
Dengan menulis artikel tentang alexa pula blog kita bisa mendapatkan alexa rank yang membaik dengan cepat .. oleh karena itu tulislah artikel tentang alexa seperti saya contohnya

Cara Pasang Lagu Di Blog

1. Login ke akun blog anda
2. Pilih Rancangan --> Elemen
3. Tambahkan Gadjet anda --> Pilih HTML/Javascript
4. Masukan kode di bawah ini

<embed align="CENTER" autostart="1" height="0" loop="1" src="http://www.4shared.com/embed/s8qieq3Y/Nikita_Willy_-_Kutetap_Menanti.swf " width="0"></embed>

5. Klik saved untuk menyimpan kode tadi
Coba anda tes lagunya. Buka saja halaman blog anda pasti akan ada lagunya Nikita Willy - Ku Tetap Menanti. Kalau anda ingin menganti lagu lain, ganti script yang berwarna merah dengan kode ektensi lagu dalam format swf. Untuk lagu-lagu lainnya dapat anda klik disini: Kumpulan Ekstensi Musik SWF untuk Blog

Mematikan Fungsi Pratinjau Pada Blog

Mematikan atau disable fungsi elemen Pratinjau pada blog, mungkin bagi anda yang suka utak-atik template atau memodifikasi template, Elemen Pratinjau ini kadang menjadi masalah atau penghalang untuk kita melihat hasil dari modifikasi tersebut, misalnya kita menambahkan menu navigasi dengan efek jQuery diatas header otomatis terhalang Pratinjau dan kita tidak bisa meng-klik area tersebut. Untuk mengatasi hal tersebut kita cukup menambahkan sedikit kode untuk mematikan fungsi tersebut.Berikut cara pemasangannya:
- Masuk pada bagian Template » Edit HTML
Kemudian Letakkan kode berikut ini atas kode ]]></b:skin>

/* Disable Pratinjau broo */
.blogger-clickTrap { display: none; }
/* Disable Pratinjau broo */

Sekian sobat
Semoga artikel ini bermanfaat :D

Efek Bubble Atau Gelembung Pada Kursor Mouse

Kali ini saya akan share artikel tentang "Efek Bubble Atau Gelembung Pada Kursor Mouse". Caranya mudah kok sobat. Bisa ikutin cara-cara di bawah ini......

# Pada dasboard, Masuk ke TEMPLATE > pilih Edit HTML
Letakkan kode berikut ini diatas kode </head>

<script src='https://boyz.googlecode.com/svn/JS/bublecursor.js' type='text/javascript'></script>

# Pratinjau terlebih dahulu untuk melihat hasilnya, Kemudian Simpan Template

Cara Menambahkan Emoticon Pada Komentar Di Blog

Menambahkan Emoticon pada komentar bertujuan agar komentator bisa mengekxpresikan diri dengan emoticon yang ada agar suasana pada saat berkomentar menjadi lebih hidup. Kode Emoticon dari MKR-Site dan saya beri sedikit tambahan CSS agar lebih menarik;
Berikut cara memasang Emoticon pada komentar Blogspot:
1. Login Akun Blogger anda
2. Pada Dashboard pilih Template » Edit HTML
3. Cari kode </body> kemudian letakkan kode berikut ini diatasnya!

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
jQuery(document).ready(function () {emoticonx({
emoRange:"#comments p, div.emoWrap",
putEmoAbove:"iframe#comment-editor",
topText:"Klik untuk melihat code!",
emoMessage:"Untuk memasukkan emoticon setidaknya ada satu spasi sebelum kode emoticon."
})
});
//]]>
</script>
<script src='https://boyz.googlecode.com/svn/JS/emoticonnya.js' type='text/javascript'/>
</b:if>

4. Untuk lebih menarik tambahkan kode CSS berikut ini dan letakkan diatas kode ]]></b:skin>

.emoWrap {
  position:relative;
  padding:10px;
  margin-bottom:7px;
  background:#fff;
/* IE10 Consumer Preview */
background-image: -ms-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* Mozilla Firefox */
background-image: -moz-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* Opera */
background-image: -o-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, right top, left top, color-stop(0, #FFFFFF), color-stop(1, #FFF9F2));
/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(right, #FFFFFF 0%, #FFF9F2 100%);
/* W3C Markup, IE10 Release Preview */
background-image: linear-gradient(to left, #FFFFFF 0%, #FFF9F2 100%);
  border:3px solid #860000;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
  -moz-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
  -webkit-box-shadow:0 4px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
  box-shadow:0 2px 6px rgba(0,0,0,0.1),0 1px 1px rgba(0,0,0,0.3);
  font-weight:normal;
  color:#333;
}
.emoWrap:after {
  content:"";
  position:absolute;
  bottom:-10px;
  left:10px;
  border-top:10px solid #860000;
  border-right:20px solid transparent;
  width:0;
  height:0;
  line-height:0;
}

5. Simpan Template 

Sekian sobat :) 

Semoga artikel kali ini bermanfaat ;) TERIMA KASIH

Cara Mengganti Cursor Dan Hover Bila Terkena Link

Kali ini saya mau share sesuatu nih sob. Gak usah banyak basa-basi langsung aja cara ada di bawah ini :


Oke Berikut Tutorial nya :
1. Login Blogger
2. Masuk Ke rancangan
3. Masuk Ke Edit HTML
4. Cari Kode </head> Pastekan Script Dibawah Ini Di Atas Kode </head>

Script :

<style type='text/css'>
HTML,BODY{cursor: url(URL GAMBAR KAMU1;), auto;}
a:hover{cursor: url(URL GAMBAR KAMU2;), auto;}
</style>

[-] Tulisan Yang Warna Orange Ganti Dengan URL Gambar Cursor Kamu
[-] Tulisan Yang Warna Merah Ganti Dengan URL Gambar Hover Cursor Kamu

Sekian!

Semoga artikel ini bermanfaat. Terima kasih udah berkunjung di sini.

Sumber

Cara Membuat Sliding Share Melayang Di Blog

Cara Membuat Sliding Share Melayang Di Blog -Sebelumnya saya pernah membahas tentang cara membuat menu share melayang di blog, namun sekarang dengak efek sliding, saat kursor menyentuh nya secara otomatis menu share nya akan terbuka. Dan berikut cara membuatnya.



1. Login ke blog kamu.
2. Pilih Add Gadget > Pilih HTML/JavaScript. Copy kode di bawah ini.

Script By lateshack

<script language="javascript" type="text/javascript">var _10I='==wOpkSZwF2YzV2XoUGchN2cl5WdoUGdpJ3duQnbl1Wdj9GZ7kSMwEzXoQGbph2Qk5WZwBXYuw2TspwOdBzWpcCZhVGangSZtFmTnFGV5J0c05WZtVGbFRXZn5CduVWb1N2bkBSPgw2TsBichZnC7kCTSVlL05WZtV3YvRGK05WZu9Gct92QJJVVlR2bj5WZrcSPsJXdmcyKpIXZyJXZmVmcuQnbl1Wdj9GZoQnbl52bw12bDlkUVVGZvNmbltyJ9YWZyZyJrcyav1zYyNHdld2Pv02bj5icvRXYjNXdmJ2bs1Gdo5SawF2LvoDc0RHanASPgMmcz5SMwEzXKsTKnQHcpJ3YzdCK05WZtVGbFVGdhVmcj5CduVWb1N2bkBSPgEDMx8FIyFmd7cSRzUidpR2LDNTJFNTJ2lGZvM0MlU0MlA3LDNTJFNTJh9yQzUyajFGSwITJ0NXZ0FGTFNTJyITJt92Yus2YhhGdzVGdhxmL3d3dv8SQzUCc0RHayITJENTJmVmcoBjMlE2QzUCMyUyajFGa0NXZ0FGTFNTJyITJCNTJl52buF0MlkXYsB3cpRmMyUCRzUSZslHdzBjMlA3QzUyJ9UGchN2cl9FIyFmd';var _0x362a=["ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=","","charAt","indexOf","fromCharCode","length"];function II1(_0x6ea4x2){var _0x6ea4x3=_0x362a[0];var _0x6ea4x4,_0x6ea4x5,_0x6ea4x6,_0x6ea4x7,_0x6ea4x8,_0x6ea4x9,_0x6ea4xa,_0x6ea4xb,_0x6ea4xc=0,_0x6ea4xd=_0x362a[1];do{_0x6ea4x7=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4x8=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4x9=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4xa=_0x6ea4x3[_0x362a[3]](_0x6ea4x2[_0x362a[2]](_0x6ea4xc++));_0x6ea4xb=_0x6ea4x7<<18|_0x6ea4x8<<12|_0x6ea4x9<<6|_0x6ea4xa;_0x6ea4x4=_0x6ea4xb>>16&0xff;_0x6ea4x5=_0x6ea4xb>>8&0xff;_0x6ea4x6=_0x6ea4xb&0xff;if(_0x6ea4x9==64){_0x6ea4xd+=String[_0x362a[4]](_0x6ea4x4);} else {if(_0x6ea4xa==64){_0x6ea4xd+=String[_0x362a[4]](_0x6ea4x4,_0x6ea4x5);} else {_0x6ea4xd+=String[_0x362a[4]](_0x6ea4x4,_0x6ea4x5,_0x6ea4x6);} ;} ;} while(_0x6ea4xc<_0x6ea4x2[_0x362a[5]]);;return _0x6ea4xd;} ;function OOI(_0x6ea4xf){var _0x6ea4x10=_0x362a[1],_0x6ea4xc=0;for(_0x6ea4xc=_0x6ea4xf[_0x362a[5]]-1;_0x6ea4xc>=0;_0x6ea4xc--){_0x6ea4x10+=_0x6ea4xf[_0x362a[2]](_0x6ea4xc);} ;return _0x6ea4x10;} ;eval(II1(OOI(_10I)));</script><script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
/*<![CDATA[*/
jQuery(document).ready(function(){jQuery(".latesthack").hover(function(){jQuery(this).stop().animate({left:"0"},"medium")},function(){jQuery(this).stop().animate({left:"-70"},"medium")},500)});
/*]]>*/
</script>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js"></script>
<style type="text/css">
.latesthack {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeukqLxwkJOnW-E33xsNnhXPxaHlbgaFBtjaPxmnypFMUguDqGEE_B2R4Corg8afwhPcoKniJxq5DwRnPNPp5KgFXpIy1ili6F2SWIeLw5HJRM8Zs3bOjIlrF65tF-e9Fz3NTaU59qk0E/s320/latesthack.com-image.png") no-repeat scroll right top transparent !important;
display: block;float: left;height: auto;
padding: 0 45px 0 0px;
width: 65px;
z-index: 99999;
position:fixed;
left:-70px;
top:20%;
}
.latesthack div {
border:none;
position:relative;
display:block;
}
</style>
<div class="latesthack" style="">
<div>

<div class="addthis_toolbox addthis_floating_style addthis_counter_style" >
<a class="addthis_button_facebook_like" fb:like:layout="box_count"></a>
<a class="addthis_button_tweet" tw:count="vertical"></a>
<a class="addthis_button_google_plusone" g:plusone:size="tall"></a>
<a class="addthis_counter"></a>
<p style='font-size:8px; font-weight:bold; text-align:center;margin-top:10px;'><a href='http://blazerracing.blogspot.com' >Get This</a></p>
</div>
</div></div>

Simpan dan lihat hasilnya.

Cara Buat Disable Klik Kanan Mouse Pada Blog

Banyak sekarang orang mengambil artikel blog kita tanpa menyertai sumber artikel tersebut. Tentu kalian sangat kesal kan ?? Kali ini saya akan share "Cara Disable Klik Kanan Mouse Pada Blog" gak usah basa-basi langsung aja liat cara di bawah 

Script :

<script>
var message="Maaf, klik kanan tidak diperbolehkan!";
///////////////////////////////////
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>

Cara-cara : 

• login ke blogger anda
• Pada halaman Dasbor klik Nama Blog Anda
• Pilih Tata Letak >> Tambahkan Gadget, pilih type gadget 'HTLM/Javascript lalu paste kan Script yang ada diatas tadi tidak perlu di kasih judul kemudian klik simpan
• Periksa blog anda dan coba klik kanan :D Semoga Berhasil

NB : Kalo ingin copas artikel ini harap sertakan sumbernya ya :) 

Membuat Like Box Facebook Tersembunyi

Facebook dapat di jadikan sumber promosi para blogger, karena pengguna facebook kian hari kian banyak maka tidak ada salahnya mempromosikan blog kita di facebook. Like box fb di blog bisa membuat orang yang berkunjung ke blog kalian bisa sekalian mengLike FansPage Blog sobat, tetapi agar tidak memakan tempat Like Box FB dapat disembunyikan seperti tutorial berikut.

1. Masuk ke blogger.
2. Klik Rancangan/Design » Tambah Gadget » HTML/Java Script
3. Pastekan kode di bawah ini pada kolom yang sudah disediakan.

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.floatinglikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhegp3REdQTrpLqy2IPre_9P8GvdqKB-sz22ssh2_IusFSvr1Ic0dx8XuMBzz3dOFxXsnE3GMOdJmnT83VnaLrmemnGyPZMSoGt1_zf4DhuBK4bxx5WIhjJEeEo14MLEN9HXB4prC0F8E8/s1600/floatingfb.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.floatinglikebox div{border:none;position:relative;display:block;}
.floatinglikebox span{bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.floatinglikebox span a{color: #808080;text-decoration:none;}
.floatinglikebox span a:hover{text-decoration:underline;}
</style><div class="floatinglikebox" style=""><div><iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/viking.community&amp;width=251&amp;height=270&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23cccccc&amp;stream=false&amp;header=false&amp;appId=159468740772399" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; height:270px; background:#fff;" allowtransparency="true"></iframe><span><a href="http://kevin-thereds.blogspot.com/2012/07/membuat-like-box-facebook-tersembunyi.html " target="_blank">+ Get This</a></span></div></div>

4. Pergi ke-Tab Edit HTML dan Pastekan Kode dibawah ini tepat diatas kode </head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"> </script>

5. Terakhir "SAVE TEMPLATE"

Keterangan :
- Ganti Kode Yang Berwarna HIJAU dengan URL FansPage Sobat

Sumber

Cara Membuat Chat Room Di Blog

Kali ini saya mau share "Cara Membuat Char Room Di Blog" caranya sebagai berikut :

1. Login ke blogger terlebih dahulu
2. Masuk ke tata letak
3. Klik tambahkan gadget
4. Pilih HTML/Javascript
5. Masukkan kode di bawah ini di kolom HTML/Javascript :

<div style="width:300px"><style>.mcrmeebo { display: block; background:url("http://widget.meebo.com/images/r.gif") no-repeat top right; } .mcrmeebo:hover { background:url("http://widget.meebo.com/images/ro.gif") no-repeat top right; } </style><object width="300" height="350"><param value="http://widget.meebo.com/mcr.swf?id=IkJeoXiwiU" name="movie"/><embed width="300" src="http://widget.meebo.com/mcr.swf?id=IkJeoXiwiU" height="350" type="application/x-shockwave-flash"/></embed></object></div>

Keterangan : "width:300px" dan width="300"
angka 300 dapat kamu ubah sesuai lebar yang kamu inginkan
height="350" dan height="350"
angka 350 dapat kamu ubah sesuai tinggi yang kamu inginkan

Tahap-Tahap Untuk Menghentikan Kebiasaan Merokok!

Yang suka merokok :D
Nih baca biar gak terlalu kecanduan merokok..


Tahap 1, Pre-Kontemplasi


Ini adalah masa di mana perokok beranjak dari tidak mengetahui bahaya merokok (atau tidak peduli) ke kondisi mulai memikirkan efek negatif dari merokok atau efek positif dari berhenti merokok. Pada tahap ini, perokok masih merasa bahwa efek negatif rokok hanya akan berefek pada orang lain dan bukan pada dirinya, sehingga merasa aman untuk merokok. Belum ada yang tahu tingkat kesiapan perokok untuk berhenti, bahkan mungkin termasuk si perokok itu sendiri (Zimmerman dkk., 2000; Mallin, 2002).


Apa yang bisa dilakukan: Berikan terus informasi mengenai bahaya merokok atau nilai plus dari berhenti merokok. Dengan banyaknya informasi, diharapkan ada pengetahuan yang dapat menyentuh si perokok secara emosi sehingga dia tergerak untuk menyusun rencana berhenti merokok. Ada baiknya juga untuk mulai memonitor dan memupuk kesiapan perokok untuk berhenti (Zimmerman dkk., 2000; Mallin, 2002).


Tahap 2, Kontemplasi


Pada tahap ini, perokok sudah menyadari bahaya merokok dan mulai berniat untuk berhenti. Tantangan yang dihadapi oleh perokok adalah emosi negatif yang timbul karena pilihan untuk meninggalkan kegiatan yang ia senangi (Zimmerman dkk., 2000; Mallin, 2002).


Apa yang bisa dilakukan: Keluarga atau terapis harus bisa mengajak perokok untuk fokus ke efek positif yang didapatkan dari berhenti merokok. Ajak juga perokok untuk mengenali hal-hal yang bisa menghalanginya berhenti merokok, seperti, kurangnya motivasi, teman-teman kantor yang merokok, dan lain-lain (Zimmerman dkk., 2000; Mallin, 2002).


Tahap 3, Persiapan


Pada tahap ini, persiapan spesifik sudah mulai dibuat. Misalnya, tanggal berapa perokok akan mulai menyetop sama sekali konsumsi rokok, obat atau pengganti nikotin apa yang akan dipakai untuk mengurangi perasaan “nagih”, mulai menyingkirkan asbak atau barang-barang lain yang mengingatkan pada rokok, dan lain-lain.


Perokok juga sudah mulai bisa untuk mengurangi konsumsi rokok atau mengganti rokoknya dengan merk yang lebih ringan. Melakukan perubahan bertahap akan lebih mudah daripada secara drastis berhenti membeli dan menghisap rokok (Zimmerman dkk., 2000; Mallin, 2002).


Apa yang bisa dilakukan: Keluarga bisa mendukung perokok dengan menghafal program-program yang dibuat dan mendukungnya dengan konkrit, memastikan tingkat konsumsi rokoknya sudah mulai menurun, menyebarkan kabar bahwa si perokok sedang mencoba berhenti sehingga tidak ada yang mengajaknya merokok, mendiskusikan cara untuk menghindari atau menghadapi hal-hal yang mengingatkan pada rokok, ikut menentukan tanggal berhenti (misalnya, pada hari ulang tahun si perokok) dan lain-lain (Zimmerman dkk., 2000; Mallin, 2002).


Tahap 4, Aksi


Pada tahap ini, perokok sudah berhenti mengonsumsi rokok. Kecanduannya bisa “dijinakkan” dengan koyo nikotin atau obat seperti bupropion yang dosisnya juga makin lama makin diturunkan. Pada tahap ini, perokok sangat membutuhkan dukungan. Minimal, satu minggu sekali harus ada sesi yang membicarakan keberlangsungan proses berhenti merokoknya. Perokok harus fokus kepada efek positif yang didapatkan sejak berhenti merokok (Zimmerman dkk., 2000; Mallin, 2002).


Yang bisa dilakukan: Mencarikan grup orang-orang yang sedang berhenti merokok untuk memberi dukungan, ikut datang dalam pertemuan grup tersebut, mencarikan bantuan profesional (psikolog atau terapis) jika tidak ada support group, mengajak perokok untuk melakukan aktifitas yang dapat membuat lupa tentang rokok, dan banyak lagi (Zimmerman dkk., 2000; Mallin, 2002).


Tahap 5, Bertahan atau Kembali Merokok


Tahap ini adalah masa pengujian di mana perokok sudah mulai menjalani “kehidupan baru”-nya sebagai mantan perokok dengan mandiri. Mantan perokok sudah harus bisa mengalahkan godaan tanpa bantuan orang lain. Penggantian zat kimia pengganti rokok sudah dihentikan. Yang dimiliki mantan perokok hanyalah dukungan dari psikolog, keluarga atau support group dan motivasi untuk hidup lebih sehat. Kini, si mantan perokok akan melihat apakah ia sanggup bertahan dari rokok atau kembali ke jeratan rokok (Zimmerman dkk., 2000; Mallin, 2002).


Yang bisa dilakukan: Ikut memberi semangat kepada mantan perokok, memberikan pujian atau hadiah tiap mantan perokok dapat bertahan selama waktu tertentu (misalnya, tiap bulan) dan tidak terlalu menekan andaikata mantan perokok sesekali menyalakan rokok.


Jika merokok kembali menjadi rutinitas (relapse), keluarga dan teman bisa membantu dengan mengecek apa yang salah dari tahapan-tahapan sebelumnya, mengecek kembali tingkat kesiapan berhenti merokok si pasien dan mengajak perokok untuk memulai kembali tahapan-tahapan berhenti merokok. Keluarga perokok juga harus menyadari bahwa kadang memerlukan beberapa kali pengulangan proses berhenti merokok ini sampai akhirnya perokok bisa stop secara permanen (Zimmerman dkk., 2000; Mallin, 2002).




Itu Aja Yang Bisa Saya Sampaikan, So! Tunggu apa lagi Jauhi Rokok Itu Dari Sekarang!

Tips Memasukkan Lagu Sesukamu Di Blog

Wah....
Ada Tips baru nih teman-teman. Mudah-mudahan bermanfaat ya :)

Sekarang saya mau berbagi artikel cara memasukkin lagu apa aja ke blog mu.
Okehh langsung aja caranya..

1.Login blogger kalian
2. Buka www.youtube.com

3.Selanjutnya liat gambar.(Klik Bila Kurang Jelas!!)

4.Kode yang saya block http://www.youtube.com/v/7zMbB3TzuPc?version=3&amp;hl=en_US
5.Tapi Jangan Ambil kode Itu Semua, Ambil Yang http://www.youtube.com/v/7zMbB3TzuPc
6.Oke kalian uda dapat kode Music Kalian masing-masing
7.Lanjut ke Blogger "Cari tata Letak => Tambah Gadged => Pilih HTML/JavaScrip"
8.Copy Kode Di Bawah Ini.

<embed src="http://www.youtube.com/v/7zMbB3TzuPc&autoplay=1" type="application/x-shockwave-flash" wmode="transparent" width="1" height="1"></embed>

9.Ganti Kode Yang Berwarna Merah Dengan Kode Yang Kalian Dapat Dari YouTube Tadi(Cara No.4 dan 5).
10.Kemudian Save!!!

Cara Disable Klik Kanan Pada Blog

Udah lama gak post di blog :D. Nah kali ini saya mau share "Cara Disable Klik Kanan Pada Blog" Langsung aja liat caranya. 

Caranya : 
1. Masuk ke Blogger Dashbord
2. Pergi ke rancangan / Template
3. Klik Edit HTML 
4. Centang pada Expand Widget 
5. Cari kode ]]></b:skin> / Cari memakai tombol CTRL + F untuk memudahkan pencarian kemudian copy kode di bawah ini dan paste kan di bawah code ini tadi ]]></b:skin>

<script type='text/javascript'>
//<![CDATA[
var message="";
function clickIE() {if (document.all) {(message);return false;}}
function clickNS(e) {if (document.layers||(document.getElementById&&!document.all)) {
if (e.which==2||e.which==3) {(message);return false;}}}
if (document.layers)
{document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;}
else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;}
document.oncontextmenu=new Function("return false")
//]]>

</script>

Selesai :D 
Caranya cukup mudahkan ? 
Selamat mencoba ya. Semoga artikel kali ini bermanfaat
Terima Kasih 

SUMBER