blogger2ools: A Data Tags Reference for Blogger Templates (2019 update)

Welcome to blogger2ools!

I know it's a bit ugly but it grows on you. The purpose of this page is to reference ALL the layout data tags available to you when coding blogger templates. There's a section for global tags and the rest are only available to specific widgets. This guide is generated in real-time from a real blogger template. I've included links all over the place to help you navigate. You'll notice the tag values change when you do. Echoing data directly from the code ensures you'll always have an up-to-date Blogger reference. Keep this page bookmarked!

If you find this confusing then seeing blogger2ools in dynamic view might help to wrap your head around this. New window because dynamic views break the back button.

Changelog

22 Jan 2019 - Started logging changes. Why didn't I have a changelog from the jump? Oh well, some months ago I added the "error_page" so you can see what that looks like. I also added links to three of my popular Blogger guides. Fixed a mixed-content security error my Amazon-hosted favicon was causing. Letting Blogger host it instead fixed that. Finally, I've added a link to the dynamic view. Why not?

More Information

I've written many guides on customizing Blogger in undocumented ways. Here's a few to get you started.

So have fun, play around. I know you will find this very useful. If you like this tool then share it with others. Link it on your own guides. Seeing links and incoming traffic are how I know people are using it. And that encourages me to keep it updated. Take care!

Follow: twitter instagram

Globally Available Layout Data Tags

Live Widget Examples: Page Header Widget; Blog Archive Widget; Profile Widget; Feed Widget; Picture Widget; Labels Widget; Link List Widget

Previously Undocumented Live Widget Examples: Blog List Widget; Subscription Links Widget; Page List Widget

Blog Posts Widget: Blog Configuration; Page Navigation; System Messages; Blog Page Feed Links; Posts List

Live PageType Examples: Homepage; Index Page; Label Page; Search Page; Archive Page; Item Page; Static Page; Error Page

Globally Available Layout Data Tags

A Global Layout Data Tag can be used anywhere in your template, even the header.

blog.blogId 8769510562916278720
blog.postId 3519214775995950214
blog.pageId
blog.bloggerUrl https://www.blogger.com π
blog.blogspotFaviconUrl https://blogger2ools.mystady.com/favicon.ico π
blog.homepageUrl https://blogger2ools.mystady.com/ π
blog.canonicalHomepageUrl https://blogger2ools.mystady.com/ π
blog.url https://blogger2ools.mystady.com/2011/04/amazon-s3-hosted-jpeg.html π
blog.canonicalUrl https://blogger2ools.mystady.com/2011/04/amazon-s3-hosted-jpeg.html π
blog.postImageUrl http://fap.mystady.com/jpeg.jpeg π
blog.pageType item
blog.searchLabel
blog.searchQuery
blog.title blogger2ools: Data Tags Reference for Templates (2019 update)
blog.pageTitle blogger2ools: Data Tags Reference for Templates (2019 update): Amazon S3 Hosted JPEG
blog.pageName Amazon S3 Hosted JPEG
blog.metaDescription
blog.localeUnderscoreDelimited en
blog.isPrivateBlog false
blog.adultContent false
blog.googleProfileUrl π
blog.postImageThumbnailUrl π
blog.imageSrcTag
blog.analyticsAccountNumber UA-16030039-1
blog.view
blog.dynamicViewsScriptSrc //www.blogblog.com/dynamicviews/361ce9cf7a112c52 π
blog.dynamicViewsCommentsSrc //www.blogblog.com/dynamicviews/4224c15c4e7c9321/js/comments.js π
blog.disableAdSenseWidget
blog.adsenseClientId ca-pub-3290481153522974
blog.plusOneApiSrc https://apis.google.com/js/platform.js π
blog.isMobile false
blog.isMobileRequest false
blog.mobileClass
blog.isPrivate false
blog.enabledCommentProfileImages true
blog.encoding UTF-8
blog.locale en
blog.languageDirection ltr
blog.meTag
blog.ieCssRetrofitLinks
blog.layout-title
blog.mobileHeadScript
blog.openIdOpTag
blog.feedLinks <link rel="alternate" type="application/atom+xml" title="blogger2ools: Data Tags Reference for Templates (2019 update) - Atom" href="https://blogger2ools.mystady.com/feeds/posts/default" /> <link rel="alternate" type="application/rss+xml" title="blogger2ools: Data Tags Reference for Templates (2019 update) - RSS" href="https://blogger2ools.mystady.com/feeds/posts/default?alt=rss" /> <link rel="service.post" type="application/atom+xml" title="blogger2ools: Data Tags Reference for Templates (2019 update) - Atom" href="https://www.blogger.com/feeds/8769510562916278720/posts/default" /> <link rel="alternate" type="application/atom+xml" title="blogger2ools: Data Tags Reference for Templates (2019 update) - Atom" href="https://blogger2ools.mystady.com/feeds/3519214775995950214/comments/default" />
blog.latencyHeadScript
global b:include tags
- data="blog" name="all-head-content" <meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/> <meta content='blogger' name='generator'/> <link href='https://blogger2ools.mystady.com/favicon.ico' rel='icon' type='image/x-icon'/> <link href='https://blogger2ools.mystady.com/2011/04/amazon-s3-hosted-jpeg.html' rel='canonical'/> <link rel="alternate" type="application/atom+xml" title="blogger2ools: Data Tags Reference for Templates (2019 update) - Atom" href="https://blogger2ools.mystady.com/feeds/posts/default" /> <link rel="alternate" type="application/rss+xml" title="blogger2ools: Data Tags Reference for Templates (2019 update) - RSS" href="https://blogger2ools.mystady.com/feeds/posts/default?alt=rss" /> <link rel="service.post" type="application/atom+xml" title="blogger2ools: Data Tags Reference for Templates (2019 update) - Atom" href="https://www.blogger.com/feeds/8769510562916278720/posts/default" /> <link rel="alternate" type="application/atom+xml" title="blogger2ools: Data Tags Reference for Templates (2019 update) - Atom" href="https://blogger2ools.mystady.com/feeds/3519214775995950214/comments/default" />  <link href='http://fap.mystady.com/jpeg.jpeg' rel='image_src'/> <meta content='https://blogger2ools.mystady.com/2011/04/amazon-s3-hosted-jpeg.html' property='og:url'/> <meta content='Amazon S3 Hosted JPEG' property='og:title'/> <meta content='Here the complete list of Blogger Layout Data Tags, Live Widgets, and PageType examples for your templates. Updated: 2019' property='og:description'/> <meta content='https://lh3.googleusercontent.com/blogger_img_proxy/AEn0k_sbcP2U8DC9c7lB-Y_B097ePj2rtiLj239Pg2tFn_UUO457KuPdnF6v0IScUrjh9gIqKm2Z4kIxA3cn3G52nQ42cWM=w1200-h630-p-k-no-nu' property='og:image'/>
- data="blog" name="layout" 
- data="blog" name="quickedit"  <div class='clear'></div>

