Header Ads

Breaking News
recent

How to Replace Older/Newer Post buttons with Post Titles in Blogger 2016


Hello Guys! You must have seen some popular blogs who have replaced older and newer post buttons with post titles and you must be wondering that “how to do it?” So today I am going to show you how to replace older/newer post buttons with post titles in blogger.




Let Start it below:

How to Replace Older/Newer Post buttons with Post Titles

When you replace older and newer post buttons with your post titles then it shows the professionalism and helps your reader to find out that what actually they are missing, with reference to your old post. In this way you can get more exposure for your older posts too which is why many pro bloggers are using this tactic.

So, follow the given steps to replace that older and newer post buttons with your post titles. Now without taking your time more, we’d request you to get towards the steps; 

1.Sign in to your Blogger blog.
2.Go to Template >> Edit HTML.
3.Search for</head> tag. After finding </head> tag, paste the following code above it. 

Note: Only follow this step if you are not using any jquery.min.js file on your template, so be sure you first search for jquery.min.js.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

4.Now, you need to click on Layout from the sidebar and then select Add a Gadget.
5. From the list of gadgets search for HTML/JavaScript and select it. Now you need to paste the following code in the HTML Text box.

<style type="text/css">
#blog-pager-newer-link {font-size:85%;width:200px;text-align:left;}
#blog-pager-older-link {font-size:85%;width:200px;text-align:right;}
</style>

<script type="text/javascript">
$(document).ready(function(){
var newerLink = $("a.blog-pager-newer-link").attr("href");
$("a.blog-pager-newer-link").load(newerLink+" .post-title:first", function() {
var newerLinkTitle = $("a.blog-pager-newer-link").text();
$("a.blog-pager-newer-link").text("<< " + newerLinkTitle);
});
var olderLink = $("a.blog-pager-older-link").attr("href");
$("a.blog-pager-older-link").load(olderLink+" .post-title:first", function() {
var olderLinkTitle = $("a.blog-pager-older-link").text();
$("a.blog-pager-older-link").text(olderLinkTitle + " >>");//rgt
});
});
</script>

6.Now just click on Save Button.
You are done now. Now older and newer post links will be replaced with your post titles.

I hope that after reading this article you can easily Replace Older/Newer Post buttons with Post Titles.If you like this article share it on social media to help other blogger friends.

Let me know you if you have any problem regarding to this article.If you have any problem you can ask me in comment box.Thanks for reading this article.Stay tuned for more lectures.



No comments:

Powered by Blogger.