Related Post Wordpress Tanpa Plugin

Salah satu faktor penentu baik tidaknya kunjungan pada sebuah blog yaitu ukuran Bounce Rate pada Blog tersebut untuk meminimalisir dan memperkecil Bounce rate yaitu dengan membuat Related Post, meskipun cara ini bukan salah satunya untuk memperkecil hal tersebut tapi setidaknya Blog kita dimata serach engine masih terlihat sehat dan bukan dianggap blog yang mendatangkan trafik yang hanya sebentar saja.

Nah terkait permasalahan tersebut di postingan ini akan dibahas Cara Membuat Related Post Wordpress Tanpa Plugin, Bagi sahabat yang kebetulan menggunakan platform Wordpres dapat mencobanya dan ini cukup mudah dan simple tanpa harus menggunakan Plugin bawaan dari Wordpres itu sendiri, bagi sahabat yang meau mencobanya mari disimak Cara Membuat Related Post Wordpress Tanpa Plugin.

Langkah Awal 

Silahkan sahabat setelah masuk ke Wordpresnya buka file single.php lalu mulai cari kode yang ibarat mirip kode dibawah ini

</div><!--/.post-content--> </div><!--/.post-inner--> </article><!--/.post--> <?php endwhile; ?>

Setelah ketemu silahkan sahabat letakkan kode dibawah ini sempurna diatasnya kode yang tadi dicari

<div class="related-posts"> <?php $orig_post = $post; global $post; $categories = get_the_category($post->ID); if ($categories) { $category_ids = array(); foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id; $args=array( 'category__in' => $category_ids, 'post__not_in' => array($post->ID), 'posts_per_page'=> 6, // Number of related posts that will be shown. 'caller_get_posts'=>1 ); $my_query = new wp_query( $args ); if( $my_query->have_posts() ) { echo '<div id="related_posts"><h2>You Might Also Like:</h2><ul>'; while( $my_query->have_posts() ) { $my_query->the_post();?> <li><div class="relatedthumb"><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_post_thumbnail(); ?></a></div> <div class="relatedcontent"> <h3><a href="<?php the_permalink()?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h3> </div> </li> <?php } echo '</ul></div>'; } } $post = $orig_post; wp_reset_query(); ?> <div style="clear:both"></div> </div>

Perhatikan kode yang ditandai 'posts_per_page'=> 6, itu untuk mengatur jumlah postingan yang nantinya akan sahabat tampilkan di Related post dan di Related post ini akan menampilkan Postingan yang sesuai dengan label atau kategori yang sejenisnya.


Langkah Berikutnya
Silahkan sahabat salin kembali kode CSS dibawah ini lalu letakkan sempurna di atas kode head pada di file Header.php

<?php if (is_single()) { ?> <style type='text/css'> .related-posts{line-height:1.3em;margin-right:-20px} .related-posts h2{display:block;font-size:18px;font-weight:600;margin-bottom:10px;padding:0;} .related-posts a{font-size:16px;font-weight:400;color:#555!important} .related-posts li{display:block;float:left;list-style: none;width:50%;height:200px!important;overflow:hidden;height:auto;padding:0 20px 0 0;margin-bottom:10px;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box} .related-posts .relatedthumb{padding:0;margin:0;height:130px} .related-posts .relatedthumb img{width:100%;max-width:auto;height:100%;transition:all 400ms ease-in-out} .related-posts .relatedthumb img:hover{opacity:.7} .related-posts li:hover a{color:#e8554e!important} @media screen and (max-width:375px){.related-posts li{width:100%;} } </style> <?php } ?>

Perhatikan betul instruksinya terkadang salah menempatkan kode akan berakibat tidak munculnya Related Post, kalau dirasa sudah sesuai silahkan simpan dan selesai, Selamat mencoba dan agar bermanfaat.