Tutorial : Hide Shoutbox with Cute Icon

heyyyyyyyyy korang yg disayangi . Tetiba jari jemari intan ni bergerak nk buat tutorial psl hide shoutbox . haaaaaa ? HIDE SHOUTBOX ? wehhh mcm mne tuu ? alaaa tgk blog intan okay ? tekan Icon yg comel tu baru shoutbox nye keluar . Sape2 yg belum ade shoutbox . Tekan SINI dulu . Kalau yg dah ade shoutbos terus follow steps okay ? :)
1 .  Dashboard > Add Gadget > Html / Javascript
2 . Copy Code kat bawah ni . paste kat ruangan yg disediakan . 

<style type="text/css">
#gb{ position:fixed; top:50px; z-index:+1000; } * html #gb{position:relative;}
.gbtab{ height:350px; width:140px; float:left; cursor:pointer; background:url('URL PIC YANG KORUNK SUKA') no-repeat; } .gbcontent{ float:left; border:2px solid #00000; background:#F5F5F5; padding:10px; } </style>
<script type="text/javascript"> function showHideGB(){ var gb = document.getElementById("gb"); var w = gb.offsetWidth; gb.opened ? moveGB(0, 150-w) : moveGB(170-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">
MASUKKAN KOD SHOUTMIX KORUNK KAT SINI :)
<div style="text-align:right"> <a href="javascript:showHideGB()"> [close] </a> </div> </div> </div> <script type="text/javascript"> var gb = document.getElementById("gb"); gb.style.right = (140-gb.offsetWidth).toString() + "px"; </script>

3 . Biru : Tukar mengikut kesesuaian .
     Merah : Letak Url yang korang suka .
     Kuning : Masukkan code cbox korang .

4 . FREEBIES > HERE 

5 . Dah siap semue ? Okay tekan SAVE !!

PESANAN : Kalau korang copy URL Icon tu kan , lepas tu dah tekan SAVE . tetibe tk nampak pulak iconnye kann .. apa yg perlu di  buat ? scroll bawah lagi ..


1 . Save Icon tersebut kat computer korang .

2 . Tekan Link ni > http://imgur.com/

3 . Upload balik icon korang tu . Then Copy URL nye kat DIRECT LINK . !!

4 . Lepastu tukar jelah URL yg dekat code panjang tadi tu ..

5 . SAVE :)

Tutorial : Letak Perkataan Assalamualaikum di Setiap Entry

1 . Dashboard > Setting > Formatting > Post Template
2 . Ada ruangan kosong an ? Cope dan paste code kat bawah ni di ruangan yg disediakan . 

<center><img src="URL PERKATAAN ASSALAMUALAIKUM"/></center>

3 . Merah : Freebies is HERE   .

4 . Copy je URL okay ?

5 . tekan Save . Done :)

Tutorial : Background Blog

The tutorial begins for Blog background :)
1 . Dashboard > Add A Gadget > HTML / Javascript 
2 . Copy code kat bawah ni then paste kat ruangan yg disediakan . 

<style> body { background-image: url('URL BACKGROUND'); background-attachment: fixed; background-repeat: repeat; } </style>

3 . Merah : CLICK HERE or HERE .  Tukarkan je okay ?

4 . Save :)

Tutorial : Header Blog

Okay , Header Blog pulak ye :)

1 . Layout > Header > Edit > Upload Image . 
2 . Haaaa kat mnaa nk dpt Header yang comel ? Tekan Link di bawah ni okay ? 
     HEADER
     HEADER
3 . Save image je okay ? :) lepastu tekan SAVE !!

Tutorial : Cursor

Heyy Boys and Girls . Kali ni punya tutorial pasal cursor .. yaaaaahhhh ape itu cursor ? alahh pointer .. haa faham ? nk tukar kepada icon yg lebih comel .. Follow steps :)

1 . Dashboard > Add Gadget > Html/JavaScript
2 . Copy dan Paste code yg kat bawah ni di ruangan yg disediakan . 

<style>body {cursor:url(URL ICON), url(URL ICON), auto;} </style> <a href="LINK BLOG KORANG" target=_blank><div style="height: 50px; width: 50px; position: absolute; top: 0px; left: 0px;"> </div></a>

3 . Merah :  Boleh dapatkan URL Icon DISINI dan DISINI   .
     Oren : Letak Link Blog korang okay ?

4 . Dah siap semua ? apaa ditunggu lagi dongg . Tekanlah SAVE .

Tutorial : Favicon

1 . Dashboard=>Design=>Edit HTML=>Tick expand widget template .
2. Tekan CTRL+F , search code dekat bawah ni ok :)

</head>

