Membuat Sendiri Script Excerpt (Cuplikan) Artikel Ala WordPress

Sharing is caring!

Kalau Anda WordPress maniac, tentu tidak asing dengan istilah ‘excerpt’. Excerpt adalah istilah yang maksudnya kurang lebih sama dengan ‘cuplikan artikel’ dalam bahasa Indonesia. Contoh excerpt adalah seperti di halaman depan blog ini. Di situ ada daftar artikel, yang di dalamnya ada judul artikel dan cuplikan artikelnya. Untuk melihat detail artikel, cukup mengklik judul artikel atau kata-kata ‘Baca selengkapnya..’ atau kalo di blog lain seringnya berbunyi ‘Read more…’.

Nah… di sini saya akan membahas tuntas mengenai cara membuat sendiri excerpt tersebut dengan PHP dan MySQL. Ide pembuatannya kita contoh saja idenya WordPress. Mudah-mudahan hal ini bisa bermanfaat bagi Anda yang ingin membuat atau mengembangkan CMS buatan sendiri.

Ide membuat excerpt di WordPress adalah penulis artikel diminta menyisipkan semacam tag komentar yang berbunyi <!--more-->. Bagian yang merupakan excerpt adalah paragraf sebelum tag tersebut. Berikut ini adalah contohnya.

<p>ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. </p>
<!--more-->
<p>ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. </p>
<p>ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. </p>

Dalam contoh di atas, bagian yang dianggap excerpt adalah paragraf pertama (sebelum tag <!--more-->)

Cara yang dipakai WordPress untuk membuat excerpt ini lebih simple dibandingkan jika kita membuat komponen input sendiri untuk mengisi excerpt ketika memposting artikel melalui form. Beberapa CMS yang dibuat oleh rekan-rekan saya, maupun mahasiswa seringnya menggunakan form input sendiri ketika membuat excerpt ini. Apalagi dibuat field sendiri dalam tabel database untuk menyimpan data excerpt. Tentu saja ini pemborosan ruang dan energi. Dengan konsep ala WordPress ini, membuat excerpt tidak perlu menulis 2 kali tapi cukup sekali saja karena excerpt terletak dalam isi postingan (artikel) juga. Jadi cukup menandai saja bagian excerptnya dengan suatu tag tertentu.

Selain itu ide excerpt yang digunakan WordPress ini cukup luar biasa, karena cukup menandai suatu postingan namun tanda ini tidak akan kelihatan ketika tampil di browser. Hal ini dikarenakan tanda itu berupa tag komentar di HTML yang secara umum berbentuk <!-- komentar -->. Oleh karena itu, sebenarnya Anda boleh membuat tanda excerpt sendiri selain <!--more--> misalnya <!--cuplikan--> atau <!--excerpt--> dll.

OK… sekarang kita fokus lagi ke cara pembuatan script untuk excerptnya. Berikut ini adalah contoh tampilan script excerpt yang nanti akan kita coba buat.

membuat excerpt sendiri dengan php dan mysql

Gambar di atas adalah tampilan daftar artikel berisi judul, nama penulis (author), tanggal publikasi, jumlah berapa kali dilihat/dibaca oleh pengunjung, dan juga… excerptnya.

membuat excerpt sendiri dengan php dan mysql

Gambar di atas menampilkan full artikel ketika salah satu artikel diklik ‘Baca Selengkapnya…’.

Untuk membuat script sesuai tampilan di atas, pertama kita siapkan dahulu tabel database untuk menyimpan data artikelnya. Kita misalkan tabelnya berstruktur sbb:

CREATE TABLE `artikel` (
  `idArtikel` int(11) auto_increment,
  `title` varchar(30),
  `content` text,
  `author` varchar(30),
  `datePub` date,
  `views` int(11),
  PRIMARY KEY  (`idArtikel`)
);

Selanjutnya berikut ini contoh data artikelnya:

