Download Box Samehadaku

Download Box Samehadaku
Dagruel

Download Box merupakan widget yang mengatur kumpulan link download agar tersusun rapi, sekaligus mempercantik tempilan website.

Download Box kedua dari web Dagruel. Kali ini saya share dari web samehadaku langsung saja cek cara nya dibawah.

Pemasangan CSS

Untuk WordPress buka.

Appearance > Theme Editor > style.css > tempelkan CSS nya
atau
Appearance > Customize > Additional CSS > tempelkan CSS nya

Untuk Blogger buka.

Tema > Edit HTML > tempelkan CSS nya di antara tag <style> tempelkan css nya disini </style>
/* Samehadaku Download Box */
  .download-eps {font-size: 15px;font-weight: bold;padding: 10px;background: #f1f1f1;overflow: hidden;}
  .download-eps .smokettl {padding: 8px 10px;background: #fff;margin-bottom: 7px;}
  .download-eps ul {margin: 0;padding: 0;list-style: outside none none;overflow: hidden;}
  .download-eps ul li {margin-bottom: 7px;line-height: 31px !important;background: #fff;}
  .download-eps ul li span:after {content: "|";padding-left: 5px;padding-right: 5px;}
  .download-eps ul li span:last-child:after {content: "";}
  .download-eps ul li strong {background: none repeat scroll 0% 0% #1e7ce5;border-right: 2px solid #F5F5F5;width: 100px;display: block;float: left; color: #FFF; padding: 0 5px; text-align: center;}
  @media screen and (max-width:680px) {
    .dlbod {text-align: center;}
  }

Pemasangan Download Box

Saat membuat postingan baru pastikan memakai mode HTML (bukan Compose) untuk blogger, sedangkan wordpress mode Text (bukan Visual)

<div class="dlbod">
  <div class="download-eps">
    <div class="smokettl">MKV</div>
    <ul>
      <li style="text-align: center;"><strong>360p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
      <li style="text-align: center;"><strong>480p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
      <li style="text-align: center;"><strong>720p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
      <li style="text-align: center;"><strong>1080p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
    </ul>
  </div>
  <div class="download-eps">
    <div class="smokettl">MKV</div>
    <ul>
      <li style="text-align: center;"><strong>360p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
      <li style="text-align: center;"><strong>480p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
      <li style="text-align: center;"><strong>720p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
      <li style="text-align: center;"><strong>1080p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
    </ul>
  </div>
  <div class="download-eps">
    <div class="smokettl">MKV</div>
    <ul>
      <li style="text-align: center;"><strong>360p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
      <li style="text-align: center;"><strong>480p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
      <li style="text-align: center;"><strong>720p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
      <li style="text-align: center;"><strong>1080p </strong> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">ZippyShare</a></span> <span><a href="#" target="_blank" rel="nofollow noopener noreferrer">AceFile</a></span> <span><a
            href="#" target="_blank" rel="nofollow noopener noreferrer">Reupload</a></span></li>
    </ul>
  </div>
</div>
Ganti Text yang ditandai Sesuai Keinginan Kalian

Sekian Postingan saya kali ini semoga bermanfaat, dan jika ada yang ingin di tanyakan silahkan berkomentar dibawah. Sampai jumpa dipostingan selanjutnya Terima Kasih.

https://samehadaku.vip

Comments