Blogger/Website Auto and Manual Related Post Code
Adding related posts to your Blogger or website is one of the most effective ways to increase user engagement and reduce bounce rate. With
auto and manual related post codes, you can easily display links to other relevant articles below each post. The
auto related post code automatically fetches posts based on categories, labels, or keywords, saving time and ensuring your readers see the most relevant content. On the other hand, the
manual related post code allows full control, letting you choose exactly which posts to showcase. Implementing related posts not only improves navigation and user experience but also boosts SEO by creating internal links that help search engines better understand your website structure. Whether you are using a free Blogger template or a custom website, adding related posts is a simple yet powerful way to enhance your site’s performance.
Blogger mein Auto Related Posts Code istemal karne ke boht se zabardast faide hain, khaas taur par un logo ke liye jo apne blog ko professional banana chahte hain magar har post ko manually manage nahi kar sakte.
Iske main faide niche diye gaye hain:
1. Automatic Content Discovery
Iska sabse bara faida ye hai ke ye user ko aapke blog ke doosre articles khud dikhata hai. Agar koi user Google se aapke kisi ek page par aaya hai, to ye script usay usi topic se milti-julti mazeed 3–4 posts dikha degi, jis se user aapki site par hi ruka rahega.
2. Time-Saving (Waqt ki Bachat)
Agar aapke blog par saikron (hundreds) posts hain, to har post ke niche manually links lagana namumkin hai. Auto code sirf ek baar Layout > Add a Gadget ya HTML Template mein lagaya jata hai aur ye poori website ki purani aur nayi posts par khud hi apply ho jata hai.
3. Professional Look (With Thumbnails)
Blogger ke naye scripts mein sirf text links nahi hote, balkay images (thumbnails) bhi nazar aati hain. Is se aapka blog kisi bari news website (jaise ProPakistani ya Tribune) jaisa professional lagne lagta hai.
4. Smart Label-Based Targeting
Blogger ke auto scripts zyada tar Labels (Tags) par kaam karte hain.
5. SEO aur Bounce Rate mein Kami
Jab user ek post ke baad doosri aur phir teesri post par jata hai, to:
Blogger Auto Related Posts Ka Structure
Zadatar codes teen (3) hisson par mushtamil hote hain:
Manual Related Post
Manual Related Posts
Manual related posts mean that you insert links to other relevant articles yourself, either within the content or at the end of your article, instead of relying on automated systems.
Here are the main benefits compared to automated related post systems:
1. Better Relevance
Automated plugins often show related posts based only on tags or categories, which can sometimes be irrelevant. Manual linking allows you to provide exactly what the reader needs at that moment. For example, if you are writing about "Weight Loss," you can manually link to "Best Diet Plan," ensuring it appears at the right time for the user.
2. Lower Bounce Rate
When users find the next topic they are interested in within the article, they are more likely to click through instead of leaving your site. This reduces bounce rate and increases the time spent on your website.
3. Internal Linking and SEO
Internal linking helps Google understand your website structure. Manual related posts make it easier for Google bots to navigate your site, which can also improve the ranking of older articles.
4. Faster Page Load Speed
Related post plugins or widgets often slow down a website because they fetch results from the database every time. Manual links are simple HTML, so they have no negative impact on page speed.
5. Higher Conversion Rate
If you are selling a product or doing affiliate marketing, manual related posts can guide users directly to a sales page, increasing the chances of conversion.
Blog Post HTML Code:
<div class='pRelate'>
<!--[ Related title ]-->
<b>You may want to read this post :</b>
<ul>
<li><a href='#'>Your_post_title_here</a></li>
<li><a href='#'>Your_post_title_here</a></li>
<li><a href='#'>Your_post_title_here</a></li>
</ul>
</div>Auto Related Post
Also Take a Look at These
Blog Post HTML Code:
<!--[ Automatic Related Posts ]-->
<details class='sp arp' open>
<summary data-show='Show all' data-hide='Hide all'>Also Take a Look at These</summary>
<div class='aRel'></div>
</details>Auto Related Post old code
Auto Related Posts (Old Code/Script)
Auto Related Posts using old JavaScript or XML scripts automatically generate a list of related posts on Blogger or older websites. Compared to modern methods, these old scripts still have some key advantages.
Here are the main benefits:
1. "Set and Forget"
The biggest advantage is that you don’t have to manually add links to every new post. You only need to insert the script once in your template, and it will automatically display related links (usually based on labels or tags) under every new or old post.
2. Traffic to Old Content
Posts that are 2–3 years old and forgotten can get new attention. When a user reads a new article, the script shows older but related posts in the "Related Posts" section, driving traffic back to them.
3. Efficient Use of Labels/Categories
Old scripts mostly rely on labels (Blogger). This ensures that content is automatically organized. For example, if you assign a "Health" label, the script will only display posts related to health, keeping users engaged on your site.
4. Zero Maintenance
Manually adding links can take 5–10 minutes per post. For blogs with hundreds of posts, this becomes impractical. Old auto-scripts save all this time, allowing you to focus on writing content.
5. Simple HTML/JS (No Database Load)
Old Blogger scripts often use JSON feeds and run in the user’s browser. This reduces server load, keeps your hosting fast (especially on Blogger), and maintains a clean layout.
Related Posts
Blog Post HTML Code:
<details class='sp toc' open=''>
<summary data-show='Show all' data-hide='Hide all'>Related Posts</summary>
<div class='toC' id='aRel'></div>
</details>Some Disadvantages (You Should Know)
1. Relevance
Sometimes the script only checks tags and may suggest articles that are not fully relevant. Manual linking usually does a better job of showing truly related content.
2. Design
Old scripts may not match modern blog themes and layouts. You often need to apply some CSS adjustments to make them look good.
3. Broken Links / Thumbnails
If the script becomes outdated, it may fail to load thumbnails or links properly, leading to broken visuals or missing content in the related posts section.
1️⃣ Auto Related Posts Code (Blogger)
Benefits of Using Auto Related Posts Code in Blogger
Using auto related posts code in Blogger has many advantages, especially for those who want to make their blog look professional but cannot manage links manually for every post.
Here are the main benefits:
1. Automatic Content Discovery
The biggest advantage is that it automatically shows users other articles from your blog. For example, if a user lands on one of your pages via Google, the script will display 3–4 related posts on the same topic, keeping the user engaged on your site.
2. Time-Saving
If your blog has hundreds of posts, manually adding links under each post is nearly impossible. Auto code only needs to be added once in Layout > Add a Gadget or in the HTML template, and it applies automatically to all new and old posts.
3. Professional Look (With Thumbnails)
Modern Blogger scripts not only display text links but also thumbnails. This makes your blog look professional, similar to major news websites like ProPakistani or Tribune.
4. Smart Label-Based Targeting
Blogger auto scripts usually rely on labels (tags). For example, if a post has the label “Tech,” the script will only show other “Tech” posts below it. This increases relevance and the likelihood that users will click on additional posts.
5. Improved SEO and Lower Bounce Rate
When users navigate from one post to another using related posts:
Blogger Auto Related Posts Structure
Most auto related post codes consist of three main parts:
Ye code automatically aapke post ke labels ke hisaab se related posts show karega.
Blog Post HTML Code:
<!-- Auto Related Posts Start -->
<div id="related-posts-auto" style="margin-top:20px;">
<h3 style="text-align:center;">Related Posts</h3>
<ul id="related-posts-list" style="list-style:none; padding:0;">
</ul>
</div>Java Script Auto Related Posts
<script type="text/javascript">
// Auto fetch related posts by label
var relatedLabel = '<data:post.labels/>'; // automatically fetch current post label
var relatedPostsNum = 5; // number of posts to show
function relatedPostsCallback(json) {
var entries = json.feed.entry || [];
var container = document.getElementById('related-posts-list');
for (var i = 0; i < entries.length && i < relatedPostsNum; i++) {
var title = entries[i].title.$t;
var link = entries[i].link.find(l => l.rel=='alternate').href;
container.innerHTML += '<li style="margin-bottom:10px;"><a href="'+link+'" target="_blank">'+title+'</a></li>';
}
}
var script = document.createElement('script');
script.src = "/feeds/posts/default/-/"+relatedLabel+"?alt=json-in-script&callback=relatedPostsCallback";
document.body.appendChild(script);
</script>
<!-- Auto Related Posts End -->2️⃣ Manual Related Posts Code (Blogger/Website)
Agar aap specific posts manually show karna chahte ho:
Blog Post HTML Code:
<!-- Manual Related Posts Start -->
<div id="related-posts-manual" style="margin-top:20px;">
<h3 style="text-align:center;">Related Posts</h3>
<ul style="list-style:none; padding:0;">
<li style="margin-bottom:10px;"><a href="https://example.com/post1" target="_blank">Post Title 1</a></li>
<li style="margin-bottom:10px;"><a href="https://example.com/post2" target="_blank">Post Title 2</a></li>
<li style="margin-bottom:10px;"><a href="https://example.com/post3" target="_blank">Post Title 3</a></li>
<li style="margin-bottom:10px;"><a href="https://example.com/post4" target="_blank">Post Title 4</a></li>
<li style="margin-bottom:10px;"><a href="https://example.com/post5" target="_blank">Post Title 5</a></li>
</ul>
</div>
<!-- Manual Related Posts End -->✅ Features
-
Responsive & simple design
-
Centered title with clean list
-
Auto code fetches posts based on labels
-
Manual code allows full control of which posts to show
-
Works perfectly on Blogger & custom websites
👉 Please Support Us ❤️ Subscribe OUR YouTube Channel 👍
💡 Note:
We hope you found this article helpful! If so, please consider
sharing it with your friends. If you have any questions or
run into any issues, feel free to drop a message in the
comment box or
Contact Us
directly. We're here to help! ✅