INSERT INTO `artikel` 
VALUES ('1', 'Title Artikel 1', '<p>ini adalah isi artikel 1. ini adalah isi artikel 1. 
ini adalah isi artikel 1. ini adalah isi artikel 1. 
ini adalah isi artikel 1. ini adalah isi artikel 1. 
ini adalah isi artikel 1. ini adalah isi artikel 1.</p>
<!--more-->
<p>ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. 
ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. 
ini adalah isi artikel 1. ini adalah isi artikel 1. </p>
<p>ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. 
ini adalah isi artikel 1. ini adalah isi artikel 1. ini adalah isi artikel 1. 
ini adalah isi artikel 1. ini adalah isi artikel 1. </p>', 'Rosihan Ari', '2010-01-20', '0');
INSERT INTO `artikel` 
VALUES ('2', 'Title Artikel 2', '<p>ini adalah isi artikel 2. ini adalah isi artikel 2. 
ini adalah isi artikel 2. ini adalah isi artikel 2. 
ini adalah isi artikel 2. ini adalah isi artikel 2. 
ini adalah isi artikel 2. ini adalah isi artikel 2. </p>
<!--more-->
<p>ini adalah isi artikel 2. ini adalah isi artikel 2. ini adalah isi artikel 2. 
ini adalah isi artikel 2. ini adalah isi artikel 2. ini adalah isi artikel 2. 
ini adalah isi artikel 2. ini adalah isi artikel 2. </p>
<p>ini adalah isi artikel 2. ini adalah isi artikel 2. ini adalah isi artikel 2. 
ini adalah isi artikel 2. ini adalah isi artikel 2. ini adalah isi artikel 2. 
ini adalah isi artikel 2. ini adalah isi artikel 2. </p>', 'Rosihan Ari', '2010-01-21', '0');

Dalam membuat scriptnya, mula-mula kita buat dahulu script untuk koneksi ke db mysqlnya.

koneksi.php

<?php
// koneksi ke mysql
$dbHost = "localhost";
$dbUser = "...";
$dbPass = "...";
$dbName = "...";
mysql_connect($dbHost, $dbUser, $dbPass);
mysql_select_db($dbName);
?>

Script koneksi.php tersebut nantinya kita includekan ke semua script yang di dalamnya terdapat query SQL terhadap tabel di MySQL.

Script berikutnya yang kita buat adalah script index.php. Script ini nanti akan menampilkan daftar artikel yang berisi judul, author, tanggal publikasi, dan excerptnya, sekaligus link untuk membaca artikel full nya.

Untuk membuat excerpt nya cukup mudah yaitu idenya hanya dengan memecah string dari isi artikel menggunakan explode() berdasarkan substring <!--more--> nya. Anda bisa lihat penjelasan tentang explode() dan contoh penggunaannya di sini. Kita tahu bahwa hasil explode() berdasarkan karakter atau substring tertentu pada suatu string adalah suatu array. Nah… karena excerpt ini terletak sebelum substring <!--more--> maka, bagian excerpt ini adalah elemen pertama (elemen ke-0) dari array hasil explode().

index.php

<?php
// lakukan koneksi ke mysql
include "koneksi.php";
?>

<h1>Daftar Artikel</h1>

<?php
// query untuk membaca data artikel yg diurutkan berdasarkan id artikel
$query = "SELECT * FROM artikel ORDER BY idArtikel";
$hasil = mysql_query($query);
while ($data = mysql_fetch_array($hasil))
{
  // tampilkan title artikel
  echo "<h3>".$data['title']."</h3>";

  // tampilkan tanggal pub, author dan berapa kali dibaca
  echo "<p><small>Tanggal publikasi: ".$data['datePub'].". Penulis: ".$data['author'].". Dibaca: ".$data['views']." kali</small></p>";

  // lakukan exploding terhadap isi artikel berdasarkan string <!--more-->
  $pecah = explode("<!--more-->", $data['content']);

  // excerpt adalah elemen pertama (index ke-0) dari array hasil exploding 
  $excerpt = $pecah[0];

  // tampilkan excerpt
  echo "<p>".$excerpt."</p>";

  // link untuk baca selengkapnya. Gunakan id artikel sebagai parameternya
  echo "<p><a href='view.php?id=".$data&#91;'idArtikel'&#93;."'>Baca selengkapnya...</a></p>";
  echo "<hr>";
}
?>

Selanjutnya kita buat script view.php untuk menampilkan full artikelnya. Di dalam script ini, selain menampilkan full artikel juga terdapat bagian untuk proses update jumlah berapa kali artikel dibaca yaitu bertambah satu dari jumlah sebelumnya.

view.php

<?php
// lakukan koneksi ke mysql
include "koneksi.php";

// baca id artikel dari parameter link 'Baca selengkapnya...' dari index.php
$id = $_GET&#91;'id'&#93;;

// update jumlah views (jumlah views bertambah 1 dari sebelumnya) dari artikel 
$query = "UPDATE artikel SET views = views + 1 WHERE idArtikel = '$id'";
mysql_query($query);

// baca data artikel berdasarkan id nya
$query = "SELECT * FROM artikel WHERE idArtikel = '$id'";
$hasil = mysql_query($query);
$data  = mysql_fetch_array($hasil);

// tampilkan title artikel
echo "<h3>".$data['title']."</h3>";
// tampilkan tanggal pub, author, dan jumlah views
echo "<p><small>Tanggal publikasi: ".$data['datePub'].". Penulis: ".$data['author'].". Dibaca: ".$data['views']." kali</small></p>";
// tampilkan isi artikel
echo "<p>".$data['content']."</p>";

?>

OK… mudah bukan cara membuatnya? Semoga ada manfaatnya ya 🙂

Tinggalkan Komentar