
Blogger team tried to make their product easier to use and custom for all users with Template Design function. If you want small changes in fonts, background, layout..., this function can help. But if you want more to make your blog look like a professional website? It's time you need to learn structure of blogger template, APIs, javascripts ... to make a custom template. This serie: “How to make a Blogger template” will take you step by step to creating your own. I will try to make it short, simple and easy to understand, hope it helpful for you .
----------------------------------------------------------------------
Chapter 1 Blogger Template Structure
Chapter 2 Template Header
Chapter 3 Template body and API's
Chapter 4 Inside widget - "Includable"
Chapter 5 Blogger data tags 1
Chapter 6 Blogger data tags 2
Chapter 7 How Blogger widget work
Chapter 8 General steps of making a Blogger template
----------------------------------------------------------------------
You already knew about data tags in previous chapter, we will see the rest of data tags in this chapter and know more about the most important widget: blogpost. This widget purpose is to shows posts in a blog. Without blogpost widget, we can't blogging.
Now let's see blogpost widget's data tags :
----------------------------------------------------------------------
Chapter 1 Blogger Template Structure
Chapter 2 Template Header
Chapter 3 Template body and API's
Chapter 4 Inside widget - "Includable"
Chapter 5 Blogger data tags 1
Chapter 6 Blogger data tags 2
Chapter 7 How Blogger widget work
Chapter 8 General steps of making a Blogger template
----------------------------------------------------------------------
CHAPTER 6: BLOGGER DATA TAGS 2
You already knew about data tags in previous chapter, we will see the rest of data tags in this chapter and know more about the most important widget: blogpost. This widget purpose is to shows posts in a blog. Without blogpost widget, we can't blogging.
Now let's see blogpost widget's data tags :
- <data:feedLinks/>: A list of feeds for this page. On the main page, this will contain the main blog feeds; on item pages, this will also contain comments feeds. Each item in this list contains the following:
- <data:feedLinks.url/>: The feed URL.
- <data:feedLinks.name/>: The feed name (i.e. 'Posts' or 'Comments').
- <data:feedLinks.feedType/>: The type of feed (Atom or RSS).
- <data:feedLinks.mimeType/>: The mime type of the feed.
- <data:olderPageUrl/>: If there are older posts than the ones on the current page, this is a URL to those posts. Context-sensitive for page type. (Not all pages will have this link.)
- <data:olderPageTitle/>: Title of the link to the older page of posts. It's usually the text "Older Posts"
- <data:newerPageUrl/>: The newer equivalent of olderPageUrl.
- <data:newerPageTitle/>: The newer equivalent of olderPageTitle.
- <data:commentLabel/>: The phrase to use to show the number of comments, e.g. "comments."
- <data:authorLabel/>: The phrase to use to indicate who wrote the post, e.g. "posted by."
- <data:timestampLabel/>: The phrase to use to indicate when the post was written, e.g. "posted at."
- <data:postLabelsLabel/>: Phrase to introduce the list of post labels, e.g. "labels for this post."
- <data:backlinksLabel/>: Phrase to describe backlinks to this post, e.g. "links to this post."
- <data:posts/>: A list of all posts for this page. You can consider it a set, and each post is an item in this set . We can refer to post's properties by the following tags:
- <data:post.dateHeader/>: The date of this post, only present if this is the first post in the list that was posted on this day.
- <data:post.id/>: The numeric post ID.
- <data:post.title/:>: The post's title.
- <data:post.body/>: The content of the post.
- <data:post.author/>: The display name of the post author.
- <data:post.url/>: The permalink of this post.
- <data:post.timestamp/>: The post's timestamp. Unlike dateHeader, this exists for every post.
- <data:post.labels/>: The list of the post's labels. Each label contains the following:
- <data:label.name/>: The label text.
- <data:label.url/>: The URL of the page that lists all posts in this blog with this label.
- <data:label.isLast/>: True or false. Whether this label is the last one in the list (useful for placing commas).
- <data:post.allowComments/>: 'True' if this post allows comments.
- <data:post.numComments/>: The number of comments on this post.
- <data:post.showBacklinks>: Whether to show backlinks for this post.
- <data:post.numBacklinks/>: Number of backlinks for this post.
- <data:post.addCommentUrl/>: The URL of the 'add a comment' form for this post.
- <data:post.emailPostUrl/>: The URL of the 'email this post' form for this post.
- <data:post.editUrl/>: The URL of the edit form for this post.
- <data:feedLinks/>: A list of feeds specific to this post. (This is different from the overall blog feedLinks, as it may contain a feed for the post's comments, for instance.) Each contains the following:
- <data:feedLink.url/>: The feed URL.
- <data:feedLink.name/>: The feed name (e.g. 'Posts' or 'Comments').
- <data:feedLink.feedType/>: The type of feed (Atom or RSS).
- <data:feedLink.mimeType/>: The mime type of the feed.
- <data:comments/>: A list of all comments for this post (on item pages only). Each contains the following:
- <data:comment.id/>: The numeric ID of the comment.
- <data:comment.body/>: The body of the comment.
- <data:comment.timestamp/>: The time the comment was created.
- <data:comment.author/>: The display name of the comment's author, or 'Anonymous'.
- <data:comment.authorUrl/>: URL of the comment author's profile, if the comment is not anonymous.
- <data:comment.deleteUrl/>: The URL for deleting this comment.
- <data:comment.isDeleted/>: Whether this comment has been deleted. (The text of deleted comments is replaced with a placeholder.)
This will greatly help me.. nice post mas broe
ReplyDeletehi i just wanna confirm that how to design my blogs of my wish, so that i can add more templates and custom fonts. please reply
ReplyDeletenow i know..eventhough it's hard to make one..
ReplyDeleteNice blog!
ReplyDeleteilike this post! yeahh :D
ReplyDeletethanks alot
hello sir pls how to add next and previous option for my blogger image
ReplyDeletehttp://actress.cinediary.in/ this is my website
very very very nice tutorial my friend
ReplyDeletehttp://internetricks4u.blogspot.com/