Penting!! Sobat Blogger yang ingin re-post atau menulis kembali artikel kami diblog/website Anda, harap lihat halaman DISCLAIMER ( beberapa blog telah diproses di Google Removal Content ) Setiap tindakan pelanggaran hak cipta (COPAS) akan dilaporkan, TANPA pemberitahuan.


Anda masih ingat artikel proBlogiz tentang cara membuat buttton/tombol keren dengan CSS, nah kali ini Desain Blog kembali akan membagi koleksi tombol/button keren khusus untuk digunakan sebagai Demo Button dan Download Button. 7 koleksi tombol/button, Demo Button dan Download Button Keren dengan CSS  ini dibuat tanpa menggunakan image/gambar dan juga tanpa Javascript apapun. So this is cool button!!

Bagi Anda yang mempunyai blog dengan tema desain, blog design, CSS turorial, Free Template Blog atau tema blog yang banyak menyediakan file-file gratis untuk di-download tentu Demo Button dan Download Button yang cantik, keren, dan profesional looking adalah bagian penting dari blog Anda.  Demo Button dan Download Button ini digunakan untuk menyediakan link-link yang mengarahkan ke tujuan baik itu url/link sebagai Demo Live (preview) atau link yang mengarahkan ke alamat/url sumber file-file yang akan  di-download/diunduh.

Jadi langsung saja lihat Demo Live-nya masing-masing button/tombol dibawah ini, dengan tool desain preview kami :


Cara menggunakan tool desain preview :
Klik tombol Clear pada area kode dan CSS, kemudian copy salah satu kode button dibawah dan paste-kan di area kode tersebut. Selanjutnya klik Preview untuk melihat hasil atau tampilan button.
*Gunakan browser webkit support seperti Chrome , Firefox

7 Koleksi Demo Button dan Download Button Keren

 Demo Button dan Download Button 01

Demo Button dan Download Button 01
Code CSS + HTML:
<style> .button { position: relative; color: rgba(255,255,255,1); text-decoration: none; background-color: rgba(219,87,5,1); font-family: 'Yanone Kaffeesatz'; font-weight: 700; font-size: 2em; display: block; padding: 4px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; -webkit-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7); -moz-box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7); box-shadow: 0px 9px 0px rgba(219,31,5,1), 0px 9px 25px rgba(0,0,0,.7); margin: 20px auto; width: 160px; text-align: center; -webkit-transition: all .1s ease; -moz-transition: all .1s ease; -ms-transition: all .1s ease; -o-transition: all .1s ease; transition: all .1s ease; } .button:active { -webkit-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9); -moz-box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9); box-shadow: 0px 3px 0px rgba(219,31,5,1), 0px 3px 6px rgba(0,0,0,.9); position: relative; top: 6px; } </style> <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:700' rel='stylesheet' type='text/css'> <a class="button" href="#">View Demo </a> <a class="button" href="#">Download</a>

 Demo Button dan Download Button 02

