Miztah Grenade Hat: Tutorial : Welcome Image ( Click Here To Enter )

Ok hari ini Hazwan nak ajar macam mana nak buat Welcome Image untuk blog korang..Bermacam-macam jenis ada, kalau nak lagi boleh cari dekat google :')Sebelum tuh aku keditkan kepada Abang Apit yang hensem dengan Cik Lyssa comel kita ..
Okayy jom kita mula, bismillah
1. Log In > Dashboard > Dashboard > Design > Edit HTML > Tick Expand Widget
2. Tekan (Ctrl + F) serentak dan copy kod bawah nih (Ctrl + C) lepastuh paste (Ctrl + V) dalam kotak search kecik yang akan keluar bila Ctrl F tuh..

]]></b:skin>

3. Sekarang, copy code di bawah ni di atas kod yang kita 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. Link yang warna merah letak la URL image taw.

5. URL Image nak amik mane? Dekat bawah nih aku dah sediakan, pilih ikot citarasa sendiri.

6. Kalau menjadi, Save Template > Delete Widget .

*Perhatian* Kalau dah save tak boleh nak remove balik..
So, nasihat dan cadangan Hazwan lebih Download Full Template ke pc korang. And bila korang xnak ada welcome image tuh, boleh upload balik template yang dah save tu.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGsFcl-QPlId7UIm4RG1r9tcLOE1s68baaScWObE5nzDOz7ijO_wznNFRl5ivp1CHAFNLWjs_p8G57t46vmdkovw5yWQC3NgXw2VBVJC_7erKIsct6rbnxf02y7Phn2tIP-hpy2PhfZ2-8/s1600/Welcome+Note+2.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTk7tA3wXxzZ2qdpyBJuMNrdVPuo6qaB0q0hjpAXqoUZM0jXGi-AYraO92xFSET8gMMne7eP9qVhfmJk5yiKiz8AdCOzsqW86ejKsevp7z7_Tos9BrytYc5b105tVIzjgj8Z5O6Qjfpsgn/s1600/Welcome+Note+3.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIHqxCs9t4F-hNnRDSG-amD-HItVYTc-5um_q2K9e8zMXZivw9yXE_lmTlYgLW8yKifm9h4ebH89-27vysJNwbtpbkXO9nWb66TFzat4x_VBI74T8HUmgVK7M66xFgBYBd8YcCf-36Y6Hc/s1600/Welcome+Note+4.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_dl6Oty1UFngDJ7a1jY_qwInkrPwcGgaKiiduTykkApA0oTf90D0zHJKARnLz9Zvv-KRftYDb9w50YByuZPQEs3kFCDTbfOfZMyKM1eocNYBoFhLexJVr2dwbPBTOgjnZNH7tKrRBC8cv/s1600/Welcome+Note+Pink.png