[WordPress Tips] Instructions for creating related posts for WordPress without using a detailed plugin – Displaying related articles in wordpress not only helps retain readers, but it also increases the aesthetics of your website. You to create related posts in WordPress the simplest way is to use a support plugin, but the biggest disadvantage when you use a Plugin is that it will make your page very slow and may cause problems. Conflicts between Plugins make your website unstable. So the most optimal way you should use the code and embed it directly in the “child theme” is the best .
In the previous article about WordPress tricks, I showed you how to display the time on posts in Facebook style so that you can easily customize the post time of your own style continue in this article. I will show you the easiest way to create related posts for WordPress without using a plugin.
Contents
In this article, I will show you how to display related posts with Thumbnail images in the article. Actually, this function is already built-in in wordpress, but not every theme you are using has activated this mode. For Thumbnail mode, copy the following code and paste it into the Functions.php file of the theme you are using.
add_theme_support( 'post-thumbnails' ); set_post_thumbnail_size( 100, 50, true );
Explain
Line 1: Enable post thumbnails.
Line 2: To customize the (length) width and (Width) height of the thumbnail image.
To display the thumbnail image after posting the article, you must select the Use as featured image item .
Continue to insert the following code into the single file . php to display related posts with thumbnail images. Wherever you want to display it, insert it in that position.
<div>
<h3>Related posts</h3>
<?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'=>4, // Số bài viết liên quan muốn hiển thị.
'caller_get_posts'=>1
);
$my_query = new wp_query( $args );
while( $my_query->have_posts() ) {
$my_query->the_post();
?>
<div>
<a rel="external" href="<? the_permalink()?>"><?php the_post_thumbnail(array(150,100)); ?><br />
<?php the_title(); ?>
</a>
</div>
<? }
}
$post = $orig_post;
wp_reset_query();
?>
</div>
You notice in the code above there is a line
the_post_thumbnail(array(150,100));
You can change the length and width of the avatar.
You can continue to customize to highlight related articles with the following CSS code, copy the following code and paste it into the CSS file of the theme you are using.
.relatedposts {width: 640px; margin: 0 0 20px 0; float: left; font-size: 12px;}
.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: 150px;}
.relatedthumb a:hover {background-color: #ddd; color: #000;}
Here you pay attention to the following items to customize to suit your theme.
.relatedposts {width: 640px; margin: 0 0 20px 0; float: left; font-size: 12px;}
You change 640px to the width to fit your web.
.relatedthumb a {color :#333; text-decoration: none; display:block; padding: 4px; width: 150px;}
You change 150px to the width of the avatar you want to use.
And here is the result that I did
Is it too simple for you to create related posts for WordPress without using a plugin?
Finally, if you find the article useful, please subscribe to my blog regularly to update the latest articles via Email – Thank you!
