Tutorial - Button Follow & Dashboard ( Jenis 3 )


Tutorial like this ::

Button follow & Dashboard di ade kt tepi blog tau.
jom la try buat ^^ jangan lupa komen jugak yee ..



1. Dashboard > Design > Add A Gadget > HTML/JavaScript

2. Copy CODE kat bawah ni dan pastekan di bahagian tadi :

<div style='position:relative; top:230px; right: 0px; width:125px; border:1px solid #000000; border-radius:2px; position:fixed; padding:3px; color:#000000; font-size:11px; background-image:url(URL BACKGROUND); opacity:0.7; color:#000000; font-size:11px; text-align:center;'><center><img src='URL ICON'/></center><center>nak pergi mane tu?</center><a href='http://www.blogger.com/home'>Dashboard</a> | <a href='http://www.blogger.com/follow-blog.g?blogID=BLOG ID KORANG'>Follow</a></div>

3. tekan je save ..


PERLU DIUBAH ::

PINK : Warna border/tulisan
MERAH : URL background
COKLAT : URL icon
BIRU : Masukkan blog ID korang 


*Code warna cari di -> SINI
*Freebies background/icon cari di -> SINI
* Tutorial cari blog ID di -> SINI


HARAP TUTORIAL NI BERGUNA ^^


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Tarikh Di Bawah Post Tittle


tutorial like this ::

1. Dashboard > Design > Edit HTML
* Tick Expand Widget Templates

2. Tekan CTRL+F dan masukkan code ni :

<div class='post-header-line-1'/>

3. Copy CODE kat bawah ni dan pastekan di
BAWAH code yg korang cari tadi :
 <div style='border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; font-family: Arial; font-size:11px; width: 200px; margin-top: 6px; text-align: center;'><data:post.dateHeader/>,<data:post.timestamp/> | <b:if cond='data:post.allowComments'> <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 0'> Comment  </b:if><b:if cond='data:post.numComments == 1'> 1 Comment  </b:if><b:if cond='data:post.numComments &gt; 1'> <data:post.numComments/> Comment  </b:if> </a> </b:if></div>

4. tekan preview dulu, baru save =D

PERLU DIUBAH ::
MERAH : Kedudukan Tarikh..



Thank You sebab baca entry ni . Jangan lupa like dan komen .

Alhamdulillah , rezeki ..



Assalamualaikum semua.
sebelum berbuka puasa ni, zaty nk update entry jap.
Haritu zaty ade menang hadiah Top Refferal
dlm GA di blog Quraistory ..



Nak tau tak hadiah top refferal yg zaty dpt ? hehe.



Yeahh ,, ade 4 hadiah =D yang baru sampai kt
tangan zaty --> BLOUSE =D

weheee , pagi tadi sampai dan baru tadi perasan :O







Terima kasih Mizna Online Shop !
Blouse ni cantek sangat ! zaty akan hargai hadiah ni ..
Ade mase, zaty balas balek :))

Okeyh bye . Salam . selamat berbuka puasa ^^


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Image Hover (Gambar melengkung)


Cube sentuh gambar ni : 

jadi bulat ken ? hehe.. jom la try buat.
Tapi.. HANYA UNTUK TEMPLATE DENIM & MINIMA sahaja.
template lain zaty taktau pulak..


1. Dashboard > Design > Edit HTML
* Tick 
Expand Widget Templates

2. Tekan CTRL+F dan masukkan code ni :

.post img, table.tr-caption-container {

3. Copy CODE kat bawah ni dan pastekan di
BAWAH code yang korang cari tadi :
opacity: .70;
-webkit-transition: 1.4s;
 -moz-transition: 1.4s;
border-radius:10px;}
img:hover{
border-radius:200px;
-webkit-transition: 1.4s;
 -moz-transition: 1.4s;
opacity: 100.0; }

4. Tekan preview dan save .


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Pasang Scroll Bar (Jenis 3)


Scrollbar mcm ni :


