GalaPos ID, Pandeglang.
Tampilan blog yang rapi bukan hanya soal estetika, tetapi juga berpengaruh terhadap kenyamanan pembaca dan optimasi mesin pencari (SEO).
Salah satu cara yang masih banyak digunakan oleh pengguna Blogger adalah menampilkan artikel terbaru berdasarkan label tertentu lengkap dengan thumbnail di bagian bawah postingan.
"SEO bukan cuma soal mengejar Google. Kalau pembaca sendiri bingung mencari artikel terkait, siapa sebenarnya yang sedang dimanjakan?"
Baca juga:
- Puting Berdarah Jangan Dianggap Sepele, Bisa Jadi Tanda Kanker Payudara
- Kematian Tahanan dan Isu Ponsel di Lapas Labuhanruku Picu Aksi Ratusan Warga
- IHSG Anjlok 34,74 Persen, OJK Klaim Tekanan Pasar Mulai Mereda
Gala Poin:
1. Widget label dengan thumbnail membantu menampilkan artikel terbaru berdasarkan kategori tertentu di bagian bawah postingan.
2. Script yang digunakan telah mendukung standar HTML5 sehingga aman dipasang pada template Blogger modern.
3. Selain mempercantik tampilan blog, widget ini meningkatkan internal linking, pengalaman pengguna, dan potensi optimasi SEO.
Widget ini dirancang untuk menampilkan daftar artikel terbaru dari kategori yang dipilih sehingga memudahkan pengunjung menemukan konten yang masih berkaitan. Selain meningkatkan pengalaman pengguna (user experience), fitur tersebut juga membantu memperkuat internal linking yang disukai mesin pencari.
Script yang digunakan dalam tutorial ini telah mendukung standar HTML5, sehingga relatif aman dipasang pada template Blogger modern tanpa menimbulkan error akibat validasi kode.
Widget ini sangat cocok diterapkan pada blog bertema magazine, portal berita, maupun blog pribadi yang memiliki banyak kategori artikel.
Cara Memasang Widget Label dengan Thumbnail di Blogger
1. Masuk ke Dashboard Blogger
Login ke akun Blogger, kemudian buka menu Tema (Template) lalu pilih Edit HTML.
Baca juga:
INI Kota Semarang Perkuat Aksi Kemanusiaan, Donor Darah Bantu Jaga Ketersediaan Stok Darah
2. Tambahkan CSS
Cari kode:
</style>
atau
</b:skin>
Kemudian letakkan kode CSS yang tersedia tepat di atasnya.
(Gunakan kode CSS sesuai tutorial asli.)
3. Tambahkan Kerangka Widget
Cari kode:
<b:section class='main' id='main' showaddelement='no'>
Lalu kecilkan (collapse) bagian tersebut hingga menjadi:
<b:section class='main' id='main' showaddelement='no'>...</b:section>
Setelah itu, letakkan kerangka widget tepat di bawahnya sesuai kode pada tutorial.
4. Tambahkan Script JavaScript
Cari kode:
</head>
Kemudian tempelkan script JavaScript yang tersedia tepat di atasnya.
Script ini berfungsi mengambil artikel terbaru berdasarkan label yang dipilih beserta thumbnail dan tanggal publikasinya.
5. Tambahkan Script Pendukung
Cari kode:
</body>
Lalu letakkan script jQuery yang tersedia tepat di atasnya.
Script tersebut akan mengubah ukuran thumbnail agar tampil lebih besar dan proporsional pada halaman.
Baca juga:
Peti Jenazah Ayatollah Ali Khamenei Diarak, Dunia Soroti Masa Depan Politik Iran
6. Simpan Template
Setelah seluruh kode berhasil dipasang, simpan perubahan template Blogger.
7. Tambahkan Gadget Baru
Masuk ke menu Tata Letak, kemudian pilih Tambahkan Gadget → HTML/JavaScript.
Masukkan script pemanggil widget yang tersedia pada tutorial.
Perhatikan bagian berikut:
Black
Kata tersebut merupakan nama label artikel. Gantilah sesuai label yang ingin ditampilkan pada blog Anda.
8. Sesuaikan Ukuran Thumbnail
Apabila ukuran gambar dirasa terlalu kecil atau terlalu besar, pengaturannya dapat dilakukan melalui kode CSS pada langkah kedua agar sesuai dengan lebar template blog.
Dengan mengikuti langkah-langkah tersebut, widget artikel berdasarkan label akan muncul otomatis di bagian bawah setiap postingan dan menampilkan artikel terbaru sesuai kategori yang telah ditentukan.
Baca juga:
Dari Bandung ke Dunia: Diplomasi, AI, dan Anak Muda Jadi Sorotan Festival KAA 2026
Percuma nulis ratusan artikel kalau pengunjung cuma mampir satu halaman. Blog bukan kos-kosan, pembaca jangan dibiarkan cepat angkat kaki.
#GalaPosID #MediaPublikasiIndonesia #Blogger #TutorialBlogger #SEO #WidgetBlogger #BloggingIndonesia
.jpg)