Table of Contents | Top

Page Header Widget

description: Here the complete list of Blogger Layout Data Tags, Live Widgets, and PageType examples for your templates. Updated: 2019
useImage: true
sourceUrl: http://dl.mystady.com/blogger2ools/blogger2ools-logo-90x90.png π
height: 90px;
width: 90px;
imagePlacement: BEHIND (Values: "BEHIND", "REPLACE")
backgroundPositionStyleStr: left
widthStyleStr: width: 90px;
mobile: false

(3.28.10) - The value of the title attribute in your b:widget element will be ignored.

Table of Contents | Top

Feed Widget

The Feed Widget only works when a visitor has JavaScript enabled. It uses the Google AJAX Feed API to dynamically replaces the first element it finds with an id whose value matches widget.instanceId + "_feedItemListDisplay". So in this case the Feed Widget is looking for id="Feed1_feedItemListDisplay".

feedUrl: https://mystady.com/feeds/posts/default/-/Anime π
loadingMsg: Loading...
showItemDate: true
showItemAuthor: true
numItemsShow: 5
openLinksInNewWindow: true

The standard-issue Feed Widget (last checked 4.19.10), uses a single includable which contains the following code snippet:

    <h2><data:title/></h2>
    <div class='widget-content' expr:id='data:widget.instanceId + &quot;_feedItemListDisplay&quot;'>
      <span style='filter: alpha(25); opacity: 0.25;'>
        <a expr:href='data:feedUrl'><data:loadingMsg/></a>
      </span>
    </div>
    <b:include name='quickedit'/>

The following code snippet demonstrates the minmum code required to render the feed items:

<div expr:id='data:widget.instanceId + "_feedItemListDisplay"' />

