Cara Membuat Anime List Otomatis Page di WordPress

Selamat datang di blog Kang Safiq kali admin akan membagikan Tutorial Dari Blog Eroyaro Tutorial dan Tips & Trik yang sangat berguna bagi kalian semua . Kali ini akan membuat Sebuah Tutorial yang sangat Bagus. Tutorial ini Sangat Sering digunakan bagi kalian yang Membuka Blog Artikel , Fansubs, Fanshare dll, Cara Membuat Anime List di WordPress
Pertama buatlah 1 file php dengan nama terserah kalian . disini saya akan memberi contoh nya animelist.php, kemudian letakan kode ini kedalam file animelist.php

<?php
/*
Template Name: Anime List
*/

get_header(); ?>

<div id="sanjivinsmoke">
<div class="vinsmokebody">
<h1 class='archiver'>Anime List</h1>
<div class="nav_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="animelist">
<div id="a-z">
 <?php
 $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
 $args = array (
 'posts_per_page' => 1000,
 'post_type' => 'anime',
 'orderby' => 'title',
 'order' => 'ASC',
 'paged' => $paged
 );
 query_posts($args);
 if ( have_posts() ) {
 $in_this_row = 0;
 while ( have_posts() ) {
 the_post();
 $first_letter = strtoupper(substr(apply_filters('the_title',$post->post_title),0,1));
 if ($first_letter != $curr_letter) {
 if (++$post_count > 1) {
 end_prev_letter();
 }
 start_new_letter($first_letter);
 $curr_letter = $first_letter;
 }
 if (++$in_this_row > $posts_per_row) {
 end_prev_row();
 start_new_row();
 ++$in_this_row; // Account for this first post
 } ?>
 <div class="title-cell"><li><a class="series" href="<?php the_permalink() ?>" rel="<?php the_ID(); ?>"><?php the_title(); ?></a></li></div>
 <?php }
 end_prev_letter();
 ?>
 <?php } else {
 echo "<h2>Sorry, no posts were found!</h2>";
 }
 ?>
 
 </div><!-- End id='a-z' -->
</div>
</div>
<?php include (TEMPLATEPATH . '/sidebarz.php'); ?>
</div>
</div>

<?php get_footer(); ?>
<?php
function end_prev_letter() {
 end_prev_row();
 echo "</div><!-- End of letter-group -->\n";

}
function start_new_letter($letter) {
 echo "<div class='letter-group'>\n";
 echo "\t<div class='letter-cell'><a name='$letter'>$letter</a></div>\n";
 start_new_row($letter);
}
function end_prev_row() {
 echo "\t</div><!-- End row-cells -->\n";
}
function start_new_row() {
 global $in_this_row;
 $in_this_row = 0;
 echo "\t<div class='row-cells'>\n";
}
 
?>

Note : Silahkan kalian Atur sendiri Tag Div sesuai Template kalian

Berikut CSS kode nya silahkan dicomot aja , paste kan ke dalam style.css kalian

/* -- Anime List -- */
.nav_apb{margin-bottom:5px;-webkit-font-smoothing:antialiased!important}
.nav_apb a{padding: 2px 0px;width: 22px;margin: 0 1px;text-align: center;display: block;font-weight: 700;float: left;background:#272727;color: #fff;}
.nav_apb a:hover{background:#e34e85;text-decoration:none}
#animelist{overflow:hidden}
#animelist h2{font-size:14px;padding:3px 0;margin-bottom:5px;border-bottom:4px solid #343434}
#a-z{overflow:hidden}
.letter-group{height:auto;margin:0 0 10px;overflow:hidden}
.letter-cell{font-weight: 700;padding: 0px 5px;margin-bottom: 5px;border-bottom:3px solid #3E3E3E;}
.letter-cell a{color:#222;font-size:15px;margin-bottom:4px;display:block}
.title-cell{line-height:18px;margin-right:7px;text-overflow:ellipsis;white-space:nowrap}
.title-cell li{list-style:none}
.title-cell a{color:#333;font-weight:bold;}
.title-cell a:hover{text-decoration:none;color:#e34e85}

Nanti tampilan contohnya akan seperti ini :

Sesuaikan nama custom post kalian , Setting nya cari kode yang seperti ini

'post_type' => 'anime'

Lalu cara Memunculkannya Pergi ke Pages/Laman -> Add New -> Ubah di bagian Page Attributes Template – > Anime list
Seperti gambar dibawah ini :