Meta Tags (Untuk SEO & Indexing)
Pastikan Anda sudah login ke Dashboard Blogger dan sudah mencadangkan (backup) tema Anda sebelum memulai untuk berjaga-jaga.
Langkah 1: Memasang Meta Tags (Untuk SEO & Indexing)
Langkah ini bertujuan agar blog Anda dikenali oleh Google, Bing, dan Yandex.
Buka menu Tema > klik tanda panah di sebelah "Sesuaikan" > pilih Edit HTML.
Cari kode
<head>(biasanya ada di baris ke-2 atau ke-5).Salin kode di bawah ini dan tempel tepat di bawah kode
<head>tersebut:
<meta content='index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1' name='robots'/>
<meta content='index, follow' name='googlebot'/>
<meta content='index, follow' name='bingbot'/>
<meta content='index, follow' name='yandexbot'/>
<meta content='KODE-VERIFIKASI-GOOGLE-ANDA' name='google-site-verification'/>
<meta content='KODE-VERIFIKASI-BING-ANDA' name='msvalidate.01'/>
<meta content='KODE-VERIFIKASI-YANDEX-ANDA' name='yandex-verification'/>
<link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>
Langkah 2: Memasang CSS (Untuk Desain Tampilan)
Langkah ini agar kotak informasi jumlah kata terlihat rapi dan profesional.
Masih di dalam Edit HTML, cari kode
]]></b:skin>(GunakanCtrl + Funtuk mencari cepat).Salin kode di bawah ini dan tempel tepat di atas kode
]]></b:skin>:
/* Style Info Post Warkasa1919 */
.post-footer-modern {
background: #fdfdfd;
border-left: 5px solid #007bff;
padding: 15px;
margin: 25px 0;
border-radius: 8px;
display: flex;
font-family: sans-serif;
color: #444;
font-size: 14px;
box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}
.post-stats i { margin-right: 8px; color: #007bff; }
.post-stats span { font-weight: bold; }
Langkah 3: Memasang Fitur Otomatis di Setiap Postingan
Ini adalah langkah inti agar fitur muncul otomatis di semua artikel tanpa perlu pasang satu per satu.
Cari kode
<data:post.body/>.Tips: Jika ada lebih dari satu, biasanya yang benar adalah yang berada di dalam baris kode yang panjangnya mirip seperti ini:
<b:includable id='post' var='post'>.
Salin kode di bawah ini dan tempel tepat di bawah kode
<data:post.body/>:
<footer class='post-footer-modern'>
<div class='post-stats'>
<i class='fa fa-pencil-square-o'/> <span id='wordCount'>...</span> kata |
<i class='fa fa-clock-o'/> <span id='readTime'>...</span> menit baca
</div>
<script type='text/javascript'>
//<![CDATA[
window.addEventListener('DOMContentLoaded', (event) => {
const postBody = document.querySelector('.post-body');
if (postBody) {
const text = postBody.innerText.trim();
const words = text.split(/\s+/).length;
const time = Math.ceil(words / 200);
document.getElementById('wordCount').innerText = words.toLocaleString();
document.getElementById('readTime').innerText = time;
}
});
//]]>
</script>
</footer>
Klik ikon Simpan (diskette) di pojok kanan atas.
Cek Hasilnya
Buka salah satu artikel lama Anda di warkasa1919.com.
Lihat di bagian bawah artikel, seharusnya sekarang muncul kotak info jumlah kata dan durasi baca secara otomatis.
Jangan lupa ganti tulisan
KODE-VERIFIKASI-...di Langkah 1 dengan kode asli dari Google Search Console/Bing jika Anda sudah memilikinya.
