Tuesday, February 21, 2012
To me, adding a post list on site is a must as it could load and display your posts in a simple view. As everybody knew, it's what publishers can not do to display all their posts at once on the home page cuz that way will set their site on a realy heavy load, unless their posts are just six total. Here i have two forms to choose to display a post list on your blog, one form will show up post list according to each label on the post, while one another will show up a post list according date release.

If you ask me which i love the more betwen this two forms, then i'd like to tell you i love the way that loads according to date release. - Why?. I think it's simplier than the one that displays according to label. The post list according to label will display every label along with all posts in it, which means it will display some duplicate/the same posts in several links for each post that got some labels, too that you can't manage the total number of posts displayed on the page. While in the post list according to date release, you determine how many posts you want to display on the page, and all rest can still be loaded by clicking the Newer Post or Older Post. Some what, with this way you don't need to create a new page to accomodate the code or even list of the posts displayed, you need only some pixel of vacant to place the code, and no need any place for list of posts displayed, it will take place by it ownself.

Let's Get Down To The Bussiness

How To Display A Post List According To Label (With Javascript)?

1. Login to your blogger.
2. Go to design.
3. Edit Html.
4. Check the Expand Widget Template box to load the entire codes in your template.
5. Copy and save the entire codes in the text box for anticipation of mistake when you modify your template. Or simply download it through the Download Full Template thread.
6. Find the following code: < b:include data='post' name='post'/>. Replace it with the code below.

To be the lesser arrangement the above code looks like the below:

< b:if cond='data:blog.homepageUrl != data:blog.url'>
< b:if cond='data:blog.pageType != "item"'>< a expr:href='data:post.url'>< data:post.title/>< /a>
< b r / >< b r / >
< b:else/>
< b:include data='post' name='post'/>
< /b:if>
< b:else/>
< b:include data='post' name='post'/>
< /b:if>


7. Create a new post or page and copypass the code below in the text box where you use to write article/post.

To be the lesser arrangement the code above looks like the below:

< script src="http://source-code16.googlecode.com/files/Posts-list.js" type="text/javascript">< / script>< script src="http://j-smith-site.blogspot.com/feeds/posts/default?max-results=100&alt=json-in-script&callback=loadtoc" >< / script>

*Just replace the line in red with your blog url. You can click the Mobile View button on top left of this blog to know how does it look like, maybe i haven't changed it with another feature, as yet?

8. Publish your post and you're done.

I don't know if this code will work or not in the "New Page", but it doesn't work in the new page in my blog. Just give it a try if you wanna do so.

How To Display A Post List According To Date Release (Without Javascript)?

1. Login to your blogger.
2. Go to design.
3. Edit Html.
4. Check the Expand Widget Template box to load the entire codes in your template.
5. Copy and save the entire codes in the text box for anticipation of mistake when you modify your template. Or simply download it through the Download Full Template thread.
6. Find the following code: < b:include data='post' name='post'/>. Replace it with the code below.

To be the lesser arrangement the above code looks like the below:

< b:if cond='data:blog.homepageUrl != data:blog.url'>
< b:if cond='data:blog.pageType != "item"'>< a expr:href='data:post.url'>< data:post.title/>< /a>
< b r / >< b r / >
< b:else/>
< b:include data='post' name='post'/>
< /b:if>
< b:else/>
< b:include data='post' name='post'/>
< /b:if>


7. Now all what you have to do is just to place/display the code used to call the post list on your blog, you can place it everywhere you want. Let's say, just take you'd like to place the code on your sidebar, then you can go to your Blogger Homepage> Design> Add Gadget> Choose The Html/Javascript widget and then copypass the code below into the text box:

To be the lesser arrangement the code above looks like this: < a href='http://j-smith-site.blogspot.com/search?max-results=150'>Post List< / a>

*Just replace the line in red with your blog url. And change the number "150" with any number as you want, it will be the number of post displayed on your page.

Save the widget and you're done. And you too can place the code on your navbar, or realy just everywhere it is.

Click the Post List button on top side of this blog to know how does it look like, maybe i haven't changed it with another feature.

Well, it's done. Only one thing left in my post, i forgot to take a picture.

0 comments:

Post a Comment