Cara Membuat Artikel Menjadi Beberapa Halaman (Pagination)

Oleh eddystrada

Bagikan :

Tweet

Cara Membuat Artikel Menjadi Beberapa Halaman ( Pagination ) : Bila artikel anda isinya sangat panjang, tentu kurang enak di pandang dan seringkali memberatkan pembaca yang bandwidthnya pas-pasan. Untuk hal seperti ini, wordpress punya solusi yaitu satu artikel bisa di buat menjadi beberapa halaman atau istilah yang baku disebut sebagai pagination. Dengan fungsi pagination, sebuah artikel yang panjang bisa di bagi-bagi menjadi beberapa halaman, tergantung kita mau menjadikan artikel tersebut menjadi berapa halaman. Untuk pembaca, bila ingin membaca halaman selanjutnya tinggal klik nomor halaman yang tertera di bawah artikel tersebut.

Cara Membuat Pagination Pada Wordpress

Untuk membuat fungsi pagination caranya cukup mudah, anda hanya perlu memasukkan kode <!--nextpage--> pada paragrap yang ingin di potong, namun kode tersebut harus di masukkan pada saat mode post editor anda dalam keadaan HTML. Berikut uraiannya :

Klik tab HTML untuk berpindah ke mode editor HTML.

• Diasumsikan bahwa anda sedang membuat sebuah posting
• Sisipkan kode <!--nextpage--> pada akhir kalimat yang ingin di buatkan pagination. Kode tersebut boleh dimasukkan beberapa kali ( diakhir kalimat yang mau di potong), tergantung artikel tersebut ingin di bagi kedalam berapa halaman.
• Jika anda merasa ingin kembali ke mode Visual, tinggal ubah kembali ke mode Visual dan lakukan edit sesuai keinginan.
• Jika sudah yakin, silahkan di publish saja.
• Selesai.

Pagination WordPress tidak berfungsi :

Apabila anda telah melakukan langkah-langkah seperti yang telah ditulis diatas namun pagination tidak berfungsi, kemungkinan besar theme/tema yang anda gunakan tidak support fungsi pagination. Lalu, bagaimana agar theme anda menjadi support pagination? Caranya cukup mudah yaitu anda tinggal menambahkan sedikit kode php dalam file single.php pada theme yang anda gunakan. Kode tersebut adalah sebagai berikut :

<?php wp_link_pages(); ?>

Dengan menyisipkan kode tersebut, pagination akan berfungsi namun hanya berupa nomor halaman saja. Agar terlihat sedikit indah, anda dapat mengganti kode diatas dengan kode berikut ini :

<?php wp_link_pages( array( 'before' =>

 '<div class="page-link">' . __

( 'Halaman :'), 'after' => '</div>' ) ); ?>

Tulisan Halaman bisa anda ganti sesuai dengan keinginan, misal : Lanjut, Pages dan lain sebaginya. Kode diatas menyertakan fungsi CSS class yang artinya anda nanti dapat berkreasi untuk menghias tampilan pagination.

Cara memasukkan kode pagination
Telah disebutkan sebelumnya bahwa kode pagination di sisipkan pada file single.php, namun tentu saja itu akan menyulitkan bagi anda yang memang belum faham bagaimana mengedit suatu file di wordpress. Agar mudah, berikut uraiannya :

• Silahkan login ke dashboard wordpress anda
• Masuklah ke theme editor. Sorot menu Appearance lalu pilih Editor.
  
  
  
  
• Pastikan bahwa theme yang terpilih adalah theme yang sedang anda gunakan di blog.
  
• Alihkan perhatian ke sebelah kanan bawah lalu pilih single.php
  
  
  
  
• Backup dahulu kode yang ada (copy lalu paste pada notepad) agar apabila anda melakukan kesalahan dalam mengedit file, bisa dikembalikan kesemula.
• Carilah kode seperti di bawah ini:
  

  <?php the_content();  ?>

• Masukkan kode pagination persis dibawahnya, contoh :
  
  

  <?php the_content();  ?>
  <?php wp_link_pages( array( 'before' =>

   '<div class="page-link">' . __

  ( 'Halaman :'), 'after' => '</div>' ) ); ?>

  ( Kode warna merah adalah kode yang harus anda masukkan )

• Klik tombol Update File.
  
  
  
  
• Selesai. Sekarang cobalah membuat sebuah posting yang mengandung pagination untuk melihat hasilnya.

Menghias Tampilan Pagination Melalui CSS
Telah disebutkan bahwa kode pagination yang tadi dipasang memuat CSS class yaitu <div class="page-link"> , artinya anda dapat mengatur tampilan melalui kode CSS. Salah satu contoh CSS  adalah sebagai berikut :

.page-link {
color: #000;
font-size: 12px;
margin: 15px 0 22px 0;
word-spacing: 0.3em;
}
.page-link a:link,
.page-link a:visited {
background: #666;
color:#FFF;
font-weight: normal;
padding: 0.3em 0.6em;
text-decoration: none;
}

.page-link a:active,
.page-link a:hover {
background: #333;
}

Berikut adalah langkah-langkah memasukkan kode tersebut ke theme anda.

• Diasumsikan bahwa sedang pada halaman theme editor.
• Klik file style.css
  
  
  
  
•  Backup terlebih dahulu kode yang ada (copy lalu paste pada notepad) agar apabila anda melakukan kesalahan dalam mengedit file, bisa dikembalikan kesemula.
• Copy lalu paste kode css berikut pada deretan terakhir kode CSS anda.
  
  

  .page-link {
  color: #000;
  font-size: 12px;
  margin: 15px 0 22px 0;
  word-spacing: 0.3em;
  }
  .page-link a:link,
  .page-link a:visited {
  background: #666;
  color:#FFF;
  font-weight: normal;
  padding: 0.3em 0.6em;
  text-decoration: none;
  }
  
  .page-link a:active,
  .page-link a:hover {
  background: #333;
  }

  
  
• Klik tombol Update File.
  
  
  
  
• Selesai.

Kini tampilan pagination anda akan terlihat lebih menarik daripada sebelumnya. Mudah-mudahan urain tentang Membuat Artikel Menjadi Beberapa Halaman (Pagination) dapat bermanfaat bagi anda.

Sumber : Kang Rohman ( krtutorplus )

Tag : Tutorial Wordpress