Cara Membuat Tombol Demo dan Download di Blog v2 - Sebelumnya sudah posting Cara Membuat Tombol Demo dan Download di Blog, skrg postingan ane mungkin sama kaya yg kemaren, yaitu Cara Membuat Tombol Demo dan Download di Blog v2
, dan mungkin sedikit berbeda dgn yg sebelumnya, yaitu CSS dan HTMLnya. Tujuannya hanya untuk mempercantik / memberi hiasa pada tombol Demo dan Download agar lebih cantik dan menarik. seperti apa screenshotnya ? ini dia :
Versi 1 :
Versi 2 :
menurut kalian bagusan mana ? kalo kata ane sih 2-2 nya bagus
Baca juga artikel :
Cara Membuat Tombol Demo dan Download di Blog
Cara Membuat Tombol Demo dan Download di Blog v2 :
1. Buka Blogger
2. Klik Template -> Edit HTML
3. Copy kode dibawah ini dan paste diatas kode
]]></b:skin>
/* Buttons Download
---------------------------------------------*/
ul.postbuttons{
list-style-image:none;
list-style-position:outside;
list-style-type:none;
padding-left:0px;
padding-top:20px;
padding-bottom:20px}
ul.postbuttons li{
background:none 0 0 repeat scroll transparent;
float:left;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0 5px 0 0;
padding:0}
a.livedemo{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis9tGpRIBlMvsTsMkyT781DS-7kNruNpgrTBFPFYZjHlPTqRWw-1axZWJ0LZdtzTJeimD1uANQuEJZ1y4vB-vZB7fIL-HYGxQmLUvfHJLSwA4vEyNmM_LNfKRo8Oz7EhTfbmXlXTUjK1g/s1600/demodownload.gif) left bottom no-repeat scroll transparent;
display:block;
height:25px;
text-indent:-9999px;
width:250px}
a.download{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEis9tGpRIBlMvsTsMkyT781DS-7kNruNpgrTBFPFYZjHlPTqRWw-1axZWJ0LZdtzTJeimD1uANQuEJZ1y4vB-vZB7fIL-HYGxQmLUvfHJLSwA4vEyNmM_LNfKRo8Oz7EhTfbmXlXTUjK1g/s1600/demodownload.gif) right bottom no-repeat scroll transparent;
display:block;
height:25px;
text-indent:-9999px;
width:250px}
4. Sekarang kita akan menerapkannya/ memanggil button tdi di dlm postingan dengan cara
-Buat postingan baru
-Ketik" aja dlu artikelnya :v
-Masukkan script berikut di bagian HTML bukan COMPOSE
<ul class="postbuttons">
<li><a class="livedemo" href="masukkan link demo" rel="nofollow" target="_blank">Demo</a> </li>
<li><a class="download" href="masukkan link download" rel="nofollow" target="_blank">Download</a> </li>
</ul>
yg berwarna
merah link demo
yg berwarna
hijau link download