Cara Membuat Last Post List Lebih Dinamis

Custom Recent Post
Custom Recent Post

Up, mari kita kembali ke WordPress. Dan karena kita akan sama sama kembali. Mari kita ke 2.7 ;) Tips WordPress kali ini berhubungan dengan list recent post, latest post, atau postingan terakhir.

Tutorial WordPress kali ini, kembali menuntun anda untuk olah pikiran dan juga perasaan dengan Code Editor dan juga beberapa baris Code PHP dan juga CSS. Saya akan mencoba menerangkan segamblang mungkin seperti seorang Hacker memandang Sistem Operasi Jendela. ;) Saya berharap kembali. Ini tuorial bermanfaat bagi saya pribadi dan bagi blogger sekalian. Intinya tips kali ini, kita bisa listing 10 posting terakhir kita yang mana bisa kita taruh di sidebar atau di footer. Dan menambah efek dinamis. Dimana ketika listing ini berada dihalaman utama. Maka list dari latest post/postingan terakhir kita akan melist 10 posting terakhir dikurangi post yang sudah tayang di standar looping blog kita.

Seperti kita tahu dan anda juga tahu kalau Cak Matt sebenarnya sudah menyertakan fungsi yang menarik juga untuk list postingan terakhir kita, yaitu dengan kode seperti ini

< ?php wp_get_archives('type=postbypost&amp;limit=10');?>

Dimana kode itu akan membuat list 10 postingan terakhir kita dengan tampilan ala kadarnya hanya berupa Judul aja, sekarang kita bisa oleh lebih dengan custom code yang akan saya bagi ini dan bisa menambah parameter lain seperti tanggal. dan juga menambah pagination.

Pertamax

Buka sidebar.php atau footer.php (salah satu aja, jika anda ingin tampil di sidebar, buka file sidebar, jika ingin di footer buka file footer)

Setelah terbuka cari lahan kosong, usahakan lahan kosong yang tidak akan merusak tampilan. Kemudian tambahkan kode ini

<div class="last">
<h3><span>Postingan Terakhir</span></h3>
<ul class="recent">
< ?php
if(is_home()):
$postoff = '&amp;offset=5';
else:
$postoff = '';
endif;
$temp = $wp_query;
$wp_query= null;
$wp_query = new WP_Query();
$wp_query->query('showposts=10'.'&amp;paged='.$paged.$postoff);
?>
< ?php while ($wp_query->have_posts()) : $wp_query->the_post(); ?>
<li><a href="<?php the_permalink() ?>" rel="bookmark">< ?php the_title(); ?></a> < ?php the_time('d m'); ?></li>
< ?php endwhile; ?>
</ul>
< ?php if($postoff =='&amp;offset=5'): ?>
<div class="navigation">
<div class="alignleft">< ?php previous_posts_link('&amp;laquo; Previous') ?></div>
<div class="alignright">< ?php next_posts_link('More &amp;raquo;') ?></div>
</div>
< ?php endif; ?>
< ?php $wp_query = null; $wp_query = $temp;?>
<br class="clear" />
</div>

Langkah diatas kita akan membuat custom loop, dimana saya menambahkan sedikit statemen JIKA, dimana JIKA posisi halaman ada di halaman utama akan membuat parameter yang $postoff yang terpanggil akan bernilai &offset=5 dan akan bernilai KOSONG jika tidak pada halaman utama.

Hal penting lain adalah anda harus merubah parameter offset, dimana pada blog saya bernilai 5 karena saya hanya menampilkan 5 posting terakhir pada looping saya, jika anda menampilkan 10, maka ganti 10.

Keduax

Kemudian Buka juga file style.css dan tambahkan kode ini pada akhir code tersebut

ul.recent {
list-style: none;
margin-left: 0;
padding-left: 0;
background: #ccc
}
.recent li {
display: block;
color:#777;
font-size:0.9em;
float: left;
text-align: right;
width: 310px;
line-height: 22px;
border-bottom: 1px solid #ccc;
}
.recent li a {
font-size:1em;
font-weight: bold;
float: left;
text-align: left;
}

Kode CSS diatas adalah kode standard saya untuk membuat tampilan seperti di FOOTER saya ini, Jika anda mau explore silahkan saja.

Sekali lagi terima kasih sudah mau membaca, jika anda merasa nyaman silahkan berlangganan RSS saya dan tentu saja bantu saya menyebarkan artikel yang semoga bermanfaat ini. Jabat Erat dan Jabat WordPress :D

55 thoughts on “Cara Membuat Last Post List Lebih Dinamis
  1. kalo mau nampilin gambar thumbnail pada 1 posting terbaru gimana mas? kayak punya hizbutahrir,

    mohon pencerahan, . . . sekalian scriptnya
    terima kasih bantuannya

Please Post Your Comments & Reviews

Your email address will not be published. Required fields are marked *

*
*