Yang ni, scroll bar mcm zaty =D ade hover .
cantek la jugak.. hihih , jom la pasang .

*kalau dh ade pasang scrollbar yg sebelum ni,
delete dulu code dia.. nnti tak jadi --'


1. Dashboard > Design > Edit HTML
*Tick Expand Widget Templates

2. Tekan CTRL+F dan masukkan code ni :

]]></b:skin>

3. Copy CODE kat bawah ni dan pastekan di
ATAS code yg korang cari tadi :
::-webkit-scrollbar {
height:14px;
width: 10px;
background: #FFFFFF ;
}
::-webkit-scrollbar-thumb {
background-color: #FFFFFF;
-moz-border-radius: 10px;
border: #FFFFFF 1px solid;
border-top: #000000 5px solid;
border-bottom: #FFFFFF 5px solid;
}
::-webkit-scrollbar-thumb:hover {
border: #000000 1px solid;
border-top: #FFFFFF 1px solid;
border-bottom: #000000 1px solid;
}


4. Tekan preview dulu, kalau jadi tekan SAVE

PERLU DIUBAH ::

PINK : warna background scrollbar
OREN : warna bahagian dlm scrollbar
MERAH : warna border sebelum cursor sentuh
BIRU : warna border selepas cursor sentuh

*Code warna cari di --> SINI


DAH PASANG KEN ? KOMEN LA . NAK TAU JUGAK.


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Pasang Blockquote ( Jenis 5 )


Salam . huhhh,, zaty busy la tak dpt nk on9 blog smalam .
wakaka .. okey2 . blockquote ni mcm yg zaty pakai skarang ni :
TESTING-TESTING :)

nak try buat tak ? okk. yg dh try jgn lupa KOMEN k =D

1. Dashboard > Design > Edit HTML 
*Tick Expand Widget Templates

2. tekan CTRL+F dan masukkan code ni :

.post blockquote {

3. Copy CODE kat bawah ni dan pastekan di
BAWAH code yg korang cari tadi :

-webkit-transition-duration: 1.0s;
background-image: url(URL BACKGROUND);
border-left:5px solid #000000 ;
padding: 8px;
color: #000000;
max-width: 580px;
text-align: center;
-moz-opacity:0.75;
filter:alpha(opacity=75);
-khtml-opacity: 0.75;
opacity: 0.75;
-moz-border-radius: 10px;
border-radius: 10px;
}
.post blockquote:hover {
background-color:#FFFFFF;
border-right:5px solid #000000;
-moz-opacity:1.0;
filter:alpha(opacity=100);
-khtml-opacity: 1.0;
opacity: 1.0;
background-image:url(URL ICON);
background-repeat:no-repeat;
background-position:bottom right;
}

4. Tekan preview dulu, kalau dh jadi tkn SAVE

PERLU DIUBAH ::

BIRU : URL background sebelum blockquote sentuh
PINK : Warna Border ; sebelum/selepas
OREN : warna tulisan dlm blockquote
HIJAU : Warna background selepas cursor sentuh
MERAH : URL icon comel2

*Code warna cari di -> SINI
*URL background & Icon cari di -> SINI

erkk, okey bye . jgn lupa komen =D


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Freebies - Header Salam Ramadhan (Part 2)


Salam semua .. 

sekarang ni zaty nk bgi korang header 
Salam Ramadhan (Part 2). Part 1 di sini --> KLIK !
yang ni, zaty buat 10 warna yg berbeza . 
dan, ade 
corak rama-rama sikit. hehee
100% zaty yg buat, dan ianya FREE .. hoho..


Yang dah ambik,
mohon komen k :D

**TEKAN PADA GAMBAR DAHULU, KEMUDIAN SAVE**















Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Cepatkan Loading Blog


Salam semua .. Selamat malam .
sekarang ni zaty nak wat tutorial cara cepatkan loading blog.
# Yang dh try jangan lupa komen ;)


1. Dashboard > Design > Edit HTML

