Cara Membuat Cbox alias Chat Box

ehm ehm ... kali ini aku akan memposting tentang bagaimana caranya membuat Chat Box alias Cbox , aku yakin para sobat pasti bingung sebenarnya pas aku posting tentang Cara Membuat Buku Tamu/Shoutbox Melayang di Samping , mungki para sobat pemula pada bertanya2 ? apa itu Cbox or Shoutmix ??? tul kan ????

Nah maka dari itu, kali ini aku akan kasih tau cara membuatNya , simak dan langsung praktek juga boleh .... hehehe

Membuat Kata Sambutan Saat Pertama Membuka Blog Kita

1. Login blogger
2. masuk ke rancangan 
3. edit html
4. Centang tanda Expand Template Widget
5. lalu letakkan kode di bawah ini di bawah kode </head> (untuk mempermudah pencarian gunakan tombol ctrl+f)

<script language='JavaScript'>alert("Selamat datang di Blog KuNitMauLana , semoga bisa bermanfaat");</script>

Teks yang berwarna Hijau silahkan ganti sesuai keinginan kawan-kawan.........

simpan template, dan selesai......
Selamat mencoba....

Membuat Kata Penutup Saat Blog Kita Ditutup

1. Login blogger
2. masuk ke rancangan 
3. edit html
4. Centang tanda Expand Template Widget
5. lalu letakkan kode di bawah ini di bawah kode </head> (untuk mempermudah pencarian tekan ctrl+f)

<script type='text/javascript'><br /> // goodbye alert<br /> function goodbye(){<br /> alert('<span style="color: red;"><span style="color: blue;">Terima kasih telah berkunjung !! Silahkan Kembali dan Beri Komentar Anda! Terimah Kasih</span></span>');<br /> }<br /> parent.window.onunload=goodbye;<br /> </script></span>

  Untuk teksnya , sobat bisa ganti sesuai keinginan..........
 
Save template, selesai dach

Selamat mencoba.............

Cara mudah membuat textarea

Silahkan kopi paste kode berikut :

<p align="center"><textarea name="code" rows="6" cols="20"> Masukkan teks yang diinginkan disini </textarea></p>

Hasilnya seperti dibawah ini :

Masukkan teks yang diinginkan disini , Masukkan teks yang diinginkan disini , Masukkan teks yang diinginkan disini , Masukkan teks yang diinginkan disini , Masukkan teks yang diinginkan disini , Masukkan teks yang diinginkan disini

cols adalah lebar dari textarea  rows adalah tinggi dari teks area tsb, silahkan ganti sesuai kebutuhan

Cara Pasang Efek Kupu-kupu berterbangan di Blog

Login ke Blogger
Klik Rancangan → Elemen Laman → Tambah Gadget → HTML/JavaScript
Kemudian Copy kode script berikut yang sobat sukai dan Paste ke dalamnya :

Contoh gambar Kupu-kupu 3

code Scriptnya :

<span class="fullpost"><tt style="color: red;"><script language="JavaScript1.2" src="<span style="color: blue;">http://kangdadang.googlecode.com/files/Kupu-kupu3.js</span>"></script> </tt></span>

Membuat Menu Scrollbox Elastis

.elastcx {
float: left;
position: relative;
width: 170px;
height: 200px;
margin: 0 10px 5px 0;
}
.elastbx {
top: 0; left: 0; position: absolute;
line-height: 11px;width: 150px;    height: 188px;
background: url(http://i269.photobucket.com/albums/jj72/myem0/star-background-034.gif) repeat;
border: 2px solid #999999;
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;  
border-top-left-radius: 12px;
border-bottom-right-radius: 12px;
-moz-border-radius-topleft: 12px;
-moz-border-radius-bottomright: 12px;
-webkit-border-top-left-radius: 12px;
-webkit-border-bottom-right-radius: 12px;
overflow-x: hidden;
font-family: trebuchet ms;font-size: 9px;
padding: 8px 8px 15px;
overflow: hidden;-o-transition: all 0.9s ease-out;
-moz-transition: all 0.6s ease-out;
-webkit-transition: all 0.9s ease-out;
}
.elastbx:hover {
line-height: 15px;width: 500px; height: 300px;
color: #000;
background: url(http://i269.photobucket.com/albums/jj72/myem0/star-background-034.gif) repeat;
font-size: 14px;overflow: auto;
}
 

1. Cara membuatnya : Login blogger
2. Rancangan, edit html, cari kode ]]></b:skin>
3. Simpan kode berikut tepat diatas kode tadi :

Cara Membuat Shoutbox Melayang di Sisi Layar Blog

