Cara Membuat Featured Post (Produk) SEO Friendly di Halaman Depan

Baca Juga

Featured Post Gambar  atau Featured Produk (untuk toko online) di Halaman Depan Blog ini disebut SEO Friendly karena tanpa Javascript, tapi menggunakan kode CSS & HTML, jadinya kenceng (fast loading).

Kebanyakan widget Featured Post untuk blog menggunakan skrip sehingga memperlambat tampilan blog dan mengurangi skor seo.

Featured Post berikut ini cocok sekali buat blog toko online yang biasa menampilkan produk di halaman depan atau di sidebar. Blog bukan toko online juga bisa membuatnya untuk menampilkan posting yang jadi andalan di halaman depan.

Penampakannya seperti ilustrasi posting ini. DEMO atau contoh penerapannya bisa di lihat di CB Blogger Lab.

Cara Membuat Featured Post (Produk) SEO Friendly

Untuk memasang Featured Post/Produk di halaman depan bagian atas harus dipastikan dulu bahwa ada widget di atas Blog Post. Setting "Yes" di dalam template Anda di bagian seperti ini:

<div id='content-wrapper'>
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='yes'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>
</div>

1. Layout > Add a Gadget > HTML/Javascript.

<div align="left">
<table border="0" cellpadding="4" cellspacing="16" width="300" bgcolor=""><tbody>

<tr><td><center><a href="POST URL 1" rel="nofollow"><img border="0" alt="POST TITLE" width="130" src="POST IMAGE URL" height="130"/></a></center></td>

<td><center><a href="POST URL 2" rel="nofollow"><img border="0" alt="POST TITLE" width="130" src="POST IMAGE URL" height="130"/></a></center></td>

<td><center><a href="POST URL 3" rel="nofollow"><img border="0" alt="POST TITLE" width="130" src="POST IMAGE URL" height="130"/></a></center></td>

<td><center><a href="POST URL 4" rel="nofollow"><img border="0" alt="POST TITLE" width="130" src="POST IMAGE URL" height="130"/></a></center></td>
</tr></tbody></table></div>

Keterangan:

• POST URL = Url link Posting
• POST TITLE = Judul Posting
• POST IMAGE URL = Url link gambar yang ditampilkan.

2. Save!

Kode di atas juga bisa digunakan jika Anda ingin menampilkan gambar berdampingan sejajar di posting blog, misalnya seperti ini:

Cantik 'kan laptopnya? :)

Tentu saja Cara Membuat Featured Post (Produk) SEO Friendly ini bisa diterapkan juga di Sidebar atau di mana saja. Tinggal atur aja ukurannya disesuaikan dengan area yang tersedia.

Butuh kode lainnya? Sini aja: W3SCHOOL. Kode di atas juga CB utak-atik dari sana. Good Luck!