Cara Membuat Button Download Keren Pada Blogger

Membuat dan memasang button pada blog itu menurut saya hal yang wajib, karena memang dengan memasang button yang bagus, akan membuat blog kita akan menjadi lebih keren.

Karena button juga tidak akan mempengaruhi kinerja blog, jadi menurut saya sah-sah saja untuk memasang button ini pada blog kalian.

Button yang saya bagikan ini tentunya lebih keren, karena menggunakan warna gradient, dan bentuk buttonnya pun tampil lebih minimalis.

Untuk cara pemasangannya kalian bisa ikuti langkahnya dibawah ini.

Cara Membuat Button Download Keren

Langkah 1 : 

• Pertama silahkan kalian masuk ke Tema > Edit Html

• Selanjutnya kalian cari kode </head>

• Kemudian kalian salin kode dibawah ini, dan pastekan tepat diatas kode </head> 

#testbutton {
  width: 150px;
  height:50px;
  border-radius:180px;
  position:relative;
  left:calc(50% - 75px);
  top:calc(50% - 25px);
  background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
  cursor:pointer;
  line-height:12px;
}

#testbutton:before {
  content:'';
  z-index:1;
  position:absolute;
  display:block;
  width:80%;
  height:70%;
  top:15%;
  left:10%;
  transition: 0.3s opacity ease-in-out;
  filter:blur(15px);
  opacity:0;
  background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);
}

#testbutton:hover:before {
  opacity:1;
  transition: 0.3s opacity ease-in-out;
  filter:blur(25px);
  background: linear-gradient(60deg, #f79533, #f37055, #ef4e7b, #a166ab, #5073b8, #1098ad, #07b39b, #6fba82);  
}

#testbutton:after {
  content:'CLICK ME!';
  text-align:center;
  line-height:40px;
  font-size:18px;
  color:rgba(235,235,235,1);
  font-family:'Verdana';
  font-weight:bold;
  z-index:5;
  position:absolute;
  display:block;
  border-radius:180px;
  width:92%;
  height:80%;
  top:10%;
  left:4%;  
  background-color:rgb(19, 20, 22);
}

Langkah 2 :

• Langkah berikutnya silahkan kalian gunakan kode dibawah ini untuk membuat buttonnya, kalian bisa meletakannya ditengah postingan, atau terserah mau diletakan dimana saja, sesuai kebutuhan kalian.

<a href="#" target="blank" title=" ">
<div id="testbutton">
</div>
</a>

Langkah 3 : 

• Langkah terakhir kalian ganti kode # di atas dengan link / url kalian.

• Selesai.

:: :: ::

Nah sobat itulah cara membuat button download keren dengan warna gradient, kalian juga bisa merubah warna ataupun bentuk buttonnya, silahkan kalian kreasikan sendiri.

Sampai disini dulu artikel kali ini, semoga bermanfaat, akhir kata saya ucapkan. Terimakasih

Klik Tombol Dibawah Untuk Menuju Link Anda

CONTINUE