2. tekan CTRL+F dan masukkan code ni :

</body>

3. Copy CODE kt bawah ni dan pastekan di
ATAS code yang korang cari tadi :
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'/><script src='https://sites.google.com/site/jquery01/jquery.lazyload.mini.js?ver=1.5.0' type='text/javascript'/><script type='text/javascript'>jQuery(document).ready(function($){if (navigator.platform == &quot;iPad&quot;) return;jQuery(&quot;img&quot;).lazyload({effect:&quot;fadeIn&quot;,placeholder: &quot;http://3.bp.blogspot.com/_LZtXSNcp76A/THkEtEOZfrI/AAAAAAAABRo/IARVMD_8TwA/s1600/grey.gif&quot;});});</script>

4. Tekan Save Template

Cube check tgk, makin laju tak blog? hehe.
kalau masih tak laju lagi, korang pergi Design ,
dan buang ape2 code yg memberatkan blog .

Okeyh, bye. A'salam. harap tuto ni berguna ^^


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Post Tittle Ber Shadow


ber Shadow mcm ni :: 

Salam . Selamat Malam ;')
Sekarang ni, zaty nk ajar korang mcm mane nk
buat Post Tittle bershadow mcm kt atas tu.
yg dah try tu, jgn sombong2 .. komen laaa ye.

1. Dashboard > Design > Edit HTML
* Tick 
Expand Widget Templates


2. tekan CTRL+F dan masukkan salah satu code
kat bawah ni. *ikut template masing2 :

.post-title {

.post h3 {

h3.post-title {

Jumpa tak? kalau tak jumpa salah satu code kt atas ni,
cube korang cari code yg berkenaan dgn post tittle.

3. Copy CODE kt bawah ni dan pastekan di 
BAWAH code yang korang cari tadi :

text-shadow: 2px 2px 3px #FF769B;

 4. Tekan preview dulu, kalau dh jadi tekan SAVE



Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Simple Navigate ( Jenis 3 )


Navigate mcm ni ::

Salam . sebelum tunggu waktu berbuka, zaty nk wt tuto sikit.
navigate ni sesuai letak kt bawah header .
tapi nk letak kt sidebar pon boleh, ikut suke la.
sebelum tu, credit code ; Kak Farah


1. Dashboard > Design > Add A Gadget > HTML/JavaScript

2. Copy CODE kt bawah ni dan pastekan di bahagian tadi :
<div style="text-align: center;"><span style="padding: 10px 30px; -moz-border-radius: 5px 5px 5px 5px; background-color: #F989AE;">
<a href="LINK BLOG">ENTRY</a></span> <span style="padding: 10px 30px; -moz-border-radius: 5px 5px 5px 5px; background-color: #F989AE;">
<a href="URL PAGE TUTORIAL">TUTORIAL</a></span> <span style="padding: 10px 30px; -moz-border-radius: 5px 5px 5px 5px; background-color: #F989AE;">
<a href="URL PAGE FREEBIES">FREEBIES</a></span><span style="padding: 10px 30px; -moz-border-radius: 5px 5px 5px 5px; background-color: #F989AE;">
<a href="URL PAGE CONTEST">CONTEST</a></span> <span style="padding: 10px 30px; -moz-border-radius: 5px 5px 5px 5px; background-color: #F989AE;">

3. tekan je save :) 


PERLU DIUBAH ::
MERAH : warna background navigate *Cari Di Sini
BIRU : URL link/page . bile klik dia pergi ke page tu.
PINK : tajuk nama di navigate 

Hurm, yg dh try tu komen lah okey ;)
selamat berbuka puasa .. *tgh lapa nii



Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Header Hover (Berpusing Dan Hilang)


 # kalau cursor sentuh header, header akan
BERPUSING dan header terus hilang .


1. Dashboard > Design > Edit HTML 

2. tekan CTRL+F dan masukkan code ni :

h1.title {

3. Copy CODE kt bawah ni dan pastekan di
ATAS code yang korang cari tadi :
.header:hover {
padding-left:150px;
-webkit-transition: 2s;
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
opacity:.01;
}


4. tekan preview dulu, kalau dh jadi tekan SAVE .


DAH JADI KOMEN TAUU !



Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Spoiler Button (Jenis 1)


Sebelum cursor sentuh :


Selepas cursor sentuh :

1. Dashboard > Design > Add A Gadget > HTML/JavaScript

2. Copy CODE kat bawah ni dan pastekan di bahagian tadi :

<div><div style="margin: 5px;">
<div style="margin-bottom: 2px;" class="bigfont"><input style="margin: 0px; padding: 0px; width: 95px; " value="KLIK SINI" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'KLIK SINI'; }" type="button"/>
</div>
<div style="border: 0px inset ; margin: 0px; padding: 6px;" class="alt2">
<div style="display: none;">
Masukkan apa-apa AYAT/CODE di sini 
</div></div></div></div> 

3. Tekan SAVE :)


