Cara Membuat Download Box Part 1 - Tutorial kali ini saya akan membuat Download Box Part 1, download box ini sering kita jumpai diblog atau web-web download anime baik itu fanshare ataupun fansub diindonesia.
Sebelum tutorial ini saya buat saya juga sudah membahas tentang Cara Membuat Recent Post Image With Tooltip By Label, jika tertarik silahkan dibaca. Ok kita mulai saja tutorial kali ini.
Cara Membuat Download Box Part 1
- Silahkan buka Blogger > Tema > Edit HTML, kemudian simpan CSS berikut ini di atas </style>
/* Download Box Part 1 - Arlethdesign */
#main .dl ul{margin:5px 0;list-style:none;background:#FAFAFA;border:1px solid #F0F0F0;padding:3px}
#main .dl ul h3{margin:0;background:#333333;color:#ffffff;font:normal 700 13px sans-serif;padding:8px;margin-bottom:1px;box-shadow:none}
#main .dl ul li{background:#EEEFF0;margin:0 0 1px;padding:0 5px;line-height:25px;color:#1B1B1B;font-size:13px;font-weight:bold}
#main .dl ul li b,.dl ul li strong{font-weight:600;background:#0072BB;color:#FFF;line-height:25px;font-size:13px;display:block;padding:0 6px;margin-right:6px;float:left;min-width:75px;border-right:2px solid #FAFAFA;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-left:-5px}
@media (max-width: 640px) {#main .dl ul li b,#main .dl ul li strong{display:inline-block;float:none;width:98%}#main .dl ul li{text-align:center}}
- Jika sudah Save Tema
- Berikutnya buatlah Postingan atau artikel menggunakan Metode HTML bukan Compose, kemudian masukkan HTML dibawah ini
<div class="dl">
<ul>
<h3>
Episode Anime</h3>
<li><b>3gp</b>
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">ZippyShare</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Tusfiles</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Solidfiles</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Mirror</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Upload</a>
</li>
<li><b>Mp4</b>
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">ZippyShare</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Tusfiles</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Solidfiles</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Mirror</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Upload</a>
</li>
<li><b>480p</b>
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">ZippyShare</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Tusfiles</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Solidfiles</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Mirror</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Upload</a>
</li>
<li><b>720p</b>
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">ZippyShare</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Tusfiles</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Solidfiles</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Mirror</a> \
<a href="Link Download" rel="nofollow" target="_blank" title="Judul Anime">Upload</a>
</li>
</ul>
</div>
| Tag | Keterangan |
|---|
| href="Link Download" | Ganti Link Download sesuai dengan hostingnya |
| title="Judul Anime" | Ganti Judul Anime |
Comments
Post a Comment