wpvidZ

Learn WordPress With Video Tutorials

wpvidZ Blog Plugin Tips WordPress Related Posts Without Plugin

Plugin Tips

WordPress Related Posts Without Plugin

Last updated on
Posted on

How to add or show related posts under your blog post without installing additional plugin.

I have posted how to add breadcrumbs without plugin and my best breadcrumbs plugin if you want a plugin, a few days ago, and today, i want to show you, how we can actually display related posts, which is usually you can find under your blog post.

This tutorial uses a shortcode that will display related posts based on “tags”, using TwentyTen theme. Of course you can apply it in your own theme, as long as it has functions.php.


Example, Post A has “funny” as a tag, and the other post, Post B has the same “funny” as a tag.

When you click Post A, it will show after the post content, something like:

Related Posts:
1. Post B.

Related Posts section often helps to get better interlinking in your blog page, and can decrease bounce rate.

When your visitors read your post, they won’t soon go away, or close their browsers if they see many post titles options that may interest them to read.

Now if you want to use plugin for this, this Y.A.R.P.P (Yet Another Related Posts Plugin) used to be my best related post plugin.

So let’s create this related post under post without plugin (for demo, see my related post under this post):

Video:

Step by step guide:

1. Dashboard → appearance → editor

2. Function theme which is functions.php file (always back up first)

3. Add this code. (download in .txt file)

Thanks to blue anvil.

4. Update File.
Now we want to call this function by displaying (echo) the shortcode after post content.

It means we must adding some codes in single.php.

5. Click single post file which is single.php, open it, and look for a line of code which said: (see image)

</div><!--#nav-below-->

Where to paste the code.

5. Right below this line, add this line:

<div id="relatedpost">
<h3>Related Posts:</h3>
<?php echo do_shortcode('[related_posts]');?>
</div><!--#relatedpost-->

6. Update file, and check your post. It should have related posts based on the same tags.

7. To stylize the css, you can modify anything you like, in this tutorial i use a simple one.

Add this line to your style.css and update the file.

#relatedpost h3{margin:25px 0 10px 0;}

That’s it, modify, stylize as you like to fit your theme color, etc.

Latest Posts

Comments

  1. Curious Little Person says

    nice, i actually use the YAARP plugin to show the related posts on my new blog…

    Will need to try this technique as I’ll have one plugin less with my thesis theme..

    Thanks for this valuable info..

    Cheers
    Sandeep

    • Kimi says

      Yes, Y.A.R.P.P was also my best fav plugin for related post.

      If you want to work without plugin, it is also easy to implement in our blog with the tut above 😀

      Thanks for coming by Sandeep.

  4. Kavita says

    I am using YARPP plugin. I wish had read this post much earlier. I always appreciate adding codes manually without using plugins. Thanks for the post anyway, Kimi

  6. Imran@TechiesBlog says

    Hi Kimi,

    presently I am using YARPP plugin, I will doing some slight makeover of my blog and planing to use Similar Post plugin. But required you assistances to eliminate few plugins and maintain the functionality of the blog. Moreover I am also using thesis theme.

    Thanks for Sharing
    -Imran

      • Imran@TechiesBlog says

        Thanks Kimi I will be waiting for it.

        However I am not using Blogussion thesis skin it is my custom made skin, yeh u are right I have take few functionality of Blogussion.

        It has become a hobby for his day where I see good I want to implement on my blog. It is more kind of experimentation and learn thesis.

  10. Naziman says

    Thanks but actually i want related post by category if, category no other post, i want to make it by tag. but i don’t know how.

Trackbacks

Comment form on this post is closed after 60 days.