Membuat Box Download Seperti Samehadaku NET

September 12, 2017
Membuat Box Download Seperti Samehadaku NET -  mungkin kebanyakan dari kalian pemilik blog download anime / ost atau apapun itu bingung karena ingin membuat box download mirip seperti milik situs samehadaku net,  karena apa? dengan membuat tabel seperti foto berikut, akan membuat tampilan link didalam postingan menjadi rapi & juga mempermudahkan pengunjung yang ingin mendownload.

Membuat Box Download / Tabel Link Seperti Samehadaku NET

Sebenarnya membuat model download box seperti diatas tidaklah terlalu sulit, karena kita tinggal Inspect element saja template yang di pakai situs tersebut, nanti kita akan bisa melihat kode-kode tersebut atau juga kita bisa mengintipnya lewat source (ctrl + u).

Namun memang bagi yang belum paham betul tentang kode HTML, hal ini dirasa mungkin agak sulit, maka untuk itu saya buatkan tutorial ini untuk mempermudah sobat bagi yang mau membuat link download seperti situs samehadaku.net.

Membuat Box Download / Tabel Link Seperti Samehadaku NET

1. Buka akun blogger anda.
2. Pilih menu template >> Klik edit HTML
3. Letakan kode dibawah ini tepat diatas kode ]]></b:skin> atau </style> :
.download-eps {
    font-size: 9px;
    font-weight: bold;
    background: none repeat scroll 0% 0% #F5F5F5;
    padding: 10px;
    margin: 10px 0px;
}
.download-eps ul {
    margin: 0px;
    padding: 0px;
    list-style: outside none none;
}
.download-eps ul li {
    background: none repeat scroll 0% 0% #E4E4E4;
    margin-bottom: 2px;
    line-height: 26px;
    padding: 0px 5px;
    font-size: 15px;
}
.download-eps ul li strong {
    background: none repeat scroll 0% 0% #1e7ce5;
    border-right: 2px solid #F5F5F5;
    width: 150px;
    display: block;
    float: left;
    margin-left: -5px;
    margin-right: 2px;
    color: #FFF;
    padding: 0px 5px;
    text-align: left;
Nahh untuk membuat kode pemanggilnya silahkan sobat copy code dibawah ini dan letakan di mode HTML saat membuat artikel.
 <div class="download-eps">
<ul>
<li style="text-align: center;">
<strong>360p</strong>
<a href="URLANDA" target="_blank" rel="nofollow">Solidfiles</a> |
<a href="URLANDA" target="_blank" rel="nofollow">Tusfiles</a> |
<a href="URLANDA" target="_blank" rel="nofollow">Acefile</a> |
<a href="URLANDA" target="_blank" rel="nofollow">Mirror</a>
<li style="text-align: center;">
<strong>720p</strong>
<a href="URLANDA" target="_blank" rel="nofollow">Solidfiles</a> |
<a href="URLANDA" target="_blank" rel="nofollow">Tusfiles</a> |
<a href="URLANDA" target="_blank" rel="nofollow">Acefile</a> |
<a href="URLANDA" target="_blank" rel="nofollow">Mirror</a>
<li style="text-align: center;">
<strong>1080p</strong>
<a href="URLANDA" target="_blank" rel="nofollow">Solidfiles</a> |
<a href="URLANDA" target="_blank" rel="nofollow">Tusfiles</a> |
<a href="URLANDA" target="_blank" rel="nofollow">Acefile</a> |
<a href="URLANDA" target="_blank" rel="nofollow">Mirror</a>
</li>
</ul>
</div> 
Silahkan ganti nama "URLANDA" atau sobat sesuaikan dengan link dan nama situs downloadnya.

Artikel Terkait

Next Article
« Prev Post
Previous Article
Next Post »
Penulisan markup di komentar
  • Untuk menulis huruf bold gunakan <strong></strong> atau <b></b>.
  • Untuk menulis huruf italic gunakan <em></em> atau <i></i>.
  • Untuk menulis huruf underline gunakan <u></u>.
  • Untuk menulis huruf strikethrought gunakan <strike></strike>.
  • Untuk menulis kode HTML gunakan <code></code> atau <pre></pre> atau <pre><code></code></pre>, dan silakan parse kode pada kotak parser di bawah ini.

Disqus
Tambahkan komentar Anda

No comments