Hallo guys Tutorial kaliini Berasal Dari WEB Terkenal Untuk Tutorial Anime hehehe
ArlethDesign. Jadi ga Mungkin ga Work :v
oke langsung aje.............
Anime List - Fitur ini biasa disebut sitemap atau daftar isi dari suatu blog, setiap blog memiliki beberapa macam design sitemap/ daftar isi yang berbeda namun tetap satu fungsi.
Tutorial ini akan membahas Cara Membuat Anime List Seperti Fansub Awsubs, cara membuatnya cukup mudah kalian tinggal mengikuti langkah-langkah yang akan saya jelaskan dibawah. Kalian bisa lihat contoh yang sudah jadinya dibawah ini.
Cara Membuat Anime List Awsubs
- Silahkan Buka Blogger kamu > Halaman Baru, lalu tambahkan css berikut ini
- Kedua, tambahkan HTML berikut dibawah CSS yang sudah dimasukkan sebelumnya
- Silahakan kalian edit yang sudah saya beri Tandai, Selesai.
<style>
/* CSS Anime List Wardhanime */
.nominal_apb{text-align:center;margin:0 0 5px;padding:1px 0}
.nominal_apb a{display:block;width:26.7px;float:left;background:#424242;font-weight:500;color:#FFF;padding:5px 0}
.nominal_apb a:hover{background:#2977BE;text-decoration:none}
.filter-kata{position:relative;margin-bottom:10px}
.judul-filter{font-family:segoe ui;font-weight:700;color:#333;font-size:13px;border-bottom:2px solid #2977BE;margin-bottom:5px;background:none;text-transform:uppercase;position:relative;padding:5px}
.judul-filter a{color:#6D6D6D}
.filter-column{float:left;line-height:21px;width:308px;color:#000;padding-left:16px}
.judul-anim{line-height:21px;font-weight:300;display:list-item}
.judul-anim a{font-size:12px;color:#2E2E2E;font-family:segoe ui}
</style>
<div id="animelist">
<div class="nominal_apb">
<a href="#%23">#</a>
<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 class="clear"></div></div>
<div id="a-z">
<div class="filter-kata"><div class="judul-filter">
<a name="0">0</a>
</div>
<div class="filter-column"><div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div></div>
<div class="filter-column"><div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div></div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="A">A</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="B">B</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="C">C</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="D">D</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="E">E</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="F">F</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="G">G</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="H">H</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="I">I</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="J">J</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="K">K</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="L">L</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="M">M</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="N">N</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="O">O</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="P">P</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="Q">Q</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="R">R</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="S">S</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="T">T</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="U">U</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="V">V</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="W">W</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="X">X</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter">
<a name="Y">Y</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div>
</div>
<div class="filter-kata">
<div class="judul-filter"><a name="Z">Z</a>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="filter-column">
<div class="judul-anim">
<a class="series" href="LINK TUJUAN" title="NAMA ANIME">NAMA ANIME</a>
</div>
</div>
<div class="clear"></div></div></div></div>