3 . Dah jumpaa ? Cari code yang bawah ni pulak . Paste DI ATAS code yg kita cari tadi .

<link href='URL gambar' rel='shortcut icon' type='image/x-icon'/> 
<link href='URL gambar' rel='icon' type='image/x-icon'/>

4 .  URL gambar <--- Boleh di dapati DISINI  . 

5 . Dah pilih ? okayy :) PREVIEW dulu okay . kalau menjadi ,  Tekan SAVE . 

Tutorial : Shoutbox / Cbox

Heloo :) Okay Intan tau kepada new bloggers , korang pun tktau nk letak ape kt blog korang tu en , so korang kene ada cbox . Apakah itu cbox ? alaaa mcm tinggalkan jejakla . Orang Blogwalking kt blog kita then die tinggalkan jejak dia kt cbox kita suruh follow dan sebagainya :) So tutorials Beginsss (Y)
1 . Tekan SINI 
2 . Tekan SIGN UP . 
3 . Fill up segala borang yg die suruh isikan .. alaaa mcm bawah ni .. isikan semuanya okay ? :) 

4 . Lepas dah isi semua bende yg die suruh tu tekan CREATE MY CBOX . 

5 . Then , Sign In account korang . 

6 . Cantikkan dulu cbox korang tu kat Look and Feel . Macam ni yaaa :p

7 . Dah siap atur warna semua kann ? Okay Tekan APPLY . 

8 . Lepastu tekan PUBLISH !!!

9 . Copy semua code tu dan paste kan di HTML / Javascript . 

10 . Tekan SAVE !! Yeayyyyy dah siapppp :)

  Selamat Mencuba :)

Tutorial : Welcome Image / Welcome Note

Heyyy korang semua :) Today intan nk bgy tuto mcm mne nk buat welcome image :) and of course ade freebies sekali :) So , the tutorial begin :)

1.  Log in >  Edit Html > Tick Expand Widget Templates
2 .  Tekan Ctrl F serentak , cari kod ini :

]]></b:skin>

3 . Dah jumpaa kan ? Paste kan code yg kat bawah ni DI ATAS code yg cari tadi .

</style></head><script language="javascript" type="text/javascript">/* toggle() checks to see if the images has already been fadedor not and sends the appropriate variables to opacity(); */function toggle(el,milli) {// Get the opacity style parameter from the imagevar currOpacity = document.getElementById(el).style.opacity;if(currOpacity != 0) { // if not fadedfade(el, milli, 100, 0);} else { // else the images is already fadedfade(el, milli, 0, 100);}}/* changeOpacity() uses three different opacity settings toachieve a cross-browser opacity changing function. Thisfunction can also be used to directly change the opacityof an element. */function changeOpacity(el,opacity) {var image = document.getElementById(el);// For Mozillaimage.style.MozOpacity = (opacity / 100);// For IEimage.style.filter = "alpha(opacity=" + opacity + ")";// For othersimage.style.opacity = (opacity / 100);}/* fade() will fade the image in or out based on the startingand ending opacity settings. The speed of the fade isdetermined by the variable milli (total time of the fadein milliseconds)*/function fade(el,milli,start,end) {var fadeTime = Math.round(milli/100);var i = 0; // Fade Timer// Fade inif(start < end) {for(j = start; j <= end; j++) {// define the expression to be called in setTimeout()var expr = "changeOpacity('" + el + "'," + j + ")";var timeout = i * fadeTime;// setTimeout will call 'expr' after 'timeout' millisecondssetTimeout(expr,timeout);i++;}}// Fade outelse if(start > end) {for(j = start; j >= end; j--) {var expr = "changeOpacity('" + el + "'," + j + ")";var timeout = i * fadeTime;setTimeout(expr,timeout);i++;}}}</script><div class="input" onClick="javascript:toggle('wise', 3000); this.style.display='none';document.getElementById('june').style.display=''"><center><img src="URL IMAGE YANG KORANG SUKA"style="opacity:0.4;filter:alpha(opacity=40)"onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"onmouseout="this.style.opacity=0.7;this.filters.alpha.opacity=40"/></center></div><div id="wise" style="filter : alpha(opacity=0); -moz-opacity : 0; opacity : 0;"><div id="june" style="display : none;"><body>

4 .  URL IMAGE YANG KORANG SUKA <--- korang boleh dapatkannya DISINI dan DISINI  . 

5 . Okay , Lepas tu Preview . kalau menjadi apaa ditunggu lagii tekan SAVE !!! 

6 .  Lepas sudahh SAVE akan keluar KEEP WIDGET or DELETE WIDGET .
       tekan DELETE WIDGET ok ? 

Okayy dah siap bagy tutorial and freebies . Selamat mencuba :)