Cara Membuat Download Box Seperti Anime Responsive
Cara Mudah Membuat Download Box Seperti Animefans Responsive - Jumpa lagi dengan dengan saya di blog ini, Kali ini saya kita membahas artikel mengenai Download Box seperti Animefans.Kalian pasti pernah kan download Film,Anime atau lainnya dan kamu pasti menemukan tombol download untuk mendownload file tersebut.Aplagi downlaod diweb anime pasti terdapat Download Box yang bagus-bagus.
Dan rata-rata Download Box yang digunakan disetiap website itu berbeda tampilan,tampilannya biasanya menyesuaikan dengan tampilan Websitenya.Dan kalian yang ingin atau sudah membuat blog download pasti kepingin juga memiliki Download Box yang keren kan terutama responsive.
Apalagi kalian yang ingin membuat download box seperti Fansub, Fanshare, atau Animefans yang terkenal.Dibawah ini saya akan berikan contoh gambar download box seperti animefans dan tentunya responsive, kuranag lebih tampilannya akan seperti pada gambar dibawah ini.
Disini saya akan memberikan tutorial bagaimana membaut Download Box, caranya cukup mudah ikuti langkah dibawah ini :
1.Masuk Blogger
2.Masuk ke Menu Tema dan Pilih Edit HTML
3.Lalu Copy kode CSS di bawah ini lalu Paste kode tersebut tepat di bawah kode HTML </b:skin> atau </style>.
/* CSS Download Box Animefans - Atomblogku */
.atomblogku{padding: 10px;background: #ECECEC;font-size: 12px}
.atomblogku span{font-weight: bold;display: block;margin-bottom: 5px;font-size:15px;font-weight:bold}
.atomblogku .boxdownload{overflow: hidden}
.atomblogku .boxdownload .liner{margin-bottom: 2px}
.atomblogku .boxdownload .liner .name{background: #D2D2D2;padding: 5px 10px;margin-bottom: 2px;font-weight: bold;color: #919191}
.atomblogku .boxdownload .liner .listlink{padding: 5px 10px;background: #B3B3B3;font-weight: bold;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
.atomblogku .boxdownload .liner .listlink b{margin-right: 5px;float: left;color: #fff;font-size: 13px;line-height: 19px;padding: 0 7px;background: #3D8ECB}
.atomblogku .boxdownload .liner .listlink a{display: block;float: left;margin-right: 5px;color: #000000}
.atomblogku .boxdownload .liner .listlink a:hover{color:#3D8ECB}
4.Simpan Tamplate, Lalu masuk kemenu Postingan lalu Buat Entri Baru dan copy kode dibawah ini lalu pastekan di Tab HTML (bukan COMPOSE)
<div class="atomblogku">
<span>Download JUDUL ANIME</span>
<div class="boxdownload">
<div class="liner">
<div class="listlink">
<b>720p</b>
<a href=" LINK DOWNLOAD DI SINI " rel="nofollow" target="_blank">GoogleDrive</a>
<a href=" LINK DOWNLOAD DI SINI " rel="nofollow" target="_blank">Zippyshare</a>
<a href=" LINK DOWNLOAD DI SINI " rel="nofollow" target="_blank">Openload</a>
</div>
<div class="liner">
<div class="listlink">
<b>480p</b>
<a href=" LINK DOWNLOAD DI SINI " rel="nofollow" target="_blank">GoogleDrive</a>
<a href=" LINK DOWNLOAD DI SINI " rel="nofollow" target="_blank">Zippyshare</a>
<a href=" LINK DOWNLOAD DI SINI " rel="nofollow" target="_blank">Openload</a>
</div>
</div>
</div>
</div>
5.Seleseai tinggal kalian Pratinjau Dan kalau ingin mengeditnya kalian tinggal ganti kode yang sudah diberi tanda
Cukup mudah bukan membuat Download Box seperti Animefans Responsive di blog.Semoga artiekl diatas dapat bermanfaat untuk kita semua.
0 Response to " Cara Membuat Download Box Seperti Anime Responsive"
Post a Comment