How to customize my templates with cool stuff

The templates I made , are simple , and easy to use , however they lack SUPER cool stuff like "read more" button , related posts , and such. Those are very , very easy to add. Because I didn't wanted to ruin the template by adding them myself , I will teach you how to do it for yourself. This is because not all users want a related post on their blog , either a "read more" button , so tastes differ.

1. Adding jump break functionality to the template.
Login to your blogger account , go to "Design" , then "Edit HTML" and then find the following :

<data:post.body/>

And after , add this :

<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"'><data:post.jumpText/></a>
</div>
</b:if >

How to use?
Simply start posting , make sure you use the new blogger editor , which has a lot of new features , including the jump break button... see image below:

Wherever you want the "read more" button to appear , press the "Jump Break" button , which will tell the blog , which part of your post to hide , and which part to show as "summary".

2. Adding "Related Posts"
Adding "Related Posts" is not a big secret , if you use a Classic Blogger template , but for Custom templates , you have to do the following:
Go to http://linkwithin.com  , fill the form on your right , but for the platform do not choose blogger , choose "Other" , then click Get Widget , you will be dropped in a page called "Install Widget on Other Platforms" and , you will see the code there. In the code you will see something like this : 

var link_within_site_id = 45652;

You will have to copy the ID and after that go to your blogger , Design >> Edit HTML >> make sure your "Expand Widget Templates" is checked , and find the following line :

 

<div class='post-footer'>

 or similar , you MUST find post-footer , once you found it , just before it paste the following code :

<b:if cond='data:blog.pageType == "item"'>
<script>
var linkwithin_site_id = YOUR_SITE_ID;
(function () {
var elem = document.createElement('script');
elem.type = 'text/javascript';
elem.src = 'http://www.linkwithin.com/widget.js?rand=' + Math.random();
document.getElementsByTagName('head')[0].appendChild(elem);
})();
</script>
<a href="http://www.linkwithin.com/"><img
src="http://www.linkwithin.com/pixel.png" alt="Blog Widget by LinkWithin"
style="border: 0" /></a>
</b:if>

 The "Your_Site_ID" is the ID code you just copied from the "LinkWithin" page. Now review your template , and see if it works or not.