Manual: Cara Menampilkan Related Post di WordPress.com Tanpa Plugins


Artikel spesial untuk para blogger motor atau mobil yang ingin menampilkan related post atau posting terkait dengan artikel yang dipostingnya. Sebelumnya mohon maaf jika penyampaiannya kurang jelas atau bikin bingung, maklum blogger newbie super ecek-ecek :mrgreen: Biar gampang, tinggal copy paste saja kode di bawah ini. Tanpa script PHP, tanpa HTML juga bisa, tanpa plugins, gratis. Cukup shortcode saja.

kphmph-wordpress-logo-icon

RELATED POST WordPress.com

WITHOUT PLUGINS

Karena wordpress.com tidak menyediakan fasilitas related post untuk user gratisan-nya, maka kita tak kalah akal juga dengan sedikit modifikasi html dan schortcode wordpress. Meskipun hasilnya kurang maksimal, tapi cukup untuk mengarahkan dan membantu pembaca membaca artikel yang terkait dengan artikel yang sedang ditampilkan.

Related post atau posting terkait di sini memanfaatkan shortcode [ display-posts ] yang mana shortcode ini menampilkan 10 posting terakhir yang telah diterbitkan oleh blog kita. kode ini bisa dimodifikasi.
Di halaman support wordpress http://en.support.wordpress.com/shortcodes/#miscellaneous disebutkan kode

  • [ display-posts ] lets you list posts of a specific category, author, or tag

artinya bisa untuk memunculkan daftar artikel dengan penyaring “category”, “author”, atau “tag” hingga 10 baris posting.
berhubung “category” akan kurang mengena karena masih terlalu umum, di sini kita gunakan “tag” saja yang biasanya berupa tag pendek satu, dua atau beberapa kata.

Cara penggunaannya:
pada artikel atau posting yang telah kita buat pasti ada tag atau kata yang khusus berkaitan dengan topiknya. misal posting honda cb150r pasti akan di tag: cb150r, honda teralis, honda 2012, honda cb150r, konde berkarat, tutup tangki njendul, dsb :P (no offence)
nah dari sini kita ambil saja tag cb150 dan honda teralis (2 kata dan ada spasinya), maka related postnya akan ditulis shortcode:

[ display-posts tag=cb150r ] [ display-posts tag=honda-teralis ]

note:

  1. gunakan tanda strip “-” sebagai pengganti spasi tag kita. setelah tanda [ tidak boleh pakai spasi. sebelum tanda ] boleh pakai spasi boleh tidak pakai.
  2. warna merah pada kode di atas diganti tag posting sesuai posting masing-masing
  3. warna hitam adalah kodenya

Contoh related post:

CARA GAMPANG

biar gak ribet kita cukup gunakan shorcode [ display-posts tag=cb150r ] [ display-posts tag=honda-teralis]

contoh:

RELATED POST

[ display-posts tag=cb150r ] [ display-posts tag=honda-teralis]

Hasilnya:

RELATED POST

Atau biar tidak ada jeda (dalam tema tertentu mungkin ada jeda antara related post 1 dan related post 2) gunakan tanda titik koma ( ; ) pada shortcode seperti di bawah ini:

RELATED POST

[ display-posts tag=cb150r; tag=honda teralis]

RELATED POST

 

CARA RIBET TAMPIL MANIS

tapi agar tampilan sedikit gimana gitu, maka kita pakai HTML untuk menghiasnya.

Contoh:

<!– brought to you by kphmph.wordpress.com –>


Related Post :
[ display-posts tag=cb150r ] [ display-posts tag=tips-motor ]

HASILNYA

<!– brought to you by kphmph.wordpress.com –>


Pada tampilan ini, untuk memodifikasi warna garis dan background related post, maka kita tinggal mengganti HEX code dari kode warna html yang ada di kode related post nya. HEX code bisa dilihat di w3school
http://www.w3schools.com/html/html_colornames.asp

Penggunaan, cukup copy pastekan kode di bawah ini ke bagian bawah setiap posting melalui text mode.

agar lebih gampang pengunaannya, tinggal copy paste kode di bawah ini dan simpan pada notepad di desktop komputer Anda semua

atau copy paste ke mode text post dan simpan sebagai draft. dan gunakan copy post pada dashboard untuk menulis artikel baru dengan terlebih dahulu mencari related post pada search post yg ingin dicopy.

caranya pada pojok kanan atas kode di bawah ini klik “view source” lalu copy kodenya, atau langsung klik “copy to clipboard” kodenya.


<span style="color: #000000;"><!-- brought to you by <a title="marga" href="http://kphmph.wordpress.com">kphmph.wordpress.com</a> --></span></pre>

<hr />

