Tutorial: Disclaimer Widget
Image By: Alneira
Wahh senengnyaa aku bisa buat widget ini. Pertamanya stress, bingung. Tapi akhinya berhasil jugaa (plok plok plok).
Yuk kita lihat caranya.
1. Blogger >> tata letak >> tambahkan gadget >> html / javascript
2. Masukin kode dibawah ini dibagian kotaknya
<style>
.missnei a:link, .missnei a:active, .missnei a:visited
{
width:85px; background: #aaa;
color:#333;
display: inline-block;
text-decoration:none;
text-align:center;
font:11px short stack;
font-weight:normal;
padding:3px;
margin-top:2px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
border: 2px dashed #fff;
box-shadow: 0px 0px 0px 3px #aaa;
margin-left: 15px;
-moz-border-radius: 35px;
border-radius: 35px;
padding: 5px;
}
.missnei a:hover{
color: white;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
</style>
<center><div style="background:url(URL BACKGROUND
);
) repeat; border:2px dashed #fff; box-shadow: 0px 0px 0px 4px
#000;-moz-border-radius: 15px;
border-radius: 15px;padding:4px; color: #aaa;width:auto;">
<img style="width:200px;height:200px;background: #adadad;border:
1px dashed #fff; margin-top: 5px;border-radius: 100px; box-shadow: 0px 0px 0px
4px #adadad; padding: 5px;" src="YOUR PICT" /><br
/><br />
<div style="border-top: 1px dashed; padding:
5px;"><center>
TULIS KATA-KATAMU
<br /><br /><div
class="missnei"> <a
href="http://www.blogger.com/follow-blog.g?blogID=TULIS ID BLOGMU">Follow</a> <a
href="http://blogger.com/home">Dash</a></div></center></div></div></center><br
/><br />
3. Save!
Cek dulu, ya. Kalau berhasil, congrats!
0 Comments