Cara Memasang Tombol Download Responsive Seperti Situs Anime

 

Cara Memasang Tombol Download Responsive Mirip Situs Anime

Pertama, buka Blogger >> Tema >> Edit HTML.

Kemudian, letakkan kode CSS berikut sebelum kode </head>

/* Tombol Download Anime Responsive */
.anime-box{font-size:9px;font-weight:bold;background:none repeat scroll 0% 0% #F5F5F5;padding:10px;margin:10px 0}
.anime-box ul{margin:0;padding:0;list-style:outside none none}
.anime-box ul li{background:none repeat scroll 0% 0% #E4E4E4;margin-bottom:2px;line-height:26px;padding:0 5px;font-size:15px}
.anime-box ul li strong{background:#1b80e3;border-right:2px solid #F5F5F5;width:100px;display:block;float:left;margin-left:-5px;margin-right:2px;color:#FFF;padding:0 5px;text-align:left}

Lalu Simpan Tema.

Langkah selanjutnya yaitu menerapkannya dalam postingan anda.

Cara Penerapan Tombol Download di Postingan Blog 

Pertama, buat Postingan Baru >> kemudian letakkan kode ini pada menu tab HTML (bukan Compose).

<div class="anime-box">
   <ul>
      <li style="text-align: center;">
         <strong>360p</strong>
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">UF</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">CU</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">GD</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">ZS</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">ZS2</a>
      </li>
      <li style="text-align: center;">
         <strong>480p</strong>
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">UF</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">CU</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">GD</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">ZS</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">ZS2</a>
      </li>
      <li style="text-align: center;">
         <strong>720p</strong>
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">UF</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">CU</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">GD</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">ZS</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">ZS2</a>
      </li>
      <li style="text-align: center;">
         <strong>1080p</strong>
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">UF</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">CU</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">GD</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">ZS</a> |
         <a href="LINK-DOWNLOAD" target="_blank" rel="nofollow noopener">ZS2</a>
      </li>
   </ul>
</div>

Kemudian jika telah selesai semua, tinggal Publikasikan.

Demikian Cara Memasang Tombol Download Responsive Seperti Situs Anime. Semoga tutorial ini bisa bermanfaat dan membantu anda.