Understanding All Blogger (Blogspot) Page Types ~ technology

Page Type
The classifification (or type) of the page in question. Blogger uses various types of pages to display information. For example, search results on Blogger are displayed via search pages. Terms like "search page", "search type", and "search page type" mean the same thing and are used interchangeably in this document.

Globally Available Layout Data Tags
They get their name from the fact that you can use these tags literally anywhere in your template code. Think of the possibilities! These tags have the blog. prefix. This guide may sometimes omit the prefix for brevity. Every tag in the data matrix is global.
blog.title Tag
Returns the value of what you entered as your blog title. This can be found under Settings > Basic > Title.
blog.pageType Tag
This is the actual globally available layout data tag. The pageType tag returns a value of item, static_page, archive, index, or error_page.

Item Page Type
These are your blog posts. Fun fact: You used to have to enable post pages in the dashboard but everyone now has them on by default. I’m thinking this was changed with the permalink rollout. Before permalinks they would pull up your blog post with query strings. Not too SEO-friendly, is it? Only someone who’s been using Blogger as long as I have would remember a thing like that.

Item Page Type Data Matrix
Data Tag	Result
`blog.title`	`(blog title)`
`blog.pageTitle`	`(blog title): (blog post title)`
`blog.pageName`	`(blog post title)`
`blog.pageType`	`item`
`blog.searchLabel`
`blog.searchQuery`
`blog.url`	`(homepage URL)YYYY/MM/(permalink)`
`blog.homepageUrl`	`(homepage URL)`

This code snippet will identify item pages:

<b:if cond='data:blog.pageType == "item"'>
  <!--Item Page-->
</b:if>

Static Page Type
You can publish content as stand-alone, or static, pages. These are what you use to go about adding the standard “About” or “Contact” pages.

Static Page Type Data Matrix
Data Tag	Result
`blog.title`	`(blog title)`
`blog.pageTitle`	`(blog title): (static page title)`
`blog.pageName`	`(static page title)`
`blog.pageType`	`static_page`
`blog.searchLabel`
`blog.searchQuery`
`blog.url`	`(homepage URL)p/(permalink)`
`blog.homepageUrl`	`(homepage URL)`

This code snippet will identify static pages:

<b:if cond='data:blog.pageType == "static_page"'>
  <!--Static Page-->
</b:if>

Archive Page Type

Ideally, any link you click from the Blog Archive widget would take you to an archive page but that's not the way it works. The pageType tag will only return a value of archive for pages whose filename ends in archive.html. Most links generated by the Blog Archive widget follow this format. The remainder use query parameters. Any page formatted that way has a pageType value of index.


This affects Blog Archive widgets using the Hierarchy style because it generates some pages using search queries. In general, search queries (when the URL is your homepage followed by /search? or /search/), return a pageType value of index.

There's a similar problem with the navigation links generated by the Blog widget on archive pages. Instead of linking to other archive pages (pages that end in archive.html), they link to search queries. And once again, these search queries return the index value.
Thus, any customizations you have for archive page types are lost by the next page, and your visitors will have an inconsistent experience.

This problem affects all three Blog Archive widget styles. Also, the search queries themselves are malformed half the time which leads to posts getting skipped or repeated.
Only use the Flat List and Dropdown Menu styles when configuring the Blog Archive widget.
Omit navigation links from archive pages.
Add another Blog Archive widget (that only appears on archive pages), in place of the navigation links.
And finally, style the widget so it looks like it belongs there.

Archive Page Type Data MatrixData TagResult
blog.title(blog title)
blog.pageTitle(blog title): (date)
blog.pageName(date)
blog.pageTypearchive
blog.searchLabel
blog.searchQuery
blog.url(homepage URL)YYYY_MM_DD_archive.html
blog.homepageUrl(homepage URL)

This code snippet will identify archive page types but keep those caveats in mind. Hmm, are they caveats or bugs? Makes you think…

<b:if cond='data:blog.pageType == "archive"'>
  <!--Archive Page-->
</b:if>

Error Page Type

This is how your 404 pages are identified. And as you can see from the link above, you can customize the message that appears. You can even use HTML! The message is returned by navMessage inside the Blog Posts widget. By default this message reads: Sorry, the page you were looking for in this blog does not exist.

Error Page Type Data MatrixData TagResult
blog.title(blog title)
blog.pageTitle(blog title)
blog.pageName
blog.pageTypeerror_page
blog.searchLabel
blog.searchQuery
blog.url(current page URL)
blog.homepageUrl(homepage URL)

The code for error pages is straightforward.

<b:if cond='data:blog.pageType == "error_page"'>
  <!--Error Page-->
</b:if>

Home Page Type
This identifies the default URL of your blog, also known as your homepage. You can find it under Settings > Basic > Publishing > Blog Address in the Blogger dashboard. The blog.homepageUrl global tag always returns the same value no matter what type of page you’re viewing: your homepage.

