Cara Membuat Halaman (Pagination) Pada Postingan

Ukuran sebuah postingan adakalanya dibuat cukup pendek, mungkin hanya berisi beberapa paragraph saja karena dianggap sudah cukup mewakili dari apa yang dikehendaki oleh sang admin, namun terkadang ada pula sebuah postingan dibuat cukup panjang atau terpaksa harus dijabarkan secara panjang lebar agar apa yang menjadi maksud dan tujuan dari sang admin bisa tersampaikan dengan baik walau bukan jaminan postingan yang panjang itu akan dinilai baik oleh pembacanya.

Untuk sebuah postingan yang isinya cukup panjang apalagi jika disertai dengan gambar, alangkah baiknya jika diterapkan page break atau pagination halaman atau membagi postingan ke dalam beberapa halaman (CMIIW). Tujuannya supaya loadingnya tetap cepat, navigasi serta tampilannya tetap terjaga (enak dilihat dan mudah diakses).

Cara Membuat Halaman (Pagination) Pada Postingan :

1. Tambahkan kode berikut ini di bagian anda ingin splite atau break halaman, tapi harus dalam posisi HTML editor (jangan visual).

   <!--nextpage-->

2. Jika theme anda belum support pagination halaman posting (belum ada kode pagination di file single.php), tambahkan kode berikut ini ke dalam file single.php :

   <div class="wp_page_numbers"><?php wp_link_pages('Pages : ', '', 'number'); ?></div>

   kode tersebut di atas anda tempatkan setelah kode <?php the_content(); ?> (kode yang biasa digunakan untuk menampilkan isi postingan).

3. Untuk mempercantik tampilan dari nomor halaman yang telah dibuat, anda bisa menambahkan kode CSS berikut ini ke dalam file CSS yang anda gunakan, atau bisa juga menggunakan teknik Custom CSS Per Post:

   .wp_page_numbers {font-weight:bold;
     margin-top:10px} 
   .wp_page_numbers a {background:#dbe7f0;
     padding:3px 5px 3px;
     margin-left:3px;
     margin-right:3px;
     color:#333;
     border:1px solid #949191;
     border-radius:6px 0 6px;
     -moz-border-radius:6px 0 6px;
     -webkit-border-radius:6px 0 6px;
     box-shadow:2px 2px 2px #b3b3b7;
     -moz-box-shadow:2px 2px 2px #b3b3b7;
     -webkit-box-shadow:2px 2px 2px #b3b3b7; } 
   .wp_page_numbers a:hover {text-decoration:none;
     border:2px solid #002cba;
     background:#97a3c7;
     -webkit-transition:margin-left 1s ease,background-color 1s ease;
     -moz-transition:margin-left 1s ease,background-color 1s ease;
     -o-transition:margin-left 1s ease,background-color 1s ease;
     transition:margin-left 1s ease,background-color 1s ease; }

Kode CSS tersebut di atas sengaja sedikit saya beri efek transisi dengan CSS3 pada saat dihover, jika anda tidak suka bisa anda hapus kode properties dari efek transisi tersebut atau bisa anda buat sendiri dengan efek lain sesuai selera. Untuk warna, padding, margin, border dan lain-lain bisa anda ganti sesuai selera. Hasilnya bisa anda lihat di postingan ini : 80 Inspirasi, Design Footer Nan Cantik Dan Unik.

Update :

Page break atau pagination halaman atau membagi postingan ke dalam beberapa halaman ini ternyata berpotensi untuk munculnya duplikat kontent di Google Webmaster Tool. Untuk mencegahnya silahkan tambahkan script berikut ini di file robots.txt yang ada di root direktori hosting :

User-agent: Googlebot
Disallow: /*/2*
Disallow: /*/3*
Disallow: /*/4*
Disallow: /*/5*
Disallow: /*/6*
Disallow: /*/7*
Disallow: /*/8*
Disallow: /*/9*
Disallow: /*/10*

Itu diasumsikan jika sebuah postingan dibuat sampai 10 halaman, jika lebih, bisa anda tambahkan nomor halaman yang akan dicegah untuk diindek di bawahnya, misalnya Disallow: /*/11* dan seterusnya.