Demo Button dan Download Button 02
Code CSS + HTML:
<style> /* Button */ .button { background-color: #222; background-image: -webkit-linear-gradient(hsla(0,0%,100%,.15), hsla(0,0%,0%,0)); background-image: -moz-linear-gradient(hsla(0,0%,100%,.15), hsla(0,0%,0%,0)); background-image: -ms-linear-gradient(hsla(0,0%,100%,.15), hsla(0,0%,0%,0)); background-image: -o-linear-gradient(hsla(0,0%,100%,.15), hsla(0,0%,0%,0)); background-image: linear-gradient(hsla(0,0%,100%,.15), hsla(0,0%,0%,0)); border: 1px solid #111; color: grey; cursor: pointer; display: inline-block; font: bold 14px/10px sans-serif; margin: 20px; padding: 10px 15px; position: relative; text-decoration: none; text-shadow: 0 -1px 1px hsla(0,0%,0%,.8); vertical-align: top; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: 0 1px 4px hsla(0,0%,0%,.4), inset 0 1px 0 hsla(0,0%,100%,.2); -moz-box-shadow: 0 1px 4px hsla(0,0%,0%,.4), inset 0 1px 0 hsla(0,0%,100%,.2); box-shadow: 0 1px 4px hsla(0,0%,0%,.4), inset 0 1px 0 hsla(0,0%,100%,.2); } .button:hover, .button:focus { background-color: #242424; color: #f6f6f6; -webkit-box-shadow: 0 1px 4px hsla(0,0%,0%,.4), inset 0 1px 0 hsla(0,0%,100%,.2); -moz-box-shadow: 0 1px 4px hsla(0,0%,0%,.4), inset 0 1px 0 hsla(0,0%,100%,.2); box-shadow: 0 1px 4px hsla(0,0%,0%,.4), inset 0 1px 0 hsla(0,0%,100%,.2); } .button:after { background-image: -webkit-linear-gradient(left, hsla(0,0%,0%,0), hsla(0,0%,100%,.8), hsla(0,0%,0%,0)); background-image: -moz-linear-gradient(left, hsla(0,0%,0%,0), hsla(0,0%,100%,.8), hsla(0,0%,0%,0)); background-image: -ms-linear-gradient(left, hsla(0,0%,0%,0), hsla(0,0%,100%,.8), hsla(0,0%,0%,0)); background-image: -o-linear-gradient(left, hsla(0,0%,0%,0), hsla(0,0%,100%,.8), hsla(0,0%,0%,0)); background-image: linear-gradient(left, hsla(0,0%,0%,0), hsla(0,0%,100%,.8), hsla(0,0%,0%,0)); background-position: 50% 0%; background-size: 200% 200%; content: ''; display: none; height: 1px; left: 0; position: absolute; right: 0; top: 0; } .button:hover:after, .button:focus:after { display: block; } .button:before { background: #363636; bottom: -8px; content: ''; left: -8px; position: absolute; right: -8px; top: -8px; z-index: -1; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-box-shadow: 0 1px 1px hsla(0,0%,100%,.3), inset 0 1px 1px hsla(0,0%,0%,.4), inset 0 0 5px hsla(0,0%,0%,.2); -moz-box-shadow: 0 1px 1px hsla(0,0%,100%,.3), inset 0 1px 1px hsla(0,0%,0%,.4), inset 0 0 5px hsla(0,0%,0%,.2); box-shadow: 0 1px 1px hsla(0,0%,100%,.3), inset 0 1px 1px hsla(0,0%,0%,.4), inset 0 0 5px hsla(0,0%,0%,.2); } .button:active { background-color: #202020; color: #b6b6b6; padding: 11px 15px 9px; -webkit-box-shadow: 0 1px 0 hsla(0,0%,100%,.1), inset 0 1px 4px hsla(0,0%,0%,.8); -moz-box-shadow: 0 1px 0 hsla(0,0%,100%,.1), inset 0 1px 4px hsla(0,0%,0%,.8); box-shadow: 0 1px 0 hsla(0,0%,100%,.1), inset 0 1px 4px hsla(0,0%,0%,.8); } .button:active:after { display: block; left: 1px; opacity: .5; right: 1px; top: 31px; } </style> <a class="button" href="#">DOWNLOAD</a> <a class="button" href="#">DEMO LIVE</a>

 Demo Button dan Download Button 03

Demo Button dan Download Button 03

Code CSS + HTML:

<style>
.button:link {
  margin: 30px 30px 0 30px;
  display: inline-block;
  padding: 15px 50px;
  -moz-border-radius: 4px / 3px;
  -webkit-border-radius: 4px / 3px;
  border-radius: 4px / 3px; /* border radius */
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box; /* prevents bg color from leaking outside the border */
  background-color: rgba(64,187,217,.12); /* layer fill content */
  box-shadow: inset 0 1px 0 rgba(55,255,255,.21), inset 0 1px 35px rgba(64,187,217,.34), 0 2px 3px rgba(0,0,0,.45); /* drop shadow, outer glow and inner shadow */
}

.button:hover {
  margin: 30px 30px 0 30px;
  display: inline-block;
  padding: 15px 50px;
  -moz-border-radius: 4px / 3px;
  -webkit-border-radius: 4px / 3px;
  border-radius: 4px / 3px; /* border radius */
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box; /* prevents bg color from leaking outside the border */
  background-color: rgba(164,187,217,.15); /* layer fill content */
  box-shadow: inset 0 1px 0 rgba(255,255,255,.21), inset 0 1px 35px rgba(164,187,217,.34), 0 2px 3px rgba(0,0,0,.45); /* drop shadow, outer glow and inner shadow */
}

.button:active {
  margin: 30px 30px 0 30px;
  display: inline-block;
  padding: 15px 50px;
  -moz-border-radius: 4px / 3px;
 -webkit-border-radius: 4px / 3px;
 border-radius: 4px / 3px; /* border radius */
 -moz-background-clip: padding;
 -webkit-background-clip: padding-box;
 background-clip: padding-box; /* prevents bg color from leaking outside the border */
 background-color: rgba(164,187,17,.12); /* layer fill content */
 box-shadow: 0 1px 0 rgba(155,255,255,.21), 0 1px 15px rgba(64,187,217,.34), inset 0 2px 3px rgba(0,0,0,.45); /* drop shadow, outer glow and inner shadow */
}

.button:link,.button:visited,.button:hover, a:active {
  color: #3A34A3;
  font-family:georgia;
  font-weight: 700;
  text-transform: uppercase;
  font-size:.75em;
  text-decoration: none;
  text-shadow: 0 1px #292929; 
}

</style>
<a class="button" href="#">DOWNLOAD</a>
<a class="button" href="#">DEMO LIVE</a> 


 Demo Button dan Download Button 04

Demo Button dan Download Button 04
Code CSS + HTML:
<style> .push_button { position: relative; width:220px; height:40px; text-align:center; color:#FFF; text-decoration:none; line-height:43px; font-family:'Oswald', Helvetica; display: block; margin: 30px; } .push_button:before { background:#f0f0f0; background-image:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#D0D0D0), to(#f0f0f0)); -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; -webkit-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; -moz-box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; box-shadow:0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 #FFF; position: absolute; content: ""; left: -6px; right: -6px; top: -6px; bottom: -10px; z-index: -1; } .push_button:active { -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset; top:5px; } .push_button:active:before{ top: -11px; bottom: -5px; content: ""; } .red { text-shadow:-1px -1px 0 #A84155; background: #D25068; border:1px solid #D25068; background-image:-webkit-linear-gradient(top, #F66C7B, #D25068); background-image:-moz-linear-gradient(top, #F66C7B, #D25068); background-image:-ms-linear-gradient(top, #F66C7B, #D25068); background-image:-o-linear-gradient(top, #F66C7B, #D25068); background-image:linear-gradient(to bottom, #F66C7B, #D25068); -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5); -moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5); box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #AD4257, 0 4px 2px rgba(0, 0, 0, .5); } .red:hover { background: #F66C7B; background-image:-webkit-linear-gradient(top, #D25068, #F66C7B); background-image:-moz-linear-gradient(top, #D25068, #F66C7B); background-image:-ms-linear-gradient(top, #D25068, #F66C7B); background-image:-o-linear-gradient(top, #D25068, #F66C7B); background-image:linear-gradient(top, #D25068, #F66C7B); } .blue { text-shadow:-1px -1px 0 #2C7982; background: #3EACBA; border:1px solid #379AA4; background-image:-webkit-linear-gradient(top, #48C6D4, #3EACBA); background-image:-moz-linear-gradient(top, #48C6D4, #3EACBA); background-image:-ms-linear-gradient(top, #48C6D4, #3EACBA); background-image:-o-linear-gradient(top, #48C6D4, #3EACBA); background-image:linear-gradient(top, #48C6D4, #3EACBA); -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5); -moz-box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5); box-shadow:0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(255, 255, 255, .1) inset, 0 4px 0 #338A94, 0 4px 2px rgba(0, 0, 0, .5); } .blue:hover { background: #48C6D4; background-image:-webkit-linear-gradient(top, #3EACBA, #48C6D4); background-image:-moz-linear-gradient(top, #3EACBA, #48C6D4); background-image:-ms-linear-gradient(top, #3EACBA, #48C6D4); background-image:-o-linear-gradient(top, #3EACBA, #48C6D4); background-image:linear-gradient(top, #3EACBA, #48C6D4); } </style> <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'> <a href="#" class="push_button red">View Demo</a> <a href="#" class="push_button blue">Download</a>

 Demo Button dan Download Button 05

Demo Button dan Download Button 05
Code CSS + HTML:
<style> .button { width: 200px; margin: 50px auto; } .button a { display: block; height: 50px; width: 200px; /*TYPE*/ color: white; font: 17px/50px Helvetica, Verdana, sans-serif; text-decoration: none; text-align: center; text-transform: uppercase; /*GRADIENT*/ background: #00b7ea; /* Old browsers */ background: -moz-linear-gradient(top, #00b7ea 0%, #009ec3 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00b7ea), color-stop(100%,#009ec3)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #00b7ea 0%,#009ec3 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #00b7ea 0%,#009ec3 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #00b7ea 0%,#009ec3 100%); /* IE10+ */ background: linear-gradient(top, #00b7ea 0%,#009ec3 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=0 ); /* IE6-9 */ } .button a, p { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-shadow: 2px 2px 8px rgba(0,0,0,0.2); -moz-box-shadow: 2px 2px 8px rgba(0,0,0,0.2); box-shadow: 2px 2px 8px rgba(0,0,0,0.2); } p { background: #222; display: block; height: 40px; width: 180px; margin: -50px 0 0 10px; /*TYPE*/ text-align: center; font: 12px/45px Helvetica, Verdana, sans-serif; color: #fff; /*POSITION*/ position: absolute; z-index: -1; /*TRANSITION*/ -webkit-transition: margin 0.5s ease; -moz-transition: margin 0.5s ease; -o-transition: margin 0.5s ease; -ms-transition: margin 0.5s ease; transition: margin 0.5s ease; } /* HOVER ================================================== */ .button:hover .bottom { margin: -10px 0 0 10px } .button:hover .top { margin: -80px 0 0 10px; line-height: 35px; } /* ACTIVE ================================================== */ .button a:active { background: #00b7ea; /* Old browsers */ background: -moz-linear-gradient(top, #00b7ea 36%, #009ec3 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(36%,#00b7ea), color-stop(100%,#009ec3)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #00b7ea 36%,#009ec3 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #00b7ea 36%,#009ec3 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #00b7ea 36%,#009ec3 100%); /* IE10+ */ background: linear-gradient(top, #00b7ea 36%,#009ec3 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00b7ea', endColorstr='#009ec3',GradientType=0 ); /* IE6-9 */ } .button:active .bottom { margin: -20px 0 0 10px } .button:active .top { margin: -70px 0 0 10px } </style> <div class="button"> <a href="#">View Demo</a> </div> <div class="button"> <a href="#">Download</a> <p class="top">click to download</p> <p class="bottom">file 2.3MB .zip</p> </div>

 Demo Button dan Download Button 06

Demo Button dan Download Button 06
Code CSS + HTML:
<style> .button { -moz-border-radius:5px 5px 5px 5px; -webkit-border-radius:5px 5px 5px 5px; border-radius:5px 5px 5px 5px; -moz-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25); -webkit-box-shadow:0 1px 3px rgba(0, 0, 0, 0.25); box-shadow:0 1px 3px rgba(0, 0, 0, 0.25); background:scroll 0 0 #222222; border-bottom:1px solid rgba(0, 0, 0, 0.25); color:#FFFFFF !important; cursor:pointer; font-weight:bold; line-height:1; overflow:visible; font-size:17px; padding:8px 19px 9px; position:relative; text-decoration:none; text-shadow:0 -1px 1px rgba(0, 0, 0, 0.25); width:auto; margin: 10px; } .demobutton { background-color:#999999; text-align:center; width:100px; } .demobutton:hover { background-color:#EB7D05; } .downloadbutton { background-color:#999999; text-align:center; width:100px; } .downloadbutton:hover { background-color:#00AC00; } .button:hover { -moz-box-shadow:0 1px 11px rgba(0, 0, 0, 0.45); -webkit-box-shadow:0 1px 11px rgba(0, 0, 0, 0.45); box-shadow:0 1px 11px rgba(0, 0, 0, 0.45); } </style> <a class="button downloadbutton" href="#" rel="nofollow" style="float: left;" target="_blank"><span style="display: inline-block;">Download</span></a> <a class="demobutton button" href="#" rel="nofollow" style="float: left;" target="_blank"><span style="display: inline-block;">Live Demo</span></a>

 Demo Button dan Download Button 07

Demo Button dan Download Button 07
Code CSS + HTML:
<style> .button1 { display: block; font: bold 16px Arial; letter-spacing:; text-decoration: none; margin: 20px auto; padding: 20px 30px 20px 25px; width: 170px; border-top-left-radius: 10px 50px; border-bottom-left-radius: 10px 50px; border-top-right-radius: 10px 50px; border-bottom-right-radius: 10px 50px; -moz-border-radius-topleft: 10px 50px; -moz-border-radius-topright: 10px 50px; -moz-border-radius-bottomright: 10px 50px; -moz-border-radius-bottomleft: 10px 50px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;} .button1:hover { -moz-border-radius-topleft: 30px 50px; -moz-border-radius-topright: 30px 50px; -moz-border-radius-bottomright: 30px 50px; -moz-border-radius-bottomleft: 30px 50px; border-top-left-radius: 30px 50px; border-bottom-left-radius: 30px 50px; border-top-right-radius: 30px 50px; border-bottom-right-radius: 30px 50px;} .button1 span { display: block; margin: 2px 0 0; font: oblique bold 11px verdana;} .button2 { text-decoration: none; font: bold 13px Arial; display: block; margin: 20px auto; padding: 6px 14px; -moz-border-radius: 15px; border-radius: 15px; width: 100px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -ms-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease;} .button2:hover { -moz-border-radius: 5px; border-radius: 5px;} .blue { color: #fff; background: #48C9FF; background: -webkit-linear-gradient(top, #48C9FF 0%, #2EA8E5 100%); background: -moz-linear-gradient(top, #48C9FF 0%, #2EA8E5 100%); background: -ms-linear-gradient(top, #48C9FF 0%, #2EA8E5 100%); background: -o-linear-gradient(top, #48C9FF 0%, #2EA8E5 100%); background: linear-gradient(to bottom, #48C9FF 0%, #2EA8E5 100%); text-shadow: #29a3cc 0 1px 3px; -webkit-box-shadow: inset 0 1px 0 #38bdf4, inset 0 2px 0 #7bdeff, 0 1px 3px #777, 0 0px 1px #ccc; -moz-box-shadow: inset 0 1px 0 #38bdf4, inset 0 2px 0 #7bdeff, 0 1px 3px #777, 0 0px 1px #ccc; box-shadow: inset 0 1px 0 #38bdf4, inset 0 2px 0 #7bdeff, 0 1px 3px #777, 0 0px 1px #ccc;} .blue span { color: #217aa6; text-shadow: #78d2f0 0 1px 0;}? </style> <a href="#" class="button1 blue"> Download file here <span>size 1.3 mb zip file</span> </a> <a href="#" class="button2 blue"> View Demo >> </a>
Pilih salah satu yang Anda suka Sob dan pasang di Blog Anda, untuk pemasangan button di blog bisa dilihat DISINI.

Pada dasarnya kode button diatas semua sudah disertakan dengan kode HTML-nya untuk menerapkan style button CSS-nya, jadi kalo Anda ingin meletakkan kode button di template, letakkan kode CSS saja (tanpa diikutkan tag <style> dan kode HTML) tepat diatas tag ]]></b:skin>

Untuk memakainya button tersebut di postingan Anda, gunakan kode HTML saja dimanapun Anda mau (post editor dalam mode HTML)

contoh kode HTML button :
<a class="button" href="#">DOWNLOAD</a>

<a class="button" href="#">DEMO LIVE</a>

Anda juga bisa mengatur atau edit baik warna button, warna hover button, warna button active atau font button, besar tombol, dll, di Desain Preview Tool pada saat Anda melihat DEMO LIVE.

Enjoy it and keep blogger spirit with proBlogiz Blogger Design


Artikel Terkait Lainnya:
Click here for comments

10 komentar

Yang nomer 1 efek pressed-nya keren bro! :)

REPLY

keren dan cantik, 2 jempol buat kang hriza muh. :)

REPLY

sama kang
thanks udah mampir ya

REPLY

kang punten mau nyobain ya. keren dan menarik amat buat belajar. Makasih sebelumnya kang.

REPLY

waaaaaaaaaaaaah.....!! ni blog bikin betah aja bang.... yg aku butuh banyak disini... izin nimbrung ya...?!! emmm... blajar n pake-pake gtu bang hehe..

REPLY

MAS, kenapa ya punyaku kok gak bisa di pasang button yg no 5?

REPLY

kalau mau di tempatkan di tengah gmn..

REPLY

Silahkan Berkomentar
Komentar/pertanyaan Sesuai Topik, Please NO SPAM, NO Promotion Links
Convert Kode HTML sebelum disisipkan

Convert

Google+ Followers

Submit email Anda, dapatkan update artikel:


Like Me

Artikel Terbaru

|Copyright © 2013| Problogiz |All Rights Reserved|