Script PHP Menghitung Jumlah Kata dan Karakter pada Input Textarea (Validasi Backend)
Dalam membangun aplikasi web seperti blog, sistem komentar, atau formulir pendaftaran, seringkali kita perlu membatasi panjang teks yang dikirimkan pengguna.
Contoh kasus nyata:
- Twitter (X): Membatasi cuitan hingga 280 karakter.
- SEO Tools: Meta description yang optimal sebaiknya di bawah 160 karakter.
- Sistem Esai: Pendaftaran beasiswa yang mewajibkan esai minimal 500 kata.
Banyak pemula hanya mengandalkan JavaScript untuk menghitung kata secara real-time. Namun, validasi JavaScript bisa dimatikan oleh pengguna. Oleh karena itu, validasi sisi server (Server-Side) menggunakan PHP adalah benteng terakhir dan terpenting untuk memastikan data yang masuk ke database sesuai aturan.
Pada tutorial ini, kita akan membuat alat sederhana namun powerful untuk menghitung jumlah kata dan karakter dari input textarea menggunakan PHP.
Logika Dasar PHP String Functions
Sebelum masuk ke kode lengkap, mari kita pahami dua fungsi inti PHP yang akan kita gunakan:
strlen($string): Fungsi ini digunakan untuk menghitung jumlah total karakter (termasuk spasi dan tanda baca).str_word_count($string): Fungsi spesifik untuk menghitung jumlah kata yang dipisahkan oleh spasi.
Langkah 1: Membuat Struktur HTML (Formulir)
Kita membutuhkan antarmuka sederhana yang terdiri dari sebuah textarea dan tombol submit. Kita juga akan menambahkan sedikit CSS agar tampilannya modern.
Buat file baru bernama counter.php dan salin kode berikut:
PHP<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>PHP Word & Character Counter</title>
<style>
body { font-family: 'Segoe UI', sans-serif; background: #f4f6f9; padding: 20px; }
.container { max-width: 600px; margin: 0 auto; background: #fff; padding: 30px; border-radius: 8px; box-shadow: 0 4px 10px rgba(0,0,0,0.1); }
h2 { text-align: center; color: #333; }
textarea { width: 100%; height: 150px; padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 16px; margin-bottom: 15px; resize: vertical; box-sizing: border-box;}
button { background: #007bff; color: #fff; border: none; padding: 12px 25px; border-radius: 4px; cursor: pointer; font-size: 16px; transition: 0.3s; }
button:hover { background: #0056b3; }
.result-box { margin-top: 20px; padding: 15px; background: #e9ecef; border-left: 5px solid #007bff; border-radius: 4px; }
.stat-item { display: inline-block; margin-right: 20px; font-weight: bold; color: #555; }
.stat-value { font-size: 20px; color: #007bff; }
</style>
</head>
<body>
<div class="container">
<h2>📝 Penghitung Kata & Karakter PHP</h2>
<form method="post" action="">
<textarea name="teks_input" placeholder="Ketik atau tempel teks Anda di sini..."><?php echo isset($_POST['teks_input']) ? htmlspecialchars($_POST['teks_input']) : ''; ?></textarea>
<br>
<button type="submit" name="hitung">Hitung Sekarang</button>
</form>
<!-- AREA HASIL AKAN MUNCUL DI SINI (Lihat Langkah 2) -->
</div>
</body>
</html>
Langkah 2: Menambahkan Logika PHP
Sekarang, mari kita sisipkan logika PHP di dalam file yang sama (di bawah tag </form>). Kode ini akan berjalan ketika tombol ditekan.
PHP<?php
if (isset($_POST['hitung'])) {
// 1. Ambil data dari input
$teks = $_POST['teks_input'];
// 2. Bersihkan spasi berlebih di awal/akhir (Opsional tapi disarankan)
$teks_bersih = trim($teks);
// 3. Validasi Keamanan: Mencegah XSS jika teks ditampilkan kembali
// Meskipun di sini kita hanya menghitung, best practice adalah selalu waspada.
// 4. Proses Hitung
// Menghitung Karakter (termasuk spasi)
$jumlah_karakter = strlen($teks);
// Menghitung Karakter (tanpa spasi - opsional)
$karakter_tanpa_spasi = strlen(str_replace(' ', '', $teks));
// Menghitung Kata
// Jika string kosong, set kata jadi 0 (karena str_word_count kadang menghitung string kosong sbg 1 di versi lama)
if(empty($teks_bersih)){
$jumlah_kata = 0;
} else {
$jumlah_kata = str_word_count($teks);
}
// 5. Tampilkan Hasil
echo '<div class="result-box">';
echo '<div class="stat-item">Kata: <br><span class="stat-value">' . number_format($jumlah_kata) . '</span></div>';
echo '<div class="stat-item">Karakter (Total): <br><span class="stat-value">' . number_format($jumlah_karakter) . '</span></div>';
echo '<div class="stat-item">Karakter (No Spasi): <br><span class="stat-value">' . number_format($karakter_tanpa_spasi) . '</span></div>';
echo '</div>';
// Bonus: Validasi Sederhana
if ($jumlah_karakter > 280) {
echo '<p style="color:red; margin-top:10px;">⚠️ Peringatan: Teks melebihi batas tweet Twitter (280 karakter).</p>';
}
}
?>
Bedah Teknis: Masalah Multibyte (Karakter Khusus & Emoji)
Agar artikel ini benar-benar High Value dan membedakan Anda dari tutorial dasar lainnya, kita harus membahas kelemahan fungsi standar strlen().
Fungsi strlen() menghitung byte, bukan karakter visual.
- Huruf “A” = 1 byte.
- Emoji “😊” = 4 byte.
Jika user memasukkan emoji, strlen() akan menghitungnya sebagai 4 karakter, padahal secara visual hanya 1.
Solusi Profesional: Gunakan mb_strlen().
Jika server Anda mendukung ekstensi mbstring, gunakan kode ini untuk hasil yang lebih akurat:
PHP// Ganti strlen($teks) dengan ini:
$jumlah_karakter_akurat = mb_strlen($teks, 'UTF-8');
Tips: Sertakan informasi ini di artikel Anda untuk menunjukkan keahlian teknis.
Perbedaan PHP (Server) vs JavaScript (Client)
Penting untuk menjelaskan kepada pembaca kapan harus menggunakan script ini:
- JavaScript: Digunakan untuk User Experience (UX). Pengguna melihat angka berubah saat mereka mengetik (Real-time).
- PHP: Digunakan untuk Validasi Data. Sebelum data disimpan ke MySQL, PHP harus menghitung ulang untuk memastikan pengguna tidak mematikan JavaScript atau memanipulasi data via Inspect Element.
Aplikasi yang baik menggunakan keduanya. JavaScript untuk kenyamanan, PHP untuk keamanan.
Kesimpulan
Membuat penghitung kata dengan PHP sangatlah mudah, namun peranannya sangat vital dalam menjaga integritas data di aplikasi web Anda. Dengan memahami fungsi strlen dan str_word_count, Anda bisa membangun fitur validasi form yang kuat.
Script di atas dapat Anda kembangkan lebih lanjut, misalnya untuk menghitung kepadatan kata kunci (Keyword Density) untuk keperluan tool SEO buatan sendiri.
Selamat mencoba dan pastikan validasi backend Anda selalu aktif!