Spoiler Post & Download box Nekonime [Part 5]

Spoiler Post & Download box Nekonime - Artikel kali ini saya akan membuat request tutorial Cara Membuat Download box Nekonime di blogger.

Download Box kali ini menggunakan spoiler post sebagai tambahan untuk download link, berbeda dengan Download Box Nekopoi yang sebelumnya saya buat dengan menambahkan Attribute target:blank dan rel:nofollow auto.

DEMO

1. Buka Blogger > Tema > Edit HTML
2. Simpan CSS berikut ini diatas </style>

/* Download Box Nekonime - Arlethdesign

  ====================================== */

#_box-area #table{border-collapse:collapse;border-spacing:0;background-color:transparent;width:100%;max-width:100%;margin-bottom:20px}

#_box-area #table tbody{display:table-row-group;vertical-align:middle;border-color:inherit}

#_box-area #table tbody tr{display:table-row;vertical-align:inherit;border-color:inherit}

#_box-area #table tbody tr:hover,#_box-area #table tbody tr td:hover{background-color:#f5f5f5;}

#_box-area #table tbody tr td{border:1px solid #ddd;padding:7px 10px;line-height:1.42857143;vertical-align:top}

#_box-area #table a{color:#00c400;background:none;float:none;padding:0;display:inline-block;font-size:12px;border:none;}

#_box-area #table a:hover{text-decoration:underline}

#_box-area #table ._title-box:hover,#_box-area #table ._title-box{background-color:#00802b;}

/* Spoiler Post For Download Box - Arlethdesign

  ============================================= */

._spoiler-post{border:1px solid #ddd;margin-bottom:5px}

._showing-post{background:#f1f1f1;width:100%;display:block;padding:10px;text-align:left;line-height:1.5;font-weight:700;cursor:pointer;border:none;color:#333;outline:none}

._showing-post.min:before{content:'+';margin-right:5px}

._showing-post.max:before{content:'-';margin-right:5px}

._spoiler-post .hidden{display:none}

._spoiler-content{padding:10px;overflow:hidden;clear:both;border-top:1px solid #ddd;background:#fbfbfb;}

3. Lalu simpan javascript berikut diatas </head>

 

<b:if cond='data:blog.pageType in {&quot;item&quot;,&quot;static_page&quot;}'>

<script type='text/javascript'>//<![CDATA[

$(document).ready(function(){$("._spoiler-post").click(function(){$("._spoiler-content").toggle();$('._showing-post').toggleClass('min max');});});

//]]></script>

</b:if>

4. Jika Sudah Save tema.
5. Gunakan HTML Berikut ini untuk Spoiler Post nya

<div class='_spoiler-post'>

<button class='_showing-post min'>Episode Lainnya Klik Disini</button>

<div class='_spoiler-content hidden'>

<!-- Download box -->

</div>

</div>

6. Gunakan HTML Berikut untuk Download Box nya

<div id='_box-area'>

<table id="table"><tbody><tr><td class="_title-box"><center>

<span style="color: #dadada;">

<b>Boku no Hero Academia S3 Episode 3 Sub Indo — </b><span style="color: lime;">Oploverz</span>

</span></center></td></tr><tr><td><center>

Mkv 480p

</center></td></tr><tr bgcolor="#eee"><td><center>

<a href="#" rel="nofollow" target="_blank">Nekodrive</a> | 

<a href="#" rel="nofollow" target="_blank">Downace</a> | 

<a href="#" rel="nofollow" target="_blank">Zippyshare</a> | 

<a href="#" rel="nofollow" target="_blank">ClicknUpload</a> | 

<a href="#" rel="nofollow" target="_blank">Datafilehost</a>

</center></td></tr><tr><td><center>

Mkv 720p

</center></td></tr><tr bgcolor="#eee"><td><center>

<a href="#" rel="nofollow" target="_blank">Nekodrive</a> | 

<a href="#" rel="nofollow" target="_blank">Downace</a> | 

<a href="#" rel="nofollow" target="_blank">Zippyshare</a> | 

<a href="#" rel="nofollow" target="_blank">ClicknUpload</a> | 

<a href="#" rel="nofollow" target="_blank">Datafilehost</a>

</center></td></tr><tr><td><center>

Mp4 streaming (480p)

</center></td></tr><tr bgcolor="#eee"><td><center>

<a href="#">Nekonime</a> | 

<a href="#" rel="nofollow" target="_blank">Streamango</a>

</center></td></tr></tbody></table>

</div>

Nah itulah tutorial spoiler post & download box nekonime part 5, jangan lupa like dan share oke....

Source : arlethdesign