Cara membuatnya :

1. Login blogger
2. Rancangan, Elemen laman, Tambah gadget, pilih Html/Java script
3. Lalu simpan kode berikut :

<style type="text/css"><br /> #gb{<br /> position:fixed;<br /> <span style="color: #000099;">top:50px;</span><br /> z-index:+1000;<br /> }<br /> * html #gb{position:relative;}<br /> <br /> .gbtab{<br /> height:100px;<br /> width:30px;<br /> float:left;<br /> cursor:pointer;<br /> background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiXp7kd7PuqCrEZSbpt5Ce13V-o44NOYZOmF5GKIHHs8gkv6_6adZKW0TgOfzKeL_tNBb4ef97pJagRHky_xViOW9GI4JeJOvPcM-oi53o9rG0k4UJVulboZpC2aW7JppYk4dx-mDkjBCZE/') no-repeat;<br /> }<br /> .gbcontent{<br /> float:left;<br /> border:2px solid #A5BD51;<br /> background:#F5F5F5;<br /> padding:10px;<br /> }<br /> </style><br /> <br /> <script type="text/javascript"><br /> function showHideGB(){<br /> var gb = document.getElementById("gb");<br /> var w = gb.offsetWidth;<br /> gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);<br /> gb.opened = !gb.opened;<br /> }<br /> function moveGB(x0, xf){<br /> var gb = document.getElementById("gb");<br /> var dx = Math.abs(x0-xf) > 10 ? 5 : 1;<br /> var dir = xf>x0 ? 1 : -1;<br /> var x = x0 + dx * dir;<br /> gb.style.right = x.toString() + "px";<br /> if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}<br /> }<br /> </script><br /> <br /> <div id="gb"><br /> <br /> <div class="gbtab" onclick="showHideGB()"> </div><br /> <br /> <div class="gbcontent"><br /> <br /> <span style="color: red;"> <span style="color: blue;"><!-- Ganti ini dengan kode buku tamu kamu --></span></span><br /> <br /> <div style="text-align:right"><br /> <a href="javascript:showHideGB()"><br /> [tutup]<br /> </a><br /> </div><br /> <br /> </div><br /> <br /> </div><br /> <br /> <script type="text/javascript"><br /> var gb = document.getElementById("gb");<br /> gb.style.right = (30-gb.offsetWidth).toString() + "px";<br /> </script></span>

yang berwarna biru silankan ganti sesuai keinginan...

Save........

Cara Membuat Buku Tamu/Shoutbox Melayang di Samping Blog

Malem Sobat , kali ini ku dapet cara membuat buku tamu yang melayang disamping blog, ini tutirial ku dapat dari sini , simak yah caranya dibawah ini :

1. Log in blogger
2. Masuk ke rancangan
3. Elemen laman
4. tambah gadget, html/java script
5. Kopi pastekan kode di bawah ini :

Cara Membuat Kotak Link Exchange / Tukar Link

Buat Sobat yang belum tau cara membuat link exchange gampang kok cara nya , mau tau ? Nich caranya:

Translate Versi Google

Bagi para sobat blogger yang tertarik untuk memiliki ini Google translate , nich kunit akan coba jelaskan cara membuatnya dan meletakkannya di blog sobat.

Langsung aja yak , silahkan ikuti langkah-langkah berikut ini :

1. Masuk ke Blog sobat
2. Klik Tab Tata Letak
3. Klik Tab Elemen Laman
4. Klik Tambah Gadget
5. Klik pilihan menu HTML/JavaScript
6. Pastekan script di bawah ini ke dalam kolom konten tersebut

Cara Membuat Menu Tab View yang Cakep (2)

Halluw sobat sua lagi ma Kunit hehehe , kali ini aku mau bagi-bagi ilmu lagi yaitu Cara membuat menu

Tab View yang cakep kayak punyaku itu tuch ,,, ^^

Langsung aja yak,,, ikuti langkah-langkahnya , yang teliti and telaten biar berhasil, Oke ^_~

Cara Membuat Daftar isi Berdasarkan Label

met pagi Sobat , kali ini saya akan membahas tentang cara membuat Daftar Isi Berdasarkan Label. Langsung aja ya...

Ada 2 script yang bisa sobat pergunakan , yang pertama tanpa scroll dan yang kedua menggunakan fasilitas scroll (biar ga kepanjangan gitu)

1. Tanpa ScroLL

<script style="text/javascript" src="http://kangfatur.googlecode.com/files/daftar%20isi%20label.js"> </script><script src="http://kunitmaulana13.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>

2. Dengan Scroll

