Mengenal Kode Widget Sidebar WordPress
Tak kenal maka tak sayang, ungkapan itu mungkin sudah begitu melekat di telinga kita. Jika kita tidak mengerti atau memahami sesuatu hal/benda maka kita tidak akan tahu arti sebenarnya dan tidak dapat menghargai hal/benda tersebut. Demikian juga halnya dalam dunia blogging. Untuk pemilik blog khususnya wordpress juga harus mengenal lebih jauh dan lebih detail fitur-fitur yang ada di dalamnya termasuk kode-kode yang digunakan. Memang sudah tersedia plugin yang cukup banyak, tinggal pilih install dan beres semua urusan tanpa capek harus belajar coding. Untuk yang baru mengenal blog mungkin pernyataan itu bisa dimaklumi, tapi untuk yang sudah cukup lama ngeblog, apakah kita akan tergantung terus menerus dengan plugin jika kita bisa mengoptimalkannya tanpa plugin?. Maka sedikit meluangkan waktu untuk belajar mengenal kode-kode wordpress adalah langkah yang tepat.
Belajar coding memang terkadang membuat pusing tujuh keliling, apalagi seperti saya yang latar belakang pendidikannya adalah ilmu agama (Fakultas Syari’ah) dan pesantren, belajar wordpress benar-benar dari nol. Tapi saya punya pandangan tak kenal maka tak sayang, dan tidak boleh menyerah untuk belajar dan harus berani untuk mencobanya (jangan takut salah). Oleh karenanya belajar coding harus jadi hal yang menyenangkan dan tidak harus jadi beban, supaya kita betul-betul bisa enjoy dalam prosesnya, masalah hasil bisa kita evaluasi dan kita perbaiki.
Ok, tidak berpanjang lebar basa basinya berikut ini kode-kode yang biasa ada di sidebar wordpress untuk mengelola dan mengatur widget-widget yang ada di sidebar tersebut, untuk yang sudah pakar coding mohon bisa dikoreksi dan ditambahkan kalau ada yang salah.
1. Kode untuk menampilkan Recent Posts atau postingan terbaru.
<?php query_posts('showposts=5'); ?> <ul> <?php query_posts('showposts=5'); ?> </ul><ul> <?php while (have_posts()) : the_post(); ?> <li><a href="<? php the_permalink() ?>"><? php the_title(); ?></a></li> <?php endwhile;?> </ul>
2. Kode untuk menampilkan Recent Comments atau komentar terbaru/terakhir.
<?php global $wpdb; $sql = "SELECT DISTINCT ID, post_title, post_password, comment_ID, comment_post_ID, comment_author, comment_date_gmt, comment_approved, comment_type,comment_author_url, SUBSTRING(comment_content,1,30) AS com_excerpt FROM $wpdb->comments LEFT OUTER JOIN $wpdb->posts ON ($wpdb->comments.comment_post_ID = $wpdb->posts.ID) WHERE comment_approved = '1' AND comment_type = '' AND post_password = '' ORDER BY comment_date_gmt DESC LIMIT 10"; $comments = $wpdb->get_results($sql); $output = $pre_HTML; $output .= "\n<ul>"; foreach ($comments as $comment) { $output .= "\n<li>".strip_tags($comment->comment_author) . " : " ."<a href=\"" . get_permalink($comment->ID) . "#comment-" . $comment->comment_ID . "\" title=\"on " . $comment->post_title . "\">" . strip_tags($comment->com_excerpt) ."</a></li>"; } $output .= "\n</ul>"; $output .= $post_HTML; echo $output;?>
3. Kode untuk menampilkan kategori (categories).
<h2>Categories</h2> <ul> <?php wp_list_cats('sort_column=name'); ?> </ul>
4. Kode untuk menampilkan kategori dengan dropdown menu.
<form action="<?php bloginfo('url'); ?>/" method="get"> <?php $select = wp_dropdown_categories('show_option_none=Select category&show_count=1&orderby=name&echo=0'); $select = preg_replace("#<select([^>]*)>#", "<select$1 onchange='return this.form.submit()'>", $select); echo $select; ?> <noscript><input type="submit" value="View" /></noscript> </form>
5. Kode untuk menampilkan arsip bulanan.
<h2>Archives</h2> <ul> <?php wp_get_archives('type=monthly'); ?> </ul>
6. Menampilkan arsip bulanan dengan dropdown menu.
<select name=\"archive-dropdown\" onChange='document.location.href=this.options[this.selectedIndex].value;'> <option value=\"\"><?php echo attribute_escape(__('Select Month')); ?></option> <?php wp_get_archives('type=monthly&format=option&show_post_count=1'); ?> </select>
7. Menampilkan menu halaman.
<h2>Pages</h2> <ul> <?php wp_list_pages('title_li='); ?> </ul>
8. Menampilkan Gravatar di Recent Comment.
<?php $query = "SELECT * from $wpdb->comments WHERE comment_approved= '1' ORDER BY comment_date DESC LIMIT 0 ,5"; $comments = $wpdb->get_results($query); if ($comments) { echo '<ul>'; foreach ($comments as $comment) { $url = '<a href="'. get_permalink($comment->comment_post_ID).'#comment-'.$comment->comment_ID .'" title="'.$comment->comment_author .' | '.get_the_title($comment->comment_post_ID).'">'; echo '<li>'; echo '<div>'; echo $url; echo get_avatar( $comment->comment_author_email, 20); echo '</a></div>'; echo '<div>'; echo $url; echo $comment->comment_author; echo '</a></div>'; echo '</li>'; } echo '</ul>'; } ?>
9. Menampilkan Admin section atau admin login.
<ul> <?php wp_register(); ?> <li><?php wp_loginout(); ?></li> <li><a href="http://www.wordpress.org/">WordPress</a></li> <?php wp_meta(); ?> <li><a href="http://validator.w3.org/check?uri=referer">XHTML</a></li> </ul>
10. Menampilkan submenu.
<?php $children = wp_list_pages('title_li=&child_of='.$post->ID.'&echo=0');if ($children) { ?><ul> <?php echo $children; ?> </ul> <?php } ?>
11. Menampilkan Tags Cloud.
<?php wp_tag_cloud('smallest=8&largest=22&'); ?>
11. Menampilkan External RSS Feed.
<?php include_once(ABSPATH.WPINC.'/rss.php'); wp_rss('http://m-alwi.com/feed?type=RSS2', 5); ?>
Ganti http://m-alwi.com/feed dengan url feed yang ingin ditampilkan.
12. Menampilkan status Twitter.
<?php $username = "TwitterUsername"; // Nama twitter anda $limit = "5"; // Jumlah tweets yang ingin ditampilkan. /* These prefixes and suffixes will display before and after the entire block of tweets. */ $prefix = ""; // Prefix - Teks atau logo yang ingin ditampilkan sebelum tweets (di awal tweet) ditempatkan di antara tanda dobel kutip $suffix = ""; // Suffix - Teks yang ingin ditampilkan setelah tweets. $tweetprefix = ""; // Tweet Prefix - Teks atau logo yang ingin ditampilkan sebelum tweets (di masing2 tweet) ditempatkan di antara tanda dobel kutip $tweetsuffix = "<br>"; // Tweet Suffix - Teks yang ingin ditampilkan setelah tweet $feed = "http://search.twitter.com/search.atom?q=from:" . $username . "&rpp=" . $limit; function parse_feed($feed, $prefix, $tweetprefix, $tweetsuffix, $suffix) { $feed = str_replace("<", "<", $feed); $feed = str_replace(">", ">", $feed); $clean = explode("<content type=\"html\">", $feed); $amount = count($clean) - 1; echo $prefix; for ($i = 1; $i <= $amount; $i++) { $cleaner = explode("</content>", $clean[$i]); echo $tweetprefix; echo $cleaner[0]; echo $tweetsuffix; } echo $suffix; } $twitterFeed = file_get_contents($feed); parse_feed($twitterFeed, $prefix, $tweetprefix, $tweetsuffix, $suffix); ?>
13. Tidak menampilkan admin di Recent Comment list.
Buka file widgets.php yang ada di folder wp-includes temukan kode berikut ini :
$comments = $wpdb->get_results("SELECT * FROM $wpdb->comments WHERE comment_approved = '1' ORDER BY comment_date_gmt DESC LIMIT $number");
ganti dengan kode berikut ini :
$comments = $wpdb->get_results("SELECT * FROM $wpdb->comments WHERE comment_approved = '1' AND comment_author != 'NAMA ANDA' ORDER BY comment_date_gmt DESC LIMIT $number");
Ganti tulisan ‘NAMA ANDA’ dengan nama admin anda (nama yang ditampilkan).
Referensi : http://codex.wordpress.org/Main_Page, http://wphacks.com, http://wordpress.org/support, http://www.instantshift.com/2009/05/25/10-twitter-hacks-for-your-wordpress-blog
Mau latihan bikin coding disini…
Reply
marsudiyanto Reply:22-08-2010 at 20:56
Saya mau coba yang top commentators tanpa plugin tapi belum bisa Mas
Reply
My Little Princess Reply:23-08-2010 at 11:05
mantap semua dikupas tuntas tentang wordpress
Reply
Bang Iwan Reply:23-08-2010 at 13:24
Sebuah ilmu baru lagi untuk saya.
Reply
Bang Iwan Reply:23-08-2010 at 13:25
Kode2 itu harus saya pelajari….
Reply
Bang Iwan Reply:23-08-2010 at 13:25
mantap sangat Kang…
makasih banyak
Reply
Bang Iwan Reply:23-08-2010 at 13:25
Mohon maaf baru sempat mampir lagi.
Reply
aming Reply:23-08-2010 at 15:25
dapet ilmu…walau pusing 7 keliling nih
Reply
ternyata beda jauh dg Blogspot
Reply
Hybrid car Reply:23-08-2010 at 10:09
Iya jelas bro…lain platform..
Reply
My Little Princess Reply:23-08-2010 at 11:06
ya kitakan cuma blogspot
Reply
Bang Iwan Reply:23-08-2010 at 13:29
Paling tidak bisa belajar toh….
Reply
Bang Iwan Reply:23-08-2010 at 13:29
Makanya cobalah untuk merambah di WP juga.
Reply
My Little Princess Reply:24-08-2010 at 03:59
blogspot aja pusing om , lagian belum punya yang berbayar
Reply
aming Reply:23-08-2010 at 15:26
kenapa ngga coba pindah???
Reply
(Maaf) izin mengamankan PERTAMAX dulu. Boleh, kan?!
Reply
Bang Iwan Reply:23-08-2010 at 13:26
lama baru ketemuan dengan KaNG Alam disini.
Reply
Bang Iwan Reply:23-08-2010 at 13:26
Moga tetap sehat Kang……..
Reply
aming Reply:23-08-2010 at 15:28
kang alam kemana aja….
cuma liat di FB…
Reply
HTML1155 Reply:23-08-2010 at 15:26
HTML1155 izin mampirr….
Reply
sayang hanya untuk WP.org
Reply
My Little Princess Reply:23-08-2010 at 11:11
bener pak nggak bisa untuk gratisan
Reply
Bang Iwan Reply:23-08-2010 at 13:29
kenapa nggak dicoba aja dulu?
Reply
HTML1155 Reply:23-08-2010 at 15:27
iya kang, nasib sesama gretongan…
Reply
pertamax mas alwi…
Reply
Reza Saputra Reply:22-08-2010 at 21:44
loh kok pada nongol diatas saya (doh)
Reply
aming Reply:23-08-2010 at 15:28
anda kurang beruntung,
sama seperti saya…..
Reply
itu kode php bukan html,,, jadi langsung dimasukkan ke style.css ya mas ??
Reply
Alwi Reply:24-08-2010 at 02:15
itu kode dasarnya untuk menggunakannya bisa dimasukkan di file sidebar.php bisa diantara tag div id yg ada
di beberapa theme harus di modifikasi dengan menempatkannya di file functions.php kemudian dipanggil dg kode idnya di file sidebar.php
Reply
lama tidak berkunjung mas
css atau php saya kurang paham bagaimana cara memanfaatkannya
yang penting blogging entah apa yang ditulis juga kurang memahami, makanya blog sepi pengunjung kalau tidak blog walking
selamat menunaikan ibadah puasa
Reply
My Little Princess Reply:23-08-2010 at 11:08
selamat berpuasa juga pak
Reply
Bang Iwan Reply:23-08-2010 at 13:31
Selamat berpuasa untuk semuanya.
Reply
wew..ilmu yg bermanfaat,selamat sahur kang alwi :)
Reply
My Little Princess Reply:23-08-2010 at 11:09
semua yang ada disini sangat bermanfaat pak
Reply
Nice Info maz Alwi, klo tdk kbrtn sekalian minta tolong buat cek loading blog ane, kemaren udah ganti theme. Mohon koreksinya ya . . .
Thnx & Sukses buat mas Alwi . . .
Reply
Alwi Reply:24-08-2010 at 02:35
Mohon maaf nih Mas Arya, kayaknya masih rada berat loadingnya, saya tes pakai IM2 broom 256 kbps waktu loadingnya masih 22 detik, msh terlalu gede juga ukurannya terkirim ke browser 576 kb dan mash banyak resources (http request) 107, punya saya sekarang di halaman depan (home) http-nya (resources) cuman 8 ukurannya seluruh halaman cuman 34 kb terikirm ke browser cuman 12.6 kb wkatu loadingnya 3-4 detik kalau pakai speedy yg 500 kbps cuman 2-3 detik
ntar saya sharing cara menganalisanya pakai firebug dan pagespeed dan cara mengurangi ukuran halaman serta http request spt file css
Reply
Belajar Psikologi Reply:24-08-2010 at 12:30
Sudah pake plugin2 cache, sama compress css tp kok masih berat ya mas? Udah mentok nih ilmunya.hehe Butuh pencerahan dari master blog mas alwi.
Di tunggu mas tips2nya biar tambah wuzzz ky blog mas Alwi.
Reply
Mari kita sama2 untuk berkenalan dengan kode untuk WordPress..
Reply
My Little Princess Reply:23-08-2010 at 11:10
sama-sama belajar pak
Reply