Adakah Cara Ubah Teks ke Audio di Blog WordPress Tanpa Plugin dan Gratis?
Ada. Caranya dengan menggunakan Web Speech API. Salin kode script di akhir artikel ini setelah menulis artikel. Taruh di akhir artikel dengan menambahkan blok baru, lalu pilih Custom HTML. Kemudian pastekan script di bawah ini. Setelah itu klik tombol Update. Lalu, klik tombol Save Draft untuk mengetahui hasilnya sebelum dipublish. Atau klik tombol Publish jika terburu-buru untuk menampilkan langsung ke pengunjung.
Hasilnya akan seperti di artikel ini. Coba klik tombol Dengarkan Artikel di bawah artikel ini.
Hasil benar kan!
Kode ini selain dilengkapi dengan tombol Dengarkan Artikel, juga dilengkapi dengan tombol Hentikan.
Ingat, tanpa plugin, gratis alias free dan ringan.
Selamat mencoba!
Jika artikel ini membantu, jangan lupa share ke teman-teman dan media sosial kalian ya. Dan jika ada masalah tentang ubah teks ke audio ini, jangan sungkan gunakan kolom komentar di bawah ya. Terimakasih.
Jadi apa hubungan teks ke audio dengan Voice Search dan AI Overviews?
Hubungannya adalah saling melengkapi dan memaksimalkan SEO. Fitur audio bikin artikel pakai bahasa lisan. Bahasa lisan ini yang dicari Voice Search dan gampang dibaca AI Overviews buat jawaban.
Ketika blog dipasang fitur audio, penulis terpaksa bikin kalimat yang pendek-pendek dan langsung menjawab masalah. Tujuannya jelas, supaya pas didengar telinga, kalimatnya tidak bikin pusing.
Nah, karakter tulisan yang pendek, padat, dan langsung menjawab masalah ini adalah makanan utama buat Voice Search dan AI Overviews.
Orang kalau pakai Voice Search pasti bicaranya spontan, contohnya bertanya langsung: “Gimana cara benerin mesin cuci bocor?”
AI Overviews juga cara kerjanya mirip. Sistem AI mencari artikel yang punya jawaban langsung dan bahasanya paling gampang dimengerti buat ditaruh di halaman paling atas.
Jadi, hubungan masuk akalnya: bikin fitur audio memaksa artikel jadi lebih enak didengar. Sehingga disukai Voice Search dan AI Overviews karena format bahasanya sudah sama-sama pakai gaya bahasa manusia berbicara sehari-hari. Penulis tidak perlu kerja dua kali buat optimasi SEO On Page.
Ini script kode untuk ubah teks ke audio di WordPress:
<div style=”margin: 15px 0;”>
<button id=”btn-audio” onclick=”kendaliAudio()” style=”padding: 10px 15px; background-color: #0073aa; color: white; border: none; border-radius: 4px; cursor: pointer;”>
Dengarkan Artikel
</button>
</div>
<script>
let suaraSintesis = window.speechSynthesis;
let daftarPotonganTeks = [];
let indeksTeks = 0;
let sedangMemutar = false;
let statusPause = false;
function kendaliAudio() {
const tombol = document.getElementById(‘btn-audio’);
if (!sedangMemutar) {
// Mengambil teks khusus dari area artikel WordPress
const elemenKonten = document.querySelector(‘.entry-content’);
if (!elemenKonten) {
alert(‘Konten artikel tidak ditemukan. Struktur tema WordPress berbeda.’);
return;
}
const seluruhTeks = elemenKonten.innerText;
// Memotong teks menjadi maksimal 150 karakter per bagian agar tidak crash
daftarPotonganTeks = seluruhTeks.match(/[^.!?]+[.!?]+(\s|$)|.+/g) || [seluruhTeks];
indeksTeks = 0;
sedangMemutar = true;
statusPause = false;
tombol.innerText = “Hentikan”;
tombol.style.backgroundColor = “#d9534f”;
putarBagianTeks();
} else {
// Menghentikan suara secara total
suaraSintesis.cancel();
sedangMemutar = false;
tombol.innerText = “Dengarkan Artikel”;
tombol.style.backgroundColor = “#0073aa”;
}
}
function putarBagianTeks() {
if (!sedangMemutar) return;
if (indeksTeks >= daftarPotonganTeks.length) {
const tombol = document.getElementById(‘btn-audio’);
sedangMemutar = false;
tombol.innerText = “Dengarkan Artikel”;
tombol.style.backgroundColor = “#0073aa”;
return;
}
let teksSekarang = daftarPotonganTeks[indeksTeks].trim();
// Lewati jika potongan teks kosong
if (teksSekarang === “”) {
indeksTeks++;
putarBagianTeks();
return;
}
let ucapan = new SpeechSynthesisUtterance(teksSekarang);
ucapan.lang = ‘id-ID’;
ucapan.onend = function () {
indeksTeks++;
putarBagianTeks();
};
ucapan.onerror = function () {
indeksTeks++;
putarBagianTeks();
};
suaraSintesis.speak(ucapan);
}
// Memastikan suara mati jika halaman ditutup atau di-refresh
window.onbeforeunload = function() {
suaraSintesis.cancel();
};
</script>
