Do you have a homepage on blogger? Do you want to show a list of all the posts of your blog on homepage? If Yes, continue reading this tutorial, I will try to provide you a solution for your query. But first of all, let's find out what is a homepage.
What is Homepage :
Homepage is the first landing page where your reader can access all information in brief. There might be multiple pages or posts linked from Homepage. It depends on the niche you are working for. If it is a news portal homepage, it must be providing all the current news happening around the world. Whereas if it is an e-commerce website, a brief intro about each and every product currently in trend must be listed. Homepage is the first impression of a website where your reader will have the basic idea about the information you are sharing.
While working on blogger, many of us either have a simple list of all posts with picture thumbnails and text excerpt. I have tried many times to build a homepage with custom layout. I think a full width homepage without any sidebar works much better if you have a long list of information to share.
If you wish to show a simple list with hyperlinked to original post, you cannot do so with any widget. However, there is a script which can easily display all the posts, no matter how much big the list is. If you have a blog of more than 500 posts, you can display all the 500+ posts on homepage hassle free. Today, in this tutorial, we will going to learn How to Show List of All Posts on Homepage in Blog.
To show all posts in the form of a list on homepage, you need to have a static page. It could be a post as well. But whenever your user visits your blog, he must be redirected to a static page. Creating a static page is fairly simple.
Learn: How to show post title before blog title in Blogger
First, Go to Blogger Dashboard.
Click on 'Pages' and Create a new page denoted with "Homepage".
(Note: Please disable the comments on this page, as it does not look good to have comments on the Homepage).
Bingo ! You have successfully created a Homepage. Now let's redirect your blog URL to this newly designed Homepage.
Now, Go to Settings., Click on Search Description.
Follow the instruction as given in the image.
Once, you have completed the above step. Save all changes.
Now, we have add a piece of code to that page which you have recently created.
Go to Pages menu once again and Click Edit page.
Click on HTML view and paste the below mentioned code.
Click Update and Preview your blog.
To show all posts in the form of a list on homepage, you need to have a static page. It could be a post as well. But whenever your user visits your blog, he must be redirected to a static page. Creating a static page is fairly simple.
Learn: How to show post title before blog title in Blogger
How to create a Static Page :
Blogger provides a very easy method to create static page. You can also make use of posts. Let's quickly learn how to create a static page.First, Go to Blogger Dashboard.
Click on 'Pages' and Create a new page denoted with "Homepage".
(Note: Please disable the comments on this page, as it does not look good to have comments on the Homepage).
Bingo ! You have successfully created a Homepage. Now let's redirect your blog URL to this newly designed Homepage.
Now, Go to Settings., Click on Search Description.
Follow the instruction as given in the image.
 |
| Click Image to Enlarge |
Once, you have completed the above step. Save all changes.
Now, we have add a piece of code to that page which you have recently created.
Go to Pages menu once again and Click Edit page.
Click on HTML view and paste the below mentioned code.
Click Update and Preview your blog.
Use this Code :
<div><ul id="postList12"></ul></div>I hope this tutorial regarding Showing List of all posts on Homepage and create a static page for blogger blog might help you. If you find it useful, please do share it with your friends. Have any issue ? please use the comment box below to respond. I will try to help.
<script type="text/javascript">
var startIndex = 1;
var maxResults = 100;
function sendQuery12()
{
var scpt = document.createElement("script");
scpt.src = "/feeds/posts/summary?alt=json&callback=processPostList12&start-index=" + startIndex + "&max-results=" + maxResults;
document.body.appendChild(scpt);
}
function processPostList12(root)
{
var elmt = document.getElementById("postList12");
if (!elmt)
return;
var feed = root.feed;
if (feed.entry.length > 0)
{
for (var i = 0; i < feed.entry.length; i++)
{
var entry = feed.entry[i];
var title = entry.title.$t;
for (var j = 0; j < entry.link.length; j++)
{
if (entry.link[j].rel == "alternate")
{
var url = entry.link[j].href;
if (url && url.length > 0 && title && title.length > 0)
{
var liE = document.createElement("li");
var a1E = document.createElement("a");
a1E.href = url;
a1E.textContent = title;
liE.appendChild(a1E);
elmt.appendChild(liE);
}
break;
}
}
}
if (feed.entry.length >= maxResults)
{
startIndex += maxResults;
sendQuery12();
}
}
}
sendQuery12();
</script>
Comments
Post a Comment