[Perbaikan] Black Fansub - Fansub & Fanshare, OST, PV Blogger Template

[Perbaikan] Black Fansub - Fansub & Fanshare, OST, PV Blogger Template | Kamisamazune.tk
[Perbaikan] Black Fansub - Fansub & Fanshare, OST, PV Blogger Template - Yah, ternyata setelah saya cek, ada sedikit (lumayan) bug / kerusakan pada Template ini
Mohon maaf bila saya baru menyadari nya sekarang (maklum, manusia pasti punya salah)

Oke, sebagai permintaan mohon maaf saya kepada kalian, saya akan memberi Patch / Perbaikan dari Template ini, dan item-item lainnya, seperti yang kalian tagih kepada saya dan itu membuat saya tidak enak kepada kalian, karena saya tidak memberitahu cara untuk membuat Anime List A - Z nya :
(klik gambar untuk memperbesar)

Okelah, di post Perbaikan Template Black Fansub akan saya jelaskan semuanya dengan lengkap.
Sebelum itu, berikut salah satu contoh bug / kerusakan yang terjadi di template Black Fansub :
Kamisamazune.tk

(klik gambar untuk memperbesar)

Lalu saya perbaiki hingga menjadi seperti ini :
(klik gambar untuk memperbesar)

Gambar di atas adalah salah satu contoh bug pada Navigasi Halaman Postingan


Cara membuat Anime List A - Z seperti di Black Fansub - demo
COPY DAN PASTE KODE DI BAWAH INI DI POSTINGAN KAMU TEPATNYA DALAM MODE HTML
<div class="sub-nav">
<!--[if IE]>
<b class="b-l"></b>
<b class="b-r"></b>
<![endif]-->
Alphabetically:
<a href="#a">A</a> -
<a href="#b">B</a> -
<a href="#c">C</a> -
<a href="#d">D</a> -
<a href="#e">E</a> -
<a href="#f">F</a> -
<a href="#g">G</a> -
<a href="#h">H</a> -
<a href="#i">I</a> -
<a href="#j">J</a> -
<a href="#k">K</a> -
<a href="#l">L</a> -
<a href="#m">M</a> -
<a href="#n">N</a> -
<a href="#o">O</a> -
<a href="#p">P</a> -
<a href="#q">Q</a> -
<a href="#r">R</a> -
<a href="#s">S</a> -
<a href="#t">T</a> -
<a href="#u">U</a> -
<a href="#v">V</a> -
<a href="#w">W</a> -
<a href="#x">X</a> -
<a href="#y">Y</a> -
<a href="#z">Z</a>
</div>
<div class="list-anime">

<dl>
<dt><i>#</i>
<a class="topname" href="javascript:void(0);" name="#" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>
</dl>
<dl>
<dt><i>A</i>
<a class="topname" href="javascript:void(0);" name="a" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>B</i>
<a class="topname" href="javascript:void(0);" name="b" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>C</i>
<a class="topname" href="javascript:void(0);" name="c" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>
</dl>
<dl>
<dt><i>D</i>
<a class="topname" href="javascript:void(0);" name="d" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>E</i>
<a class="topname" href="javascript:void(0);" name="e" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>F</i>
<a class="topname" href="javascript:void(0);" name="f" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>G</i>
<a class="topname" href="javascript:void(0);" name="g" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>H</i>
<a class="topname" href="javascript:void(0);" name="h" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>I</i>
<a class="topname" href="javascript:void(0);" name="i" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>J</i>
<a class="topname" href="javascript:void(0);" name="j" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>
<dd><a href="#">-</a></dd>
</dl>
<dl>
<dt><i>K</i>
<a class="topname" href="javascript:void(0);" name="k" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>L</i>
<a class="topname" href="javascript:void(0);" name="l" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>M</i>
<a class="topname" href="javascript:void(0);" name="m" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');">/a>
</dt>

</dl>
</div>
<div class="list-anime">

