Css Button for blogger

LINK TEXT HERE
LINK TEXT HERE
LINK TEXT HERE
LINK TEXT HERE
LINK TEXT HERE
LINK TEXT HERE
Bagaimana membuat button seperti diatas?

Buat button dengan effect css di blog untuk lebih menarik, ikut tutorial mudah dibawah:
1.Pergi ke Template - Edit Html dan Klick proceed
2. Kemudia cari perkataan ]]></b:skin> dan letak code css dibawah diatas perkataan ]]></b:skin> tadi:

Code css:

.button, .button:visited {
background: #222 url(http://helperblogger.googlecode.com/svn/overlay.png) repeat-x;
display: inline-block;
padding: 5px 10px 6px;
color: #fff;
text-decoration: none;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
border-bottom: 1px solid rgba(0,0,0,0.25);
position: relative;
cursor: pointer;
font-family: calibri;
}

.button:hover {
background-color: #111;
color: #fff;
}

.button:active {
top: 1px;
}

.small.button, .small.button:visited {
font-size: 11px
}

.button, .button:visited,
.medium.button, .medium.button:visited {
font-size: 13px;
font-weight: bold;
line-height: 1;
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
}

.medium.button, .medium.button:visited {
font-size: 14px;
padding: 8px 14px 9px;
}

.large.button, .large.button:visited {
font-size: 34px;
padding: 8px 14px 9px;
}

.pink.button, .magenta.button:visited {
background-color: #e22092;
}

.pink.button:hover {
background-color: #c81e82;
}

.green.button, .green.button:visited {
background-color: #91bd09;
}

.green.button:hover {
background-color: #749a02;
}

.red.button, .red.button:visited {
background-color: #e62727;
}

.red.button:hover {
background-color: #cf2525;
}

.orange.button, .orange.button:visited {
background-color: #ff5c00;
}

.orange.button:hover {
background-color: #d45500;
}

.blue.button, .blue.button:visited {
background-color: #2981e4;
}

.blue.button:hover {
background-color: #2575cf;
}

.yellow.button, .yellow.button:visited {
background-color: #ffb515;
}

.yellow.button:hover {
background-color: #fc9200;
}

Kemudaian Save template anda.
Untuk meletakan button css di posting atau side bar sila sesuaikan link dan text anda

Untuk button bersaiz besar

<center><a href="LINK HERE" class="large button pink" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="large button blue" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="large button green" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="large button orange" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="large button red" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="large button yellow" >LINK TEXT HERE</a></center>

Untuk Button bersaiz kecil:

<center><a href="LINK HERE" class="medium button pink" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="medium button blue" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="medium button green" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="medium button orange" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="medium button red" >LINK TEXT HERE</a></center>

<center><a href="LINK HERE" class="medium button yellow" >LINK TEXT HERE</a></center>

View Docs For Css Button

Tingalkan komen jika terdapat sebarang error'