<div style="overflow:auto; border: 1px solid #CCC; margin: auto; padding: 3px; width: 95%; height: 400px; background-color: none; text-align: left;"><script style="text/javascript" src="http:// kangfatur.googlecode.com/files/daftar%20isi% 20label.js"></script><br /><script src="http://kunitmaulana13.blogspot.com/feeds/posts/default?max- results=9999&alt=json-in-script&callback=loadtoc"></script><br/><p></p></div>

NB : Ganti kode URL dengan alamat URL Sobat.

3. Klik Save. Selesai dech ^^

Semoga berhasil...

Cara Merubah Mouse/Kursor jadi Animasi

Nah ,,, untuk Sobat yang pingin buat kursor jadi animasi yang lucu2 kayak punya saya tuch , gini caranya :

1. Login ke Blogger
2. Pilih Rancangan
3. Tambah Gadget
4. Pilih HTML/JavaScript
5. Lalu isi Kode ϑī bawah ini 

<style type="text/css">
body {
cursor.url("Link gbr kursor")
,default}
</style> 

• Lalu Ganti tulisan wrna ijo itu dengan link gambar yang kamu ingin kan.

Biƨǎ copas ϑī bawah ini Jчğą : 
  

 

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSMYIaRPJUs6GKTPAMD5iHaClW9oSqST6dIiLPLcN2ujfNvYOvKjxE9k3OtVYsjHierlu6IzI_QAFFPbHCVotuoSi0ON4XDCHt8yXyXzMHSleTW9jRwf8nuL6k9cfQaQCPxLbFGTCD2RQ/s200/wulu.gif

http://i1184.photobucket.com/albums/z328/RanaMontana/cursorpitabiru.gif

Nach langkah terakhir jangan lupa untuk ϑī save...

Good Luck Plend....

Cara Pasang Upin & Ipin

AssaLamu'alaikum Sobat Blogger...

Kali ini aku akan berbagi cara pasang Widget Upin dan Ipin kayak punya ku itu , Upin & Ipin ini akan mengucapkan "Assalamu'alaikum" secara Otomatis apabila arah panah mouse di dekatkan ke gambarnya...
Langsung aJjah ya..!!!

Caranya :

1. Masuk ke Blog
2. Klik Tab Tata Letak
3. Klik Edit/HTML
4. Cari kode seperti ini : < /body>
5. Kalau sudah ketemu, letakkan script di bawah ini tepat di atas < /body>
  
> Posisi melayang Upin & Ipin ada di sebelah "Kanan Atas"

<script language="JavaScript" src="http://adiwidget.com/js/adiWidget.js" type="text/javascript"></script><script language="JavaScript" type="text/javascript">eXl1lXc('http://adiwidget.com/flash/atuk.swf','top','0px','right','0px','100001','95','170','transparent','ffffff');</script>

> Posisi melayang Upin & Ipin ada di sebelah "Kanan Bawah"

<script language="JavaScript" src="http://adiwidget.com/js/adiWidget.js" type="text/javascript"></script><script language="JavaScript" type="text/javascript">eXl1lXc('http://adiwidget.com/flash/atuk.swf','bottom','0px','right','0px','100001','95','170','transparent','ffffff');</script>

> Posisi melayang Upin & Ipin ada di sebelah "Kiri Bawah" 

<script language="JavaScript" src="http://adiwidget.com/js/adiWidget.js" type="text/javascript"></script><script language="JavaScript" type="text/javascript">eXl1lXc('http://adiwidget.com/flash/atuk.swf','bottom','0px','left','0px','100001','95','170','transparent','ffffff');</script>

> Posisi melayang Upin & Ipin ada di sebelah "Kiri Atas" 

<script language="JavaScript" src="http://h1.ripway.com/ichal13/ichalWidget.js" type="text/javascript"></script>
<script language="JavaScript" type="text/javascript">eXl1lXc('http://adiwidget.com/flash/atuk.swf','top','0px','left','0px','100001','95','170','transparent','ffffff');</script> 

6. Save
7. Jadi dach ... :D




Semoga berhasil Sobat....




Sumber : adiwidget™

Cara Mengganti Favicon Blogger

Favicon adalah icon/gambar yang terletak pada address bar dari suatu web browser.

Setiap situs atau blog biasanya memiliki favicon. Pada blogspot, favicon yang dibuat berupa logo blogger berwarna orange. Favicon ini tidak bisa diganti begitu saja melalui setting/pengaturannya. Lalu bagaimana jika anda ingin mengganti/ merubah favicon ini?
Sebenarnya cara mengganti favicon blogger ini cukup mudah. Anda bisa menggantinya melalui pengeditan layout.