Filter hooks WordPress bandel dan tidak bisa mengubah link readmore secara langsung. Gimana dong caranya agar tetap bisa merubah link text itu secara dinamis terhadap seluruh komponen dalam website?
Pernah coba ganti teks “Read More” via functions.php pakai filter hook bawaan WordPress (seperti excerpt_more atau the_content_more_link), tapi teksnya tetep kekeh enggak berubah?
Masalah ini biasanya terjadi karena theme, page builder, atau grid plugin yang kamu pakai mencetak tag HTML <a class="more-link"> secara hardcoded atau menggunakan fungsi internal mereka sendiri yang mengabaikan filter standar WordPress.
Kalau opsi filter hooks biasa sudah tidak mempan, berikut 2 cara paling ampuh untuk memaksa teks tersebut berubah atau hilang total.
Solusi 1: Menggunakan JavaScript / jQuery (Paling Cepat & Manjur)
Cara paling praktis adalah mencegat tag HTML tersebut begitu halaman selesai dimuat di browser (client-side). Karena elemen <a class="more-link"> sudah terlanjur dirender oleh theme, kita ubah isinya langsung menggunakan JavaScript.
Tambahkan snippet berikut di bagian paling bawah file functions.php tema aktif kamu:
PHP
add_action( 'wp_footer', function() {
?>
<script>
document.addEventListener("DOMContentLoaded", function() {
// Cari semua elemen link dengan class 'more-link'
const moreLinks = document.querySelectorAll('a.more-link');
moreLinks.forEach(function(link) {
// OPTION A: Jika ingin mengganti teksnya
link.textContent = 'Baca Selengkapnya';
// OPTION B: Jika ingin menghapus tombolnya secara total
// (Hapus tanda '//' pada baris di bawah ini untuk mengaktifkannya)
// link.remove();
});
});
</script>
<?php
}, 999 );
Keunggulan: Sangat ringan, tidak membebani server, dan dipastikan berjalan di level client.
Solusi 2: Menggunakan Output Buffering (Manipulasi Server-Side)
Jika kamu ingin teks tersebut diubah langsung dari server sebelum HTML dikirim ke browser (server-side), kamu bisa memanfaatkan fitur Output Buffering milik PHP.
Teknik ini akan meraba seluruh output HTML halaman dan mengganti teks secara otomatis menggunakan regular expression (regex).
Masukkan kode berikut ke file functions.php:
PHP
add_action( 'wp_loaded', function() {
ob_start( function( $buffer ) {
// Mengganti teks 'Read more' spesifik di dalam elemen class 'more-link'
$buffer = preg_replace(
'/(<a[^>]*class="[^"]*more-link[^"]*"[^>]*>)Read more(<\/a>)/i',
'${1}Baca Selengkapnya${2}',
$buffer
);
return $buffer;
});
});
Keunggulan: Teks langsung berubah di struktur HTML mentah dari server, sehingga bagus untuk kustomisasi yang tidak ingin bergantung pada eksekusi JavaScript di browser pengunjung.
Kesimpulan
- Gunakan Solusi 1 jika kamu ingin cara serbaguna yang aman dan gampang di-custom (termasuk kalau cuma mau hide/remove elemennya).
- Gunakan Solusi 2 jika kamu ingin hasil perubahan sudah langsung ter-render murni dari sisi server PHP.
Ada kendala teknis terkait WP Project? Atau website wordpressmu ingin dimodifikasi sesuai kebutuhan bisnis sehari-hari? Kontak langsung tim dev kami untuk penanganan segera!
Konsultasi via Whatsapp