Membuat artikel terkait dengan gambar fiture keren di WordPress

Menambahkan artikel cukup penting bagi anda yang ingin mendapatkan jumlah klik yang banyak dari setiap pengunjung, dengan memberikan saran artikel terkait yang mungkin pengunjung butuhkan untuk dibaca dibawah postingan yang saat ini mereka buka.

Berikut adalah bagaimana cara membuat artikel terkait tanpa plugin.

Kenapa tanpa plugin, mungkin yang menjadi salah satu pertimbangan saya adalah biar website wordpress kita tidak terlalu berat.

[php]

<div class="relatedposts">
<h2 class="post-title"><b>Artikel Terkait | Jasa Pembuatan Webiste Murah</b></h2>
<hr>
<br>
<?php
$orig_post = $post;
global $post;
$tags = wp_get_post_tags($post->ID);

if ($tags) {
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
$args=array(
‘tag__in’ => $tag_ids,
‘post__not_in’ => array($post->ID),
‘posts_per_page’=>6, // Number of related posts to display.
‘caller_get_posts’=>1
);
$my_query = new wp_query( $args );
while( $my_query->have_posts() ) {
$my_query->the_post();
//assign the title to a variable
$the_title = esc_attr ( the_title_attribute ( ‘echo=0’ ) );
//specify our desired max character count
$max_length = 45;
//strlen gets the length of the string
$title_length = strlen ( $the_title );

// check if the length of the string is greater than our assigned max length
if ( $title_length > $max_length ) {
// if it is display a substring of the title from the
// first character to the 38th character and append …
$title_excerpt = substr ( $the_title, 0, $max_length ) . ‘…’;
} else {
// otherwise just return the_title()
$title_excerpt = $the_title;
}
?>
<div class="col-md-4">
<a rel="external" href="<? the_permalink()?>"><?php the_post_thumbnail(array(245,150)); ?><br />
<?php echo $title_excerpt; ?>
</a>
</div>
<? }
}
$post = $orig_post;
wp_reset_query();
?>
</div>

[/php]

Dan tambahkan code CSS di struktur template wordpress anda

[css]

.relatedposts {width: 100%; margin:auto; float: left; font-size: 16px;}
.relatedposts h3 {font-size: 20px; margin: 0 0 5px 0; }
.relatedthumb {margin: 0 1px 0 1px; float: left; }
.relatedthumb img {margin: 0 0 3px 0; padding: 0;}
.relatedthumb a {color :#333; text-decoration: none; display:block; padding: 4px;  width: 33.33333%;}
.relatedthumb a:hover {background-color: #fff; color: #000;}

[/css]

Dan tambahkan code php ini di fungstions.php template wordpress anda

[php]

set_post_thumbnail_size( 245, 200, true );

[/php]

Bagikan jika bermanfaat..

Facebook
WhatsApp
Telegram

Artikel Yang Anda Suka

Artikel Terkait