Home Page Type Data MatrixData TagResult
blog.title(blog title)
blog.pageTitle(blog title)
blog.pageName
blog.pageTypeindex
blog.searchLabel
blog.searchQuery
blog.url(homepage URL)
blog.homepageUrl(homepage URL)

This code snippet will let you know you’re on the homepage.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
  <!--Homepage-->
</b:if>

Search Page Type

Now here’s where we start getting creative! For the next four page types the pageType tag only returns a value of index. This is why I mapped the data matrix. Search pages display the results of a search performed using Blogger's built-in search form. This is not to be confused with the Search Box gadget.

You should know that the built-in search is extremely limited: it only searches from a pool of the most recent posts, older posts are ignored and labels are ignored.

The searchQuery global tag returns the value of what the user searched for.

The second instance of blog.url is to illustrate how the URL changes when you navigate to the next page of results.

Search Page Type Data MatrixData TagResult
blog.title(blog title)
blog.pageTitle(blog title): Search results for (search terms)
blog.pageNameSearch results for (search terms)
blog.pageTypeindex
blog.searchLabel
blog.searchQuery(search terms)
blog.url(homepage URL)search?q=(search terms)
blog.url(homepage URL)search?q=(search terms)&(query strings)
blog.homepageUrl(homepage URL)

Here’s my code snippet for search pages. It’s been factored down from before and now uses two less lines!

<b:if cond='data:blog.pageType == "index" and data:blog.searchQuery'>
  <!--Search Page-->
</b:if>

Label Page Type

Label Pages are generated by the labels widget. You may only view one label at a time. There is no way to combine multiple labels for viewing. I've tried it! There is also a bug affecting ALL label widgts by default. Head on over to blogger2ools to read about this bug and download my fix. The blog.searchLabel tag gives you the label name.Every label has its own RSS feed.
(homepage URL)feeds/posts/default/-/(label name)
The second instance of blog.url is to illustrate how the URL changes when you navigate to the next page of results.

Label Page Type Data MatrixData TagResult
blog.title(blog title)
blog.pageTitle(blog title): (label name)
blog.pageName(label name)
blog.pageTypeindex
blog.searchLabel(label name)
blog.searchQuery
blog.url(homepage URL)search/label/(label%20name)
blog.url(homepage URL)search/label/(label%20name)?(query strings)
blog.homepageUrl(homepage URL)

Here’s the label code. It’s also been refactored.

<b:if cond='data:blog.pageType == "index" and data:blog.searchLabel'>
  <!--Label Page-->
</b:if>

Index Page Type
By order of elimination we are left with the index page type. As I stated back in the Archive Page Type section, when a page is generated using query parameters the pageType tag returns a value of index. So basically anything that isn't one of the seven previously mentioned page types we'll consider to be an index page.

Index Page Type Data MatrixData TagResult
blog.title(blog title)
blog.pageTitle(blog title)
blog.pageName
blog.pageTypeindex
blog.searchLabel
blog.searchQuery
blog.url(current page URL)
blog.homepageUrl(homepage URL)

Here’s the code for finding index pages. As you can see it’s just trying to eliminate all other possibilities.

<b:if cond='data:blog.pageType == "index" and data:blog.searchQuery == "" and data:blog.searchLabel == "" and data:blog.url != data:blog.homepageUrl'>
  <!--Index Page-->
</b:if>

Putting It All Together (Revised!)
The following code snippet comes directly from my own template here at MY STADY. I use this snippet as a guide for when customizing multiple or even all eight Blogger Page Types. If you're SEO-obsessed this is probably what you're looking for. We use this snippet in the header and Blog Widget portion of our code. For other sections it's not as important to customize for every different page type. Use it wisely!

This code has been revised.You now have WAY LESS </b:if>s to deal with. It's only 22 lines versus the original 29. But if you remove the error page code (which wasn't there), the code would only be 20 lines.

<b:switch var='data:blog.pageType'>
    <b:case value='archive' />
    <!--Archive-->
    <b:case value='error_page' />
    <!--Error-->
    <b:case value='item' />
    <!--Item-->
    <b:case value='static_page' />
    <!--Static-->
    <b:default />
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
        <!--Homep-->
        <b:elseif cond='data:blog.searchQuery == &quot;&quot; and data:blog.searchLabel == &quot;&quot;'/>
        <!--Index-->
    </b:if>
    <b:if cond='data:blog.searchQuery'>
        <!--Search-->
    </b:if>
    <b:if cond='data:blog.searchLabel'>
        <!--Label-->
    </b:if>
</b:switch>

Recent Posts

Recent Posts

Labels

Understanding All Blogger (Blogspot) Page Types

Item Page Type

Static Page Type

Archive Page Type

Error Page Type

Home Page Type

Search Page Type

Label Page Type

Index Page Type

Putting It All Together (Revised!)

No comments:

Post a Comment

Trending

Social Media