I used quotation marks (") instead of the HTML character entity " because it's smaller (one byte vs. six) and makes for easier reading. The code above won't work outside the Feed Widget. In fact, you could potentially get a bX error depending on where you try to use it. The following code snippet demonstrates a (very simple) workaround:

<div id="Feed1_feedItemListDisplay" />

The following code snippet will replace the entire page with the Feed Widget. I can't think of any use for this...

<body id="Feed1_feedItemListDisplay">

Use the following classes to style the Feed Widget items: item-title, item-date, item-author.

Table of Contents | Top

Picture Widget

sourceUrl: https://lh3.googleusercontent.com/blogger_img_proxy/AEn0k_uh3-0rxmNnpducq9i4e2o36VU3Pey58rXDEFVlSX2USWwuQqZeQPi6glDkvH7EKlSWddrQjx5AWUMiRW-rAgQWtBFqK5yeByA3OdhJx0nsnzqcKSvzI8xHUFDEPaMkaAI=s0-d π
width: 90
height: 90
caption: The blogger2ools logo.
link: https://blogger2ools.mystady.com/ π

Table of Contents | Top

Labels Widget

display: list (Values: "list", "cloud")
showFreqNumbers: true
labels: (list-type)
- index: 0
- name: Images
- count: 16
- url: https://blogger2ools.mystady.com/search/label/Images π
- cssSize: 5
- index: 1
- name: Amazon S3
- count: 5
- url: https://blogger2ools.mystady.com/search/label/Amazon%20S3 π
- cssSize: 3
- index: 2
- name: Picasa
- count: 4
- url: https://blogger2ools.mystady.com/search/label/Picasa π
- cssSize: 3
- index: 3
- name: Flickr
- count: 3
- url: https://blogger2ools.mystady.com/search/label/Flickr π
- cssSize: 3
- index: 4
- name: One Fish
- count: 3
- url: https://blogger2ools.mystady.com/search/label/One%20Fish π
- cssSize: 3
- index: 5
- name: Two Fish
- count: 3
- url: https://blogger2ools.mystady.com/search/label/Two%20Fish π
- cssSize: 3
- index: 6
- name: YouTube
- count: 3
- url: https://blogger2ools.mystady.com/search/label/YouTube π
- cssSize: 3
- index: 7
- name: Red Fish
- count: 2
- url: https://blogger2ools.mystady.com/search/label/Red%20Fish π
- cssSize: 2
- index: 8
- name: Video
- count: 2
- url: https://blogger2ools.mystady.com/search/label/Video π
- cssSize: 2
- index: 9
- name: Blue Fish
- count: 1
- url: https://blogger2ools.mystady.com/search/label/Blue%20Fish π
- cssSize: 1
- index: 10
- name: Facebook
- count: 1
- url: https://blogger2ools.mystady.com/search/label/Facebook π
- cssSize: 1
- index: 11
- name: Img Box
- count: 1
- url: https://blogger2ools.mystady.com/search/label/Img%20Box π
- cssSize: 1
- index: 12
- name: Photobucket
- count: 1
- url: https://blogger2ools.mystady.com/search/label/Photobucket π
- cssSize: 1
- index: 13
- name: TinyPic
- count: 1
- url: https://blogger2ools.mystady.com/search/label/TinyPic π
- cssSize: 1

Identifying Label Pages

The standard-issue Labels Widget (last checked 4.19.10), uses the following conditional statement to check if you're on a label page:

<b:if cond='data:blog.url == data:label.url'>

Unfortunately, that code only works on the first page. Replace it (both instances), with the following code snippet to have it work on all Label Pages:

<b:if cond='data:label.name == data:blog.searchLabel'>

Label Pages and Search Pages function similarly. See also Customizing Blogger's Search Result Pages With searchQuery.

Table of Contents | Top

Blog List Widget

showIcon: true
showItemThumbnail: true
showItemTitle: true
showItemSnippet: true
showTimePeriodSinceLastUpdate: true
numItemsToShow: 0
totalItems: 2
showNText: Show 2
showAllText: Show All
items: (list-item)
- index: 0
- displayStyle: display: block;
- timePeriodSinceLastUpdate: 8 years ago
- blogTitle: Blogger Buzz
- blogUrl: http://blogger.googleblog.com/ π
- blogIconUrl: https://lh3.googleusercontent.com/blogger_img_proxy/AEn0k_uEUqPeQInXbglCKWzhcuaN0_U3sq6phOffNtxlpCysuAKdpmmU8mhJ0-EdleYbLfGpzhOOpSpQ8-vopSPnL4r0yuzo7_tQvXTbJoA=s16-w16-h16 π
- itemTitle: An update to the Blogger post editor to help with mixed content
- itemSnippet: Back in September, we announced that HTTPS support was coming to blogspot.com, making it possible for you to encrypt connections to your blog; since then,...
- itemUrl: http://blogger.googleblog.com/2016/04/an-update-to-blogger-post-editor-to.html π
- itemThumbnail:
- itemThumbnail.height: 72
- itemThumbnail.width: 72
- itemThumbnail.url: https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMKJqBiANT9FM4EsDjfdI99e3Anvl5CFMAvxnvOp3FLcOwkyAKGH1TB6P0XmEWo6ROgzv7URNxuCUpkr6O5Vu_fOZVMLibUrt3viWC7g83GVIZBvxw9uyggUDG0oqLLHp-DcPVXg/s72-c/mixed-content-warning-screenshot.png π
- index: 1
- displayStyle: display: block;
- timePeriodSinceLastUpdate: 9 years ago
- blogTitle: Blogger in Draft
- blogUrl: http://bloggerindraft.blogspot.com/ π
- blogIconUrl: https://lh3.googleusercontent.com/blogger_img_proxy/AEn0k_saeW98ogmPm_ww7lVe2NFg_KjYpO8rvTyDbs7VON4BNzfuLejpSh8kf_3la5rUrge-ns6yszNPcCQCxw4lQjBFpb1I911TRJkum-ze_3oLgQ=s16-w16-h16 π
- itemTitle: Review Situs Agen Poker - Mencari Agen Poker Terpercaya
- itemSnippet: *Review Situs Agen Poker *- Anda jangan khawatir tentang *Bandar Agen Poker* Penipu di karenakan kami Review Situs Agen Poker sudah menyiapkan sebuah ulasa...
- itemUrl: http://bloggerindraft.blogspot.com/2015/10/review-situs-agen-poker-mencari-agen.html π
- itemThumbnail:
- itemThumbnail.height: 72
- itemThumbnail.width: 72
- itemThumbnail.url: http://3.bp.blogspot.com/-gApepE2m8ls/VhSrJIdiVKI/AAAAAAAAA14/HBgcySpMgmY/s72-c/DAFTAR%2BSITUS%2BAGEN%2BPOKER.PNG π

Warning: The following data tags will trigger a bX-1k6z5j error (last checked 4.20.10), if used when there's no thumbnail present: itemThumbnail.height, itemThumbnail.width, itemThumbnail.url. Always check for the presence of a thumbnail beforehand. The following code snippet will demonstrate how:

<b:if cond='data:item.itemThumbnail'>

Table of Contents | Top

Subscription Links Widget

widgetId: Subscribe1
isPublic: true
arrowDropdownImg: https://resources.blogblog.com/img/widgets/arrow_dropdown.gif π
feedIconImg: https://resources.blogblog.com/img/icon_feed12.png π
imagePathBase: https://resources.blogblog.com/img/widgets/ π
feeds: (list-type)
- index: 0
- title: Posts
- url: https://blogger2ools.mystady.com/feeds/posts/default π
- encodedUrl: https%3A%2F%2Fblogger2ools.mystady.com%2Ffeeds%2Fposts%2Fdefault π
- type: POST
- index: 1
- title: Comments
- url: https://blogger2ools.mystady.com/feeds/3519214775995950214/comments/default π
- encodedUrl: https%3A%2F%2Fblogger2ools.mystady.com%2Ffeeds%2F3519214775995950214%2Fcomments%2Fdefault π
- type: PER_POST
Subscription icon filenames. See Filename Usage below.
- subscribe-google.png
- subscribe-bloglines.png
- subscribe-netvibes.png
- subscribe-newsgator.png
- subscribe-yahoo.png

Combine imagePathBase with a filename to render an icon. The following code snippet renders the NewsGator icon:

<img expr:src='data:imagePathBase + "subscribe-netvibes.png"' />

And here's what it looks like:

Table of Contents | Top

Blog Posts Widget

showDummy false
dummyUrl
languageCode en
authorLabel: Posted by
showAuthor: true
timestampLabel: –
showTimestamp: true
commentLabel: comments
commentLabelPlural: comments
backlinkLabel:
*backlinksLabel:
postLabelsLabel: Labels:
reactionsLabel:
showReactions: false
blogCommentMessage: *COMMENT FORM MESSAGE*
numPosts 1

navMessage:
olderPageUrl: https://blogger2ools.mystady.com/2011/04/amazon-s3-hosted-jpg.html π
olderPageTitle: Older Post
newerPageUrl: https://blogger2ools.mystady.com/2011/04/amazon-s3-hosted-png.html π
newerPageTitle: Newer Post
homeMsg: Home

blogTeamBlogMessage:
feedLinksMsg: Subscribe to:
emailPostMsg: Email Post
editPostMsg: Edit Post
postCommentMsg: Post a Comment
commentPostedByMsg: said...
deleteCommentMsg: Delete Comment
deleteBacklinkMsg:

feedLinks: (list-type)
- index: 0
- url: https://blogger2ools.mystady.com/feeds/posts/default π
- name: Posts
- feedType: Atom
- mimeType: application/atom+xml

posts: (list-type)
- index: 0
- allowComments: true
- allowNewComments:
- embedCommentForm: false
- commentPagingRequired: false
- showBacklinks:
- hasJumpLink: false
- isDateStart: true
- isFirstPost: true
- id: 3519214775995950214
- dateHeader: Tuesday, April 12, 2011
- timestamp: 4/12/2011
- timestampISO8601: 2011-04-12T03:40:00-04:00
- author: mystady.com
- authorAboutMe:
- authorProfileUrl: https://www.blogger.com/profile/17782443978544199362
- authorPhoto.url:
- authorPhoto.width:
- authorPhoto.height:
- authorPhoto.thumbUrl:
- authorPhoto.thumbWidth:
- authorPhoto.thumbHeight:
- title: Amazon S3 Hosted JPEG
- snippet: Hosted on Amazon S3 using my own domain name.
- body:
  
  Hosted on Amazon S3 using my own domain name.
- firstImageUrl: http://fap.mystady.com/jpeg.jpeg π
- jumpText: Continue Reading →
- numComments: 0
- numBacklinks: 0
- adminClass: blog-admin pid-1578374961
- avatarIndentClass: avatar-comment-indent
- link: π
- url: https://blogger2ools.mystady.com/2011/04/amazon-s3-hosted-jpeg.html π
- editUrl: π
- emailPostUrl: https://www.blogger.com/email-post/8769510562916278720/3519214775995950214 π
- reactionsUrl: π
- addCommentUrl: https://www.blogger.com/comment/fullpage/post/8769510562916278720/3519214775995950214 π
- commentFormIframeSrc: π
- addCommentOnclick:
- appRpcRelayPath: π
- communityId:
- commentRangeText:
- oldLinkClass:
- olderLinkText: ‹Older
- olderLinkUrl:
- oldestLinkText: «Oldest
- oldestLinkUrl:
- newLinkClass:
- newerLinkText: Newer›
- newerLinkUrl:
- newestLinkText: Newest»
- newestLinkUrl:
- noNewCommentsText:
- backlinksLabel:
- commentLabelFull: No comments
- createLinkUrl:
- createLinkLabel:
- commentSource: 0
- showThreadedComments: 
- commentJso: 
- commentMsgs: 
- commentConfig: 
- commentHtml: 
- iframeCommentSrc: 
- cmtfpIframe: 
- iframeColorizer: 
- friendConnectJs: 
- feedLinks: (list-type)
  - index: 0
  - url: https://blogger2ools.mystady.com/feeds/3519214775995950214/comments/default π
  - mimeType: application/atom+xml
  - name: Post Comments
  - feedType: Atom
- labels: (list-type)
  - index: 0
  - name: Amazon S3
  - url: https://blogger2ools.mystady.com/search/label/Amazon%20S3 π
  - isLast:
  - index: 1
  - name: Images
  - url: https://blogger2ools.mystady.com/search/label/Images π
  - isLast: true
- enclosures: (list-type)
- backlinks: (list-type)
- comments: (list-type)

Table of Contents | Top

blogger2ools: A Data Tags Reference for Blogger Templates (2019 update)

Table of Contents

Globally Available Layout Data Tags

Page Header Widget

Notes

Blog Archive Widget

Profile Widget

Feed Widget

Code Snippets

Picture Widget

Labels Widget

Identifying Label Pages

Link List Widget

Blog List Widget

Page List Widget

Blog Posts Widget

Blog Configuration

Page Navigation

System Messages

Blog Page Feed Links

Posts List

blogger2ools: A Data Tags Reference for Blogger Templates (2019 update)

Table of Contents

Globally Available Layout Data Tags

Page Header Widget

Notes

Blog Archive Widget

Profile Widget

Feed Widget

Code Snippets

Picture Widget

Labels Widget

Identifying Label Pages

Link List Widget

Blog List Widget

Subscription Links Widget

Filename Usage

Page List Widget

Blog Posts Widget

Blog Configuration

Page Navigation

System Messages

Blog Page Feed Links

Posts List