Membuat Recent Post dan Random Post dengan Thumbnail

 Tutorial wordpress
Membuat Recent Post dan Random Post dengan Thumbnailby Jonoon.Membuat Recent Post dan Random Post dengan ThumbnailMembuat recent post dan random post merupakan salah satu cara yang dapat digunakan untuk meningkatkan page view dan menurunkan bounce rate. Blog yang bagus adalah blog yang memiliki page view yang tinggi dan bounce rate yang rendah. Trik yang saya gunakan untuk meningkatkan page view adalah dengan mengkombinasikan antara recent post dan random post, untuk […]

cara membuat recent post dan random post dengan thumbnailMembuat recent post dan random post merupakan salah satu cara yang dapat digunakan untuk meningkatkan page view dan menurunkan bounce rate. Blog yang bagus adalah blog yang memiliki page view yang tinggi dan bounce rate yang rendah.

Trik yang saya gunakan untuk meningkatkan page view adalah dengan mengkombinasikan antara recent post dan random post, untuk random post diletakkan di halaman home sedangkan recent post diletakkan di halaman single. Tujuannya adalah agar pengunjung bisa melihat lebih banyak lagi judul post yang ada di blog. Kalau misalnya recent post di letakkan di home, tentu saja ini tidak akan memancing pengunjung untuk mengkliknya, karena di halaman home itu sudah otomatis ada recent post jadi untuk apa menambahkan recent post lagi di sidebar, alternatifnya adalah random post.

Dengan menambahkan thumbnail pada recent post dan random post itu tentu akan menjadi daya tarik tersendiri, karena setiap judul post nantinya akan memiliki gambar. Berbeda jika hanya link judul post yang ditampilkan akan tetapi pengunjung akan lebih tertarik dengan adanya gambar/thumbnail.

Cara membuat recent post dan random post dengan thumbnail ala kaplik.com

Sebelumnya telah dibahas mengenai cara membuat post thumbnail di wordpress, jadi untuk theme yang belum support thumbnail baca terlebih dahulu artikel sebelumnya ya.

Berikut ini adalah kode/script yang digunakan untuk menampilkan recent post dan random post dengan thumbnail.

<div id="sidebarkaplik">
<?php if (is_single()) {
$posts_widget_title = 'Recent Posts';
} else {
$posts_widget_title = 'Random Posts'; } ?>
<div class="widget">
<h2><?php echo $posts_widget_title; ?></h2>
<ul>
<?php if (is_single()) {
$posts = get_posts('numberposts=8&orderby=post_date');
} else {
$posts = get_posts('numberposts=7&orderby=rand'); }
foreach($posts as $post) {
echo '<li>';
if ( has_post_thumbnail() ) {
the_post_thumbnail();
} else {
echo '<img src="http://i1147.photobucket.com/albums/o553/jonobones/thumbnaildefault.png" alt="'.get_the_title().'" class="wp-post-image"/>'; }
setup_postdata($post);
echo '<a href="' . get_permalink() . '">' . get_the_title() . '</a>';
echo '</li>'; }
$post = $posts[0]; ?>
</ul> </div>

Letakkan kode diatas pada sidebar.php, posisikan letaknya sesuai selera dan kebutuhan.

Kemudian tambahkan kode CSS berikut pada stylesheet.css agar tampilannya tidak berantakan.

#sidebarkaplik .widget img{
height:30px;
width:30px;}

#sidebarkaplik{
width:auto 0;
line-height:auto;
overflow:hidden;margin:1px;
padding:2px}

#sidebarkaplik li {
border-bottom: 1px dashed #C3C1C1;
height: 40px;
line-height: 1.4em;
list-style: none outside none;
padding: 3px 4px 2px 4px;}

#sidebarkaplik .widget h2{
background:#FFF;
border:1px solid #ccc;
font-style:normal;
padding:5px 2px 5px 7px;
margin:0 auto}

Kelemahan dari cara ini:

  • Harus dilakukan set featured image manual untuk tiap-tiap postingan, kalau tidak dilakukan hanya gambar thumbnail default yang akan muncul.
  • Kode untuk menampilkan recent post dan random post tidak berfungsi jika anda letakkan di dalam widget, karena kode tersebut menggunakan php dengan conditional tag maka dari itu harus diletakkan pada file php, contohnya di sidebar.php.

Untuk cara membuat recent post dan random post dengan thumbnail ala kaplik.com cukup sekian, jika ada kekurangannya mohon diperbaiki, Correct me if I’m wrong (CMIIW).

Author: 

Saya adalah pemilik Kaplik.Com, Tujuan saya menulis adalah untuk berbagi pengetahuan maupun pengalaman kepada semua pembaca. Buat yang ingin tanya-tanya bisa langsung Contact ke Google +1, atau bisa melalui facebook. Thanks...

17 Responses

Leave a Reply