<dl>
<dt><i>N</i>
<a class="topname" href="javascript:void(0);" name="o" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>O</i>
<a class="topname" href="javascript:void(0);" name="o" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>P</i>
<a class="topname" href="javascript:void(0);" name="p" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>Q</i>
<a class="topname" href="javascript:void(0);" name="q" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>
<dd><a href="#">-</a></dd>
</dl>
<dl>
<dt><i>R</i>
<a class="topname" href="javascript:void(0);" name="r" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>S</i>
<a class="topname" href="javascript:void(0);" name="s" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>
<dd><a href="/p/sword-art-online-2.html">Sword Art Online II</a></dd>
</dl>
<dl>
<dt><i>T</i>
<a class="topname" href="javascript:void(0);" name="t" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>U</i>
<a class="topname" href="javascript:void(0);" name="u" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>V</i>
<a class="topname" href="javascript:void(0);" name="v" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>
<dd><a href="#">-</a></dd>
</dl>
<dl>
<dt><i>W</i>
<a class="topname" href="javascript:void(0);" name="w" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>X</i>
<a class="topname" href="javascript:void(0);" name="x" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>
<dd><a href="#">-</a></dd>
</dl>
<dl>
<dt><i>Y</i>
<a class="topname" href="javascript:void(0);" name="y" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
<dl>
<dt><i>Z</i>
<a class="topname" href="javascript:void(0);" name="z" onclick="jQuery('html, body').animate({scrollTop:0}, 'slow');"></a>
</dt>

</dl>
</div>
<style>
.sub-nav {
background: none repeat scroll 0% 0% #FFFFFF;
border-bottom: 2px solid #CCEBF1;
height: 30px;
padding: 0px 200px;
color: #000;
border-radius: 5px;
font-family: Open Sans;
font-weight: bold;
font-size: 14px;
}
.sub-nav a {
text-shadow: 1px 1px 0px #FFFFFF;
color: #23B0E8;
font-weight: bold;
background: #FFFFFF;
}
.list-anime {
    width: 434px;
    float: left;
    margin: 50px 40px 0px 30px;
    display: inline;
    font-size: 12px;
}
.list-anime dl {
background: #f5faff;
padding: 0 0 25px 18px;
margin: 0 0 15px;
}
.list-anime dl dt {
height: 34px;
position: relative;
}
.list-anime dl dt i {
position: absolute;
width: 30px;
height: 30px;
background-position: 0 -88px !important;
top: -2px;
left: -21px;
color: #0363d7;
font-size: 15px;
font-weight: bold;
padding: 4px 0 0 8px;
line-height: 20px;
}
.list-anime dl dt .topname {
position: absolute;
width: 11px;
height: 20px;
background-position: -42px -88px !important;
top: 5px;
right: 12px;
border: none !important;
}
.sort-list, .cate a.text-version, .cate a.img-version, .list-anime dl dt i, .list-anime dl dt .topname, .list-anime dl dd a {
background:url(https://lh6.googleusercontent.com/-4ggtbvMRND8/UdMUm0_Hx8I/AAAAAAAAC2o/46RlrlsvalQ/s1600/bg_version.png)no-repeat;
}
.list-anime dl dd {
padding: 6px 0;
}
.list-anime dl dd a {
color: #677e95 !important;
padding: 0 0 0 15px !important;
background-position: -99px -128px;
border: none !important;
}
div#HTML5.widget.HTML{
display: none;
}
#sidebar,#sosial:before, #sosial:after, #comments, .post-footer, #blog-pager, #header, .breadcrumbs{
display: none;
}
.post h1{
display: none;
}
#main-wrap {
width: 1070px;
float: left;
}
#searchformfix {
    width: 20%;
    float: right;
    margin-top: 250px !important;
    margin-right: 20px !important;
    overflow: hidden;
}
.sf-menu {
    background: none repeat scroll 0% 0% #5DC8F4;
    border-bottom: 2px solid #CCEBF1;
    height: 43px;
    padding: 0px 25px;
    width: 1093px;
    margin-top: 250px;
border-radius: 3px;
}
</style></div>

Bagaimana cara menambahkan judul anime nya di dalam Anime List A - Z ini?
- Gampang kok, kamu tinggal tambahkan kode : <dd><a href="/p/sword-art-online-2.html">Sword Art Online II</a></dd>
diantara kode ini :
</dt>

</dl>
letakan kode <dd><a href="/p/sword-art-online-2.html">Sword Art Online II</a></dd> di tengah-tengahnya

Oke, saya rasa itu saja
Cukup sekian hari ini, bila ada bug / kerusakan lagi dalam template yang ber-label Desain oleh saya
Silahkan laporkan di komentar


UNTUK PENGATURAN LAINNYA, SILAHKAN MENGUNJUNGI POST SEBELUMNYA : link
  1. update lagi dong broh Templatenya :D

    BalasHapus
  2. iya bro, di tunggu updatenya :D

    BalasHapus
  3. bang
    tataletak home, animelist yang di atas sama sidebarnya ko pas di pakai jadi beratakan

    BalasHapus