Tutorial Float Shoutbox

mcm lama dh Nadia tak update blog nie ha..mesti blog ni sedeyh & nangis malam malam kan.sebab..sebab..kurang kaseh syg..oleh yang demikian.. *asl asek kuar ayat ayat cinta nie.hehe.. .malam nie Nadia nak buat satu tutorial..tapi..tapi..ada tapi pulak.haha..float shoutbox nie Nadia tak abis edit koding.

so.kalau nak float pun.dapt buat LEFT & RIGHT je.CENTER tak dapat..di sebab kan ada yg

tnya mcm mne nak buat shoutbox kat blog Nadia ni..Nadia buatkan lah untuk korang okeh.

hohoho..*jangan gelak sudah..Nadia blom dapat buat koding center.

LANGKAH 1

• mula mula..DESIGN > PAGE ELEMENT >  ADD GADGET > HTML/JAVASCRIPT

LANGKAH 2

• ambik koding nie.paste kat dalam gadget HTML/JAVASCRIPT

<style type="text/css">
.gb_fixed{
position:fixed;
top:50px;
right:0px;
z-index:+10;
}
* html .gb_fixed {position:relative;}
#hidden_gb2 {
display:none;
border:3px solid #f5f347;
background:#604c3a;
right:10px;
padding:10px;
padding-top:20px;
}
</style>
<div class="gb_fixed">
<table id="hidden_gb2" cellpadding="0" cellspacing="0">
<tr><td>

KODE CBOX/SHOUTMIX KORANG

<div><center><a href="javascript:void(0)" onclick="gb_showHideGB()">
<img src="URL BUTTON CLOSE"/></a></center></div>
</td></tr></table>
</div>
<script src="http://sites.google.com/site/copycatgroup/Home/jsfile/hiddengb2.js"></script>
<div style="z-index:+5" class="gb_fixed">
<a href="javascript:void(0)" onclick="gb_showHideGB()">
<img src="URL BUTTON SHOUTBOX"/></a>

LANGKAH 3

• hoho,tengok kod yg wrna merah tu.kat ctu.korang boleh tukar warna background dalam shoutbox & border shoutbox korang. tukar kod warna okeh.heee :) yg top tu.jarak button korang dari atas..

LANGKAH 4

•  <img src="URL BUTTON CLOSE"/> = yg nie kalau korang nak buat button CLOSE/TUTUP dalam bentuk gambar..nak tulis cmtu je pun boleh jugak.korang gantikan kode nie dngan ayat ayat cinta yg korang nak.hehe..for example : close : tutup : get out : boleh belaaaahhh. :  hehe..
• <img src="URL BUTTON SHOUTBOX"/> = yg nie pulak button shoutbox korang.nak buat sendiri pun boleh..solehah pun ada buat beberapa bijik untuk korang.tapi..tak cantek kot.. :)
  

LANGKAH 5

• dah siap.korang SAVE okeh..jadi tak??kalau tak jadi..hehe..bgtau Nadia yep.

nnti dah pandai buat kat CENTER.Nadia renew tutorial nie okeh.

nie.sapa yg nak ambik.boleh bahh..hehe..Nadia buat..tak cantek..korang try buat

sendiri jugak okei. :)

BUTTON SHOUTBOX

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3zfY061D4H1XUnmqhRelkYdiIXhsoOAEdkc_JxkAqD2P092O5fmhLCoWaSPq8ImduB877w5Gvm73SK3LRcwkqXFliCN55Ffwg7A8czcB9pP5cNFalm9tv7qaRf3t-nPpCaUhQI7NHhHyu/s1600/shoutbox1.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKS-UxqxnwyDthylHKZZzsBAps-N-A4vwhE4tK9GlxEknlB2nQ01YgX3TgK922tSEnIj5p3wERphAUXrSbepJFTL6pJ-hCNNF1H1ZGjbX-vkjaW7hxZQeXqkHZn1Etxi_syhAl2N_WmV-u/s1600/shoutbox2.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimzX7vu7OUpLABnG-TxmgONZNhHnB6OcOV8dwZIH_xjafS5Cv7-f_Qd2IgZDtx2m_4B9FxxoCR3Bdvg67JEKbpW7Js6SOR2YV3PLW7XJjmWwgrmgHUZJKPu7pxDZofc2DqMQ2Q98IPv9av/s1600/shoutbox3.png


BUTTON CLOSE.

 

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibgHcSQy5ehDyn5pOXr2W_VEfUJoPsL0vjUYvkn4vPzRatC3bIVNhpMrrR9AuReR2cVzuSJnFRB-NCjwDcjqbzDomZrjvlZ2WD2fMcdh-Qhb_W231AWRL2P29h1I1aQHC4BHIRzBU7k93F/s1600/TUTUP1.png

 

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhvDvECi52WMABYwogTJVLcEG40c27Ds7yoUlsod_so5qlMUFVSYHbFae6AUT0wmjGI3sw-kf2_8I5scGxv3UnwIlh5UzjtyIuvTfuPxYXQHOjeyybSofpihGJ9JhLQWCI7_mLiudFc22Os/s1600/CLOSE1.png

dah renew button close jd kecik ckit :)

---

Suka ? Like...

---