PERLU DIUBAH ::

BIRU : Ayat sebelum spoiler di buka
PINK : Ayat selepas spoiler di buka
MERAH : letak ayat/apa-apa code


DAH JADI ? KOMEN LAH YE .. weheee


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Image Hover (Gambar Bertukar)


CUBA SENTUH GAMBAR NI :




bertukar ken? nak buat? ikut step2 yg zaty bgi k. hihi
sebelum mula, nak creditkan --> TB



1. Dashboard > Design > Add A Gadget > HTML/JavaScript

2. Copy CODE kat bawah ni dan pastekan di bahagian tadi :
<img src="URL gambar Pertama" onmouseover="this.src='URL gambar Kedua'" onmouseout="this.src='URL gambar pertama'" />

3. Tekan SAVE ..

PERLU DIUBAH ::

MERAH : URL gambar sebelum cursor sentuh
BIRU : URL gambar selepas cursor sentuh


Harap tuto ni berguna ^^ dan jgn lupa komen.
wakakaka .. KBYE 


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Link Hover Ke Tepi


CONTOH MCM NI :

sebelum cursor sentuh ,

selepas cursor sentuh ,

Sorry kak eyja, terprint screen nama akk ^^


1. Dashboard > Design > Edit HTML 
*Tick 
Expand Widget Templates

2. tekan CTRL+F dan masukkan code ni :

]]></b:skin>

4. Copy CODE kt bawah ni dan pastekan di
ATAS code yg korang cari tadi :

a:hover {
color: transparent;
text-shadow: 20px 0px 0px #FFADD5 ;-webkit-transition: .5s;
-moz-transition: .5s;
}

5. tekan preview dulu, kalau dh jadi tekan SAVE .


PERLU DIUBAH ::

MERAH : tukar code warna yg korang suke.
*Cari Di Sini


lalala , dah jadi? komen la .. hihi
Kbyee.. nak kol bape niy? --'


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Bubble Keluar Di Cursor


bubble mcm ni ::


1. Dashboard > Design > Add A Gadget > HTML/JavaScript

2. Copy CODE kat bawah ni dan pastekan di bahagian tadi :


<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/bubblecursor.js"></script><script type="text/javascript">
// <![CDATA[
var colours=new Array("#000000", "#000000", "#000000", "#000000", "#000000"); // colours for top, right, bottom and left borders and background of bubbles
var bubbles=100; // maximum number of bubbles on screen


/****************************
* JavaScript Bubble Cursor *
* (c) 2010 mf2fm web-design *
* http://www.mf2fm.com/rv *
* DON'T EDIT BELOW THIS BOX *
****************************/
var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var bubb=new Array();
var bubbx=new Array();
var bubby=new Array();
var bubbs=new Array();


window.onload=function() { if (document.getElementById) {
var rats, div;
for (var i=0; i<bubbles; i++) {
rats=createDiv("3px", "3px");
rats.style.visibility="hidden";


div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="1px";
div.left="0px";
div.bottom="1px";
div.right="0px";
div.borderLeft="1px solid "+colours[3];
div.borderRight="1px solid "+colours[1];


div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.top="0px";
div.left="1px";
div.right="1px";
div.bottom="0px"
div.borderTop="1px solid "+colours[0];
div.borderBottom="1px solid "+colours[2];


div=createDiv("auto", "auto");
rats.appendChild(div);
div=div.style;
div.left="1px";
div.right="1px";
div.bottom="1px";
div.top="1px";
div.backgroundColor=colours[4];
div.opacity=0.5;
if (document.all) div.filter="alpha(opacity=50)";


document.body.appendChild(rats);
bubb[i]=rats.style;
}
set_scroll();
set_width();
bubble();
}}


function bubble() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<bubbles; c++) if (!bubby[c]) {
bubb[c].left=(bubbx[c]=x)+"px";
bubb[c].top=(bubby[c]=y)+"px";
bubb[c].width="3px";
bubb[c].height="3px"
bubb[c].visibility="visible";
bubbs[c]=3;
break;
}
}
for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);
setTimeout("bubble()", 40);
}


function update_bubb(i) {
if (bubby[i]) {
bubby[i]-=bubbs[i]/2+i%2;
bubbx[i]+=(i%5-2)/5;
if (bubby[i]>sdown && bubbx[i]>0) {
if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {
bubb[i].width=bubbs[i]+"px";
bubb[i].height=bubbs[i]+"px";
}
bubb[i].top=bubby[i]+"px";
bubb[i].left=bubbx[i]+"px";
}
else {
bubb[i].visibility="hidden";
bubby[i]=0;
return;
}
}
}


document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sleft;
x=(e)?e.pageX:event.x+sdown; }


window.onresize=set_width;
function set_width() {
if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (typeof(self.innerHeight)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
else {
swide=800;
shigh=600;
}
}


window.onscroll=set_scroll;
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}


function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height;
div.style.width=width;
div.style.overflow="hidden";
return (div);
}
// ]]>
</script>

3. Tekan je SAVE :)


PERLU DIUBAH ::

MERAH : tukar je warna yg korang suke.
pastikan satu code warna je, cume letak banyak kali.
*cari code warna di sini*


DAH JADI ? KOMEN LA! hahaa.


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Border Keliling Entry


Border macam ni ::



1. Dashboard > Design > Edit HTML
* Tick 

2. Tekan CTRL+F dan masukkan code ni :

#main-wrapper {

3. Copy CODE kat bawah ni dan pastekan di BAWAH
code yang korang cari tadi :
-moz-border-radius: 50px;
-webkit-border-radius: 50px;
border-radius: 20px;
border:4px solid #000000;


4. Tekan preview dulu, kalau dh jadi tekan SAVE ;)


PERLU DIUBAH ::

BIRU : ketebalan border
MERAH : warna border


# DAH JADI ? KOMEN LA . wakaka



Thank You sebab baca entry ni . Jangan lupa like dan komen .

Freebies - Blogskin (Hit The Lights!)


Salam semua..
selamat malam ^^ busy nye skarang ni x
dapat nk update blog. hihi,
tapi tadi zaty dah siapkan blogskin ke-2 :)

tema : Hit The Lights . lagu pon tajuk yg sama.
warna : HITAM+PUTIH . 100% CODE DARI ZATY.
jadi, JANGAN sesekali nk tiru code zaty --' wakaka



--> BLOGSKIN PRIVIEW <--


CODE BLOGSKIN :


<html>


<center><img src="http://3.bp.blogspot.com/-Mjmqd0bFimU/UA0RfWZoCBI/AAAAAAAAABY/B5_qBDFPtaI/s1600/header+by+iza+zaty.png" /></center>
<title>Hit The Lights !</title>
<style type="text/css">
#navbar-iframe {display: none;}




body {
cursor: url(http://www.dolliehost.com/dolliecrave/cursors/cursors-all/cute20.gif), auto;
background: url(http://images2.layoutsparks.com/1/61305/zodiac-twinkle-stars-bright.gif);
background-attachment:fixed;
font-family: Verdana;
font-size: 11px;
}
blockquote {
background:url(http://3.bp.blogspot.com/-2A0D4wY8Rww/TzuO_pTu-zI/AAAAAAAACpQ/B9EkXNZ9C48/s1600/grey.png);
display:block;
padding:5px;
border:1px dashed #000000;
color:#878787;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}


blockquote:hover{
background:url(http://3.bp.blogspot.com/-2A0D4wY8Rww/TzuO_pTu-zI/AAAAAAAACpQ/B9EkXNZ9C48/s1600/grey.png);
display:block;
padding:5px;
border:2px dashed #CACACA;
color:#000000;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
::selection {
background: #000000; /* Safari */
color: #FFFFFF;
}
::-moz-selection {
background: #000000 /* Firefox */
color: #000000;
}
a:link, a:visited {
color:#000000;
text-decoration:none;
}
::-webkit-scrollbar {
height:13px;
width: 8px;
background: #FFFFFF;
}
::-webkit-scrollbar-thumb {
background-color: #E9E9E9;
-moz-border-radius: 2px;
border-radius: 2px;
}
::-webkit-scrollbar-thumb:hover {
-moz-border-radius: 2px;
border-radius: 2px;
background:#000000;
}
a:hover {
border-bottom:2px solid #E7E7E7;
}
.main {
background:#ffffff;
color:#000000;
padding:14px;
width:560px;
border-radius: 0px;
text-align:justify;
box-shadow:0px 0px 30px #FFFFFF;
}
.sidebar {
float: right;
background: #ffffff;
color: #000000;
padding: 14px;
width: 280px;
border-radius: 0px;
text-align: justify;
box-shadow:0px 0px 30px #FFFFFF;
}
.h1 {
text-align:left;
border-bottom: 1px solid #000000;
margin:1em;
font:normal 17px Century Gothic;
color: #000000;
}


.h2 {
font-style:italic;
font-size:11px;
margin-bottom:2em;
}
/* Comments
----------------------------------------------- */
#comments h4 {margin:1.8em 0; font-size:10px; text-transform:uppercase; color: #000000; line-height:10px; border-bottom: 0px solid #FFFFFF; background:#FFFFFF ; font-weight:normal;}
#comments h4 strong {font-size:10pt smiley monster;}
#comments-block {background: ; font:normal 10pt verdana; line-height:1.2em; padding:5px;}
#comments-block dt { margin:.5em 0;}
#comments-block dd { margin:.50em 0 0;}
#comments-block dd.comment-timestamp {margin:-.25em 0 2em; font:5pt tahoma; text-align:left; text-transform:normal; letter-spacing:.0em;}
#comments-block dd p {margin:0 0 .55em; padding:2px; background: url(http://3.bp.blogspot.com/-2A0D4wY8Rww/TzuO_pTu-zI/AAAAAAAACpQ/B9EkXNZ9C48/s1600/grey.png);; border:1px solid #EBEBEB; border-radius:2px;}
.deleted-comment { font-style:italic; color:black;}
.paging-control-container { float: left; margin: 1px 1px 1px 1px; font-size: 80%;}
.unneeded-paging-control { visibility: hidden;
}
 u {
text-decoration:underline;
border-bottom: 2px solid #9C9C9C;
padding: 1px;
}
</style>






<link href='http://i257.photobucket.com/albums/hh205/xoxojays/smilies/minidocomo/pic012demoji_13257740decoojp.gif' type='image/x-icon'/>
 <link href='http://i257.photobucket.com/albums/hh205/xoxojays/smilies/minidocomo/pic012demoji_13257740decoojp.gif' rel='icon' type='image/x-icon'/>
<body>
<table style="line-height: 17px;" width="850"  border="0" align="center" cellspacing="5">
<tbody><tr>
<br>
<td valign="top" width:550px;">


<div class="main">
<blogger><div class="h1"><BlogItemTitle><span class="PostTitle">
<a href="<$BlogItemPermalinkURL$>">
<$BlogItemTitle$></a></span></BlogItemTitle></div>
<$BlogItemBody$>
<br><MainPage>
<div style="text-align:right;" ">
<BlogItemCommentsEnabled>
<BlogItemCommentsEnabled><a href="<$BlogItemCommentCreate$>"
<$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$>
Comments ♥ </a><a href="<$BlogItemCommentCreate$>" <$BlogItemCommentFormOnClick$>></a>
</BlogItemCommentsEnabled>
</BlogItemCommentsEnabled>
</MainPage>
<br>
<div style="text-align:right;" ">
<!-- Begin #comments -->
<ItemPage>
<div id="comments">
<BlogItemCommentsEnabled><a name="comments"></a>
<h4><$I18NNumComments$>:</h4>
<dl id="comments-block">
<$CommentPager$>
<BlogItemComments>
<dt class="comment-poster" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a>
<$I18NCommentAuthorSaid$>
</dt>
<dd class="comment-body">
<p><$BlogCommentBody$></p>
</dd>
<dd class="comment-timestamp"><a href="<$BlogCommentPermalinkURL$>" title="comment permalink"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</dd>
</BlogItemComments>
<$CommentPager$>
</dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
</p>
<p class="comment-timestamp">
</p>
</div>
</ItemPage>
<!-- End #comments --> 
</blogger>
<center><BlogItemCommentsEnabled><a class="comments" href="https://www.blogger.com/comment.g?blogID=LETAK BLOG ID KORANG&postID=<$BlogItemNumber$>&isPopup=true" onclick="window.open('https://www.blogger.com/comment.g?blogID=LETAK BLOG ID KORANG&postID=<$BlogItemNumber$>&isPopup=true', 'bloggerPopup', 'toolbar=0,scrollbars=1,location=0,statusbar=1,menubar=0,resizable=1,width=400,height=450');return false;"></a></BlogItemCommentsEnabled><br><center>
<center><OlderPosts><a href=<$OlderPosts$>>Older Post</a> </OlderPosts> <NewerPosts> | <a href=<$NewerPosts$>>Newer Post</a></NewerPosts></center></div>
</div>
</td>
<td valign="top" width="250px">
<div class="sidebar">
<div class="h1">About My Blog?</div>
<center><a href="http://4.bp.blogspot.com/-TnRuzhS5Bno/UA0_x2sn-UI/AAAAAAAAACU/udHR5jrLd1Y/s1600/cute+cat.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/-TnRuzhS5Bno/UA0_x2sn-UI/AAAAAAAAACU/udHR5jrLd1Y/s1600/cute+cat.png" /></a></center>
<center><img src=""/></center>
<center><img src=""/>♥ LETAK JE APE-APE DI SINI</center>
</div>
<br>
<div class="sidebar">
<div class="h1">Chatting With Me?</div>
<center><img src=""/></center>
<center><img src="http://3.bp.blogspot.com/-E20XUJwLTts/UA09OZ0pIeI/AAAAAAAAACE/RNaT_ZBEwKE/s1600/prm.png"/></center>
<center>LETAK CODE CBOX KORANG</div><center>
<br>
<div class="sidebar">
<div class="h1">Credit?</div>
<center><img src=""/></center>
<center><img src="http://2.bp.blogspot.com/-9LXKUvYSS90/UA09I8lkuZI/AAAAAAAAAB8/9L0TvslTpnE/s1600/tq.png"/></center>
<center><img src=""/></center>
<center><img src=""/> Template : <span style="font-weight:bold;"><a href="http://iza-zaty.blogspot.com">Iza Zaty</a></span></center>
<center><img src=""/></center>
<center><img src=""/> Edited Blog : <span style="font-weight:bold;">Me</span></center>
<center><img src=""/></center>
<center><img src=""/> Best View : <span style="font-weight:bold;">Google </span></center>
<!-- JANGAN SESEKALI BUANG BAHAGIAN CREDIT DI SINI . AMARAN KERAS!!!-->
<br>
</td>
</table>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'></script><script type='text/javascript' src='https://sites.google.com/site/jquery01/jquery.lazyload.mini.js?ver=1.5.0'></script><script type="text/javascript">jQuery(document).ready(function($){if (navigator.platform == "iPad") return;jQuery("img").lazyload({effect:"fadeIn",placeholder: "http://3.bp.blogspot.com/_LZtXSNcp76A/THkEtEOZfrI/AAAAAAAABRo/IARVMD_8TwA/s1600/grey.gif"});});</script>
</body></head>
<div style=' position:absolute; top:450px; left:20px; width:5px;'><center style='text-align: center;'><b</b></center><div style='Background-image:url(URL BACKGROUND); repeat; padding: 0px; border:1px solid #000000; filter:alpha(opacity=1.5); border-radius:5px;'><center>
</style>
<style text="css">
a.button{
background:#000000;
color:#ffffff;
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
text-decoration:none;
font-family:calibri; 
font-size:14;
padding:5px;
border-radius:5px;
width:70px;
text-align:center;
display:inline-block;
}
a.button:hover{
background:#FFFFFF;
-webkit-transition: 0.4s;
-moz-transition: 0.4s;
color:#000000;
text-decoration:none;
font-family:calibri; 
font-size:14;
padding:5px;
border-radius:5px;
width:70px;
text-align:center;
display:inline-block;
}
</style>
<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="100" height="20">
    <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" />
    <param name="bgcolor" value="#000000" />
    <param name="FlashVars" value="mp3=http%3A//media.irondj.net/mix/file/12903/Selena_Gomez___The_Scene_-_Hit_The_Lights.mp3&amp;autoplay=1&amp;loadingcolor=ffffff&amp;slidercolor=ffffff" />
</object>
<div style="position:fixed; top :5px; right:5px;">
<a class="button" href="http://www.blogger.com/follow-blog.g?blogID=LETAK BLOG ID KORANG">Follow Me?</a><a class="button" href="http://www.blogger.com/home">Dashboard? </a> </div>
<center><b></b></center>
<center><form action="http://www.myspacegens.com/handler.php?gen=redirect" method="post"><select name="url" style="width: 120px; height: 20px; font-size: 11px; background-color: #000000; color: #FFFFFF; border-radius:4px; font-family: Verdana;"><option value="LINK BLOG" />HOME<option value="LINK PAGE 1" />THE OWNER<option value="LINK PAGE 2" />STUFF<input type="submit" style="border-width: 1px; border-color: #000000; border-style: solid; border-radius:3px; font-family: Century Gothic; color: #FFFFFF; background-color: #000000;" value="Go!" /></select></form></center><br /></center></div><div style=' position:absolute; top:50px; left:50px;'/>
</div>


</html>

JANGAN BUANG CREDIT DAN YANG DAH
PAKAI MOHON KOMEN  .. hehe



BLOG ID , LINK PAGE & CODE CBOX
korang tukar je la k :)



CARA TUKAR KE BLOGSKIN :

1. Dashboard > Design > Tekan EDIT HTML 




2. SCROLL SAMPAI BAWAH , DAN TEKAN
REVERT TO CLASSIC TEMPLATE :





3. PADAM SEMUA CODE YG ADA DALAM KOTAK TU :




4. Gantikan bahagian kosong tu kepada 
CODE BLOGSKIN yang zaty bagi ;)

# Okeyh , bye semua :) A'salam .


Thank You sebab baca entry ni . Jangan lupa like dan komen .

Tutorial - Pasang Scroll Bar (Jenis 2)


CONTOH SCROLLBAR :


*sebelum cursor sentuh*

*Selepas Cursor Sentuh*



1. Dashboard > Design > Edit HTML 
* Tick 

Thank You sebab baca entry ni . Jangan lupa like dan komen .