nantikan peluncuran tampilan terbaru dari blog ini dalam waktu

Jumat, 26 November 2010

Cara Membuat Buku Tamu Melayang

Ada request ini dari temen ku si Sinta. kemaren malem dia abis nanya tentang cara bikin buku tamu yg di klik terus muncul itu loh yang ada di pinggir kanan.
rencana mau ane remote biar tau cara bikinnya. eeehhh koneksi tak bersahabat dengan kita. ya g sint ??? heheheh....
terus, mau ane posting tuh tutorial, eee lagi males :D
nonton TiPi deh. terus kagak tidur sampek pagi ini.
mumpung nganggur, plus bete, nulis tutorial deh buat temen-temen dan terkhusus dari yang request.

langsung saja masuk ke dasboard blogspot kalian. baca nih petunjuknya, jangan sampek kelewatan ya.
1. Pilih Rancangan
2. Elemen Halaman
3. Tambah Gadget
4. Pilih HTML/JavaScript
5.Terus untuk Judul g usah diisi, untuk konten silahkan isi sourcecode berikut ini :

<style type="text/css">
#gb{
position:fixed;
top:50px;
z-index:+1000;
}
* html #gb{position:relative;}

.gbtab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
}
.gbcontent{
float:left;
border:2px solid #A5BD51;
background:#F5F5F5;
padding:10px;
}
</style>

<script type="text/javascript">
function showHideGB(){
var gb = document.getElementById("gb");
var w = gb.offsetWidth;
gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
gb.opened = !gb.opened;
}
function moveGB(x0, xf){
var gb = document.getElementById("gb");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
gb.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
}
</script>

<div id="gb">

<div class="gbtab" onclick="showHideGB()"> </div>

<div class="gbcontent">

<center>
<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div><iframe frameborder="0" marginheight="2" marginwidth="2" height="350" src="http://www3.cbox.ws/box/?boxid=3031749&amp;boxtag=8848&amp;sec=main" id="cboxmain" style="border: 1px solid rgb(218, 218, 218);" scrolling="auto" width="95%" allowtransparency="yes" name="cboxmain"></iframe></div>
<div><iframe frameborder="0" marginheight="2" marginwidth="2" height="95" src="http://www3.cbox.ws/box/?boxid=3031749&amp;boxtag=8848&amp;sec=form" id="cboxform" style="border-style: none solid solid; border-color: -moz-use-text-color rgb(218, 218, 218) rgb(218, 218, 218); border-width: 0px 1px 1px;" scrolling="no" width="95%" allowtransparency="yes" name="cboxform"></iframe></div>
<!-- END CBOX --></center>

<br/>
<font color="00000">
Anda berminat buat Buku Tamu seperti ini?<br/>
Klik di
<a href="http://hanifspd.blogspot.com/2010/11/cara-membuat-buku-tamu-melayang.html">
sini </a></font>

<div style="text-align:right">
<a href="javascript:showHideGB()">
[tutup]
</a>
</div>

</div>

</div>

<script type="text/javascript">
var gb = document.getElementById("gb");
gb.style.right = (30-gb.offsetWidth).toString() + "px";
</script>


Keterangan :
Untuk Kode yang berwarna merah

<!-- BEGIN CBOX - www.cbox.ws - v001 -->
<div><iframe frameborder="0" marginheight="2" marginwidth="2" height="350" src="http://www3.cbox.ws/box/?boxid=3031749&amp;boxtag=8848&amp;sec=main" id="cboxmain" style="border: 1px solid rgb(218, 218, 218);" scrolling="auto" width="95%" allowtransparency="yes" name="cboxmain"></iframe></div>
<div><iframe frameborder="0" marginheight="2" marginwidth="2" height="95" src="http://www3.cbox.ws/box/?boxid=3031749&amp;boxtag=8848&amp;sec=form" id="cboxform" style="border-style: none solid solid; border-color: -moz-use-text-color rgb(218, 218, 218) rgb(218, 218, 218); border-width: 0px 1px 1px;" scrolling="no" width="95%" allowtransparency="yes" name="cboxform"></iframe></div>
<!-- END CBOX -->


ganti dengan SourceCode Shoutbox kalian.
untuk daftar shoutbox silahkan baca artikel yang ini.

buat sinta, semoga sukses ya.
kalo masih bingung silahkan tanya lagi.

jangan lupa komentarnya kawan...

17 komentar:

  1. huwaaa... terharuu... hahahay :D
    Trima kasii pak guru... I'll try :)

    BalasHapus
  2. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  3. alhamdulillah.... berhasil :)
    Trima kasiih :)

    BalasHapus
  4. hahahhaa.........
    masih banyak tutorial dsni... monggo dicoba nggeh anak2. akakakakka

    BalasHapus
  5. gpapa e..
    calon e bapak2 jugaa kan..?
    :D

    BalasHapus
  6. ibuk'e siapa.?
    lah.?
    yang jelas cewek lah.:D

    BalasHapus
  7. itu lho mz, kan di kode html nya kan ad hruf yg warna merah. itu di ganti sma huruf yang wrna merah di bawahnya pa??

    BalasHapus
  8. @Nunu : hahahhaha....... lha iya siapa ?
    @Me2y : gini lo. kode yg berwarna merah itu ganti sama code ShoutBox mu. klo masih belom faham tanya sama sinta yg udah sukses bikin buku tamu :D

    BalasHapus
  9. WKWKWKWKWKKWKWK
    :D

    mantep bagetzzzzz...
    Thanks ya...
    Info'y..

    klo boleh gw mau tuker link ne:
    http://ramagokilabies.blogspot.com/

    BalasHapus
  10. Mksh bngt info x ktrima.. sae pisan..
    bleh mnta info y gk ni he,,, jd malu..
    bagai mana cara nya saat org lain [klik link pengikut yg ada
    di blog kita berpindah tab secara otomatis]
    dlm artian blog awal tetap ada,dan link yg di klik jg tampil
    pada tab baru secara otomatis.. pko y gtu lah lieur ngjelasin y he...

    BalasHapus
  11. LINTANG CITRA :
    oohh... gampang....
    kasih atribut target="_blank" paham kah ?

    BalasHapus
  12. makasih nih infonya sob, ane coba yah..........

    BalasHapus

Sekedar coretan untuk belajar bersam. disini saya tidak untuk bersaing, namun saya disini untuk melengkapi dan aling belajar bersama

About Me

Diberdayakan oleh Blogger.

Blog Archive

Rubrik

Follower

Shout

Layanan RSS Vivanews.com dapat diakses pada URL-URL berikut:

http://rss.vivanews.com/ Free Download Movie :