<div></div>
<div>
<table style="border-collapse: collapse;" width="100%" border="0">
<tbody>
<tr style="height: 24px;">
<td style="padding-left: 7px; padding-right: 7px; border-top: solid #9bbb59 1pt; border-left: none; border-bottom: solid #9bbb59 1pt; border-right: none;"><span style="font-family: Cambria;"><strong><em><span style="color: #76923c;">Related Post : </span></em></strong></span></td>
</tr>
<tr style="background: #eeefff none repeat scroll 0 0; height: 96px;">
<td style="padding-left: 37px; padding-right: 7px; border-left: medium none; border-bottom: 1pt solid #9bbb59; border-right: medium none;"> </td>
</tr>
</tbody>
</table>
</div>
<pre>

KEUNTUNGAN PENGGUNAAN

Penggunaan related post pada badan posting (post area) memiliki keuntungan bila dibandingkan related post biasa yaitu jika kita telah terdaftar di google dan menggunakan google webmaster atau google analytic, maka ketika go0gle-b0t mengindex halaman posting kita, b0t tersebut juga akan mengunjungi link related post kita dan mengindex posting related post, dan seterusnya, dan seterusnya. Jadi halaman posting kita selalu di index oleh go0gle-b0t. dan di search engine google blog kita akan mudah ditemukan oleh pemirsa. Bukan SE0 tapi setara kualitasnya. Berani coba?

Itulah sedikit ilmu untuk kita para blogger newbie :cool: . Silakan dishare bagi yang berkenan atau mau digunakan sendiri dan dimodifikasi tampilannya monggo jangan sungkan, tidak ada yang melarang atau akan mengklaim itu bikinan saya, itu dari saya, itu ide saya, atau whatever lah. Biarlah menjadi rahasia umum karena tentu kita ingin bangsa ini maju dan ilmu yang bermanfaat itu tak akan putus pahalanya sampai kiamat tiba. Wallahu a’alam. :D

Semoga bermanfaat.

<!– brought to you by kphmph.wordpress.com hari Jum’at libur dilanjut Sabtu onlinenya ;) –>


About these ads

About Marga

You don't wanna know! About.me/margay About.me/aku
This entry was posted in Blogger Manual, Pengetahuan and tagged , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , . Bookmark the permalink.

43 Responses to Manual: Cara Menampilkan Related Post di WordPress.com Tanpa Plugins

  1. Yoshi says:

    pertamax dulu, ntar ane coba gan

  2. An_Syahri says:

    Mas klo diberanda biar postingan kita tampilnya ga full gimana mas… alias hanya potongan-potongan…?

  3. izin bookmarks aja ya om, udh malem nih, bsk aja ane prakteknya hehe :D btw om tau blogger2 RD4? http://brigade15.wordpress.com/2013/01/04/tentang-stang-jepit/

  4. Motorseo says:

    Ijin buat repost di gubuk ane gann :-) top tutornya ampe nyenggol-nyenggol SEO segala hi hi.. nunggu tips yang lain bro..

  5. Pingback: Cara Membuat Artikel Terkait / Related Post di WordPress.com | Motor SEO

  6. Terima kasih atas informasinya,jangan lupa mampir di http://www.motogp.unsri.ac.id

  7. Boelatuk says:

    keren mas related postnya berfungsi :D

  8. Boelatuk says:

    mohon maaf nambah persualan Gan :D
    bagaimana cara mengganti warna tulisan dari link yang ditampilkan ?
    udah oprek2 tetep item melulu
    ditunggu pencerahannya
    salam kenal & tQ sebelumnya Gan :D

    • marga says:

      untuk related post di sini menggunakan shortcode, jadi perlu shortcode juga (belum ada – oleh wordpress) untuk mengganti warna link related postnya. sedangkan modifikasi html belum bisa menggalahkan kekuatan shortcode, sehingga hanya bulet saja yang berganti warna. untuk link biasa bisa menggunakan theme option atau kode html style="color:#ff6600;" pada kode <a>, contoh
      <a href="http://www.viancom.web.id"; style="color:#ff6600;" rel="nofollow">nama link</a>

  9. campusku2013 says:

    ijin copy gan ilmu nya…masih newbie bgt nih….salam sukses

  10. tevkv says:

    Thanx a lottt ya mass.., ane udah berhasil adopsi ilmunya ^^, Bahkan ngedit nya melalui HP.. keep sharing knowledge ya mas..

  11. tevkv says:

    Thx a lottttt ya mas.. ane langsung bisa adopsi ilmunya tentang related post, keep sharing knowledge ya mas,^,^

  12. Pingback: Jangan Mau Diajak Hidup Susah | enggar adi nugroho's Blog

  13. mfadhillah says:

    terima kasih banyak Mas bro. Dari sekian cara yang saya baca di Blog lain, ini yang paling mudah dan oke. Makasih yoo

  14. Colleen says:

    I have read so many articles or reviews regarding the blogger lovers but this post is really a good post, keep it up.

  15. Pingback: Cara mudah buat related post secara manual | setia1heri.com

Komentar bebas : panjang, pendek, berkali-kali, terserah, ekspresikan dirimu :) You may use HTML tags and attributes.

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s