Cara membuat Download BOX diblogger Anda
Selamat malam semua dan apa kabar, semoga kalian yang membaca artikel ini baik-baik saja yah!!! Pada aktikel kali ini saya akan memposting " CARA MEMBUAT DOWNLOAD BOX diblog sobat"
Berikut ini picturenya dari blog saya:
Langsung saja kita mulai .
1. Log in ke Blogger.com
2. Tamplate dan klik edit HTML
3. biar lebih mudah mencari css klik dalam kotak html dan tekan CTRL+F
4. masukkan HTML diatas </b:skin> atau </style>
Berikut CSS nya
===========================================
/* Download Box by Designz Chan */
.dchan-box{margin:10px 0;}
.item-dc{
float: left;
text-align: center;
background: #39d;
padding: 3px 5px;
width: 75px;
text-align: center;
border-bottom: 2px solid #fff;
font-weight: 700;
font-size: 12px;
color: #fff;
}
h3.dc-title{
background: #39d;
margin: 0 0 3px;
padding: 6px;
color: #fafafa;
font-size: 0.95em;
}
.dc-item{clear:both;margin-bottom:4px;height:27px;}
.dc-anime{overflow:hidden;line-height:29px;background:#f2f3f4;padding:0 8px;margin:-24px 0px;}
.dc-anime a{font-weight:700;border-right:1px solid #ddd;margin-right:5px;padding-right:10px;color:#000;}
.dc-anime a:hover{color:#39d3ff;text-decoration:underline;transition:all .50s ease-in-out;}
.dc-anime a:last-child{border:0;}
@media only screen and ( max-width: 580px ) {
.dc-anime {
text-align: center;
float: left;
}
.item-dc {
width: 100%;
}
.dc-anime a {
line-height: 25px;
}
.dc-anime {
margin: auto !important;
}
}
5. klik save tamplate
6. jika sudah disimpan sekarang simpan kode dibawah ini.
==========================================================
<div class="dchan-box">
<h3 class="dc-title">ENDING ANIME</h3>
<br />
<!-- Download Box 720p -->
<div class="dc-item">
<span class="item-dc">DOWNLOAD</span>
<div class="dc-anime">
<a href="#" target="_blank">Ending One punch man [klik here]</a>
</div>
</div></div>
<!-- Download Box 480p -->
<div class="dc-item">
<span class="item-dc">480p</span>
<div class="dc-anime">
<a href="#" target="_blank">Tusfiles</a>
<a href="#" target="_blank">Google Drive</a>
<a href="#" target="_blank">DesignzChan Files</a>
<a href="#" target="_blank">Mirrorcreator</a>
</div>
</div></div>
==============================================================
7. laliu letakkan di POST ada page/laman kalian....
finish mudah bukan caranya....jika kalian masih kurang mengerti silahkan tinggalkan komentar dibawah...
terimah kasih anda telah berkunjung ke blog saya semoga artikel kali ini membantu
