An Important Update

Dear Followers Of This Blog ...

If you did not use a Blogger / Google account when you Followed this blog, years ago, you are probably not Following now . During the past...

Thursday, October 28, 2010

Conditionally Displaying Template Objects

Some time ago, I wrote how to make a static home page, where the key element was an HTML gadget, tweaked to display only when the home page of the blog is being displayed. That's a useful tweak, and it's a tweak that can be used in various other conditional displays also.

If you know a little template XML code, you can construct alternate conditional statements, and have template objects display in any of several other specific conditions.

You'll probably recognise the first conditional, from the above example, which shows how to display a Welcome post on the home page.



<b:if cond='data:blog.url != data:blog.homepageUrl'> <style> #Text1 {display: none !important;} </style> </b:if>

As a second example, I'll offer my Labels list displayed on a static page. For a third example, I'll offer my expanded Followers page.

Any of the snippets shown below can be substituted for the conditional snippet, above - which is the one used in the first example - to get the desired result. The seventh snippet below, for instance, was used for the Labels list.

Note when you add conditional code to the template, you are adding an additional filter. Your added code may be subject to other conditionals, already in place.

Be observant, and note where the specific objects, that you are modifying, show up, before you add any modifications. Your added conditional won't make an object show up, where it did not before - it will only make it not show up, where it did before.

Identify the gadget to be displayed conditionally - and change the gadget identifier, as needed.

Having written the conditional code section as desired, use the Template Designer "Add CSS" wizard, and add the code. Remember to add blank lines above and below the code section being added.

  1. Homepage:
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    or (with the blog published to "blogspot.com")
    <b:if cond='data:blog.canonicalUrl == data:blog.homepageUrl'>
  2. All Archive Pages:
    <b:if cond='data:blog.pageType == "archive"'>
  3. All Main Pages (Archive, Label, "Home" page and all "Newer / Older Posts"):
    <b:if cond='data:blog.pageType == "index"'>
  4. All Post Pages:
    <b:if cond='data:blog.pageType == "item"'>
  5. All Static Pages:
    <b:if cond='data:blog.pageType == "static_page"'>
  6. All Individual Posts:
    <b:if cond='data:blog.pageType == "item"'>
  7. Any Specified Page (Static Page, or Post URL - your choice):
    <b:if cond='data:blog.url == &quot;{URL}&quot;'>
    or (with the blog published to "blogspot.com")
    <b:if cond='data:blog.canonicalUrl == &quot;{URL}&quot;'>
  8. Any Other Than The Specified Page (Static Page, or Post URL - your choice):
    <b:if cond='data:blog.url != &quot;{URL}&quot;'>
    or (with the blog published to "blogspot.com")
    <b:if cond='data:blog.canonicalUrl != &quot;{URL}&quot;'>
  9. Any Other Than The Homepage:
    <b:if cond='data:blog.url != data:blog.homepageUrl'>
    or (with the blog published to "blogspot.com")
    <b:if cond='data:blog.canonicalUrl != data:blog.homepageUrl'>

Develop, and identify, {URL} with precision.

Note that "{URL}" refers to the URL of an actual page or post, such as
http://blogging.nitecruzr.net/2010/10/conditionally-displaying-template.html

The value of "{URL}" must be provided with excruciating precision. It's best to display the page / post in question, then copy the URL from the address window, and paste it into your new conditional.

If {URL} includes "blogspot", be sure to use a canonical URL comparison!

When {URL} includes "blogspot", compare against a canonical URL!

Note in cases #1, #7, #8, and #9 - where {URL} is involved (not "data:blog.pageType"), you need to compare using the canonical URL. You do not use the country specific URL - even if you are seeing a country specific URL, for a blog published to BlogSpot.

If your blog is displayed as "myblog.blogspot.co.uk" (if you are, for instance, in the UK), you need to use "myblog.blogspot.com".

If a custom domain is involved, use the actual published URL.

If you are specifying a custom domain, do not canonise the URL, specify the actual published URL (for instance "www.mydomain.co.uk").

Syntax is crucial Be very careful, when entering punctuation.

Note that the above instructions show the format of the opening "<b:if ... >". Each "<b:if ... >" must be properly paired with a carefully located closing "</b:if >".

If you are unfamiliar with the concept of conditionals, and proper pairing of the opening and closing tags, please review my example, which shows how to display a Welcome post on the home page.

Be careful when entering the above statements. Single quotes ('), literal quotes (&quot;), and double quotes ("), are interchangeable in pairs - only in specific cases. Use them, in the appropriate circumstances - and correct sequence - religiously.

' ... &quot; ... &quot;'

' ... " ... "'

or

(single quote) ... (literal quote) ... (literal quote) (single quote)
(single quote) ... (double quote) ... (double quote) (single quote)

Open, then close, in reversed order.

Also, note the spaces, surrounding the conditional operator ("equal", or "not equal"), in each statement. The spaces are not decorative, they are functional.
 == 
 != 

Always include the spaces.

Try one or two. Just don't forget to backup the template, before and after applying any tweak.

---




One way to organise a #Blogger blog layout is to display specific accessories and gadgets on specific pages, in the blog. Blogger, however, provides no feature to let us easily do this.

If you are able to use the Template Designer "Add CSS" wizard - or Template Editor - you can add conditional CSS rules which will make accessories and gadgets seem to be visible only on specific pages.

Dude, hit me with a comment!

.brittney. said...

Is it possible to use two of these conditional codes for one widget/blog element? What if, for example, I only wanted my labels widget to appear on two static pages and no where else. Is this possible? Thanks!

support@iHateMyBra said...

This is awesome.

Thank you for all you do!

Coach Sharon said...

I've been reading as many helps on this but am still confused. I tried some code changes as instructed without success. Either I missed something or need something more/different. Here is what I want to do:

Have the archive gadget applied to a "blog" page only, rather than the homepage. The homepage is just a welcome page basically that will occasionally change. No blogging done on homepage. The archive links can be seen on each page but only posts from the "blog" page would be listed. How do I do that?

Here's the eblogger website, www.roseofbellarose.com.

Chuck said...

Sharon,

You really need to discuss this in Blogger Help Forum: How Do I?, and we'll work on this together.

John said...

Thank you very kindly! I followed your instructions, and it worked perfectly. The precise and careful explanation is appreciated.

Omne M said...

Hi, is there a same method for removing the elements from static pages? I like to remove all social links from post footers as well as labels and header date.

Chuck Croll said...

Omne,

Any page in your blog - whether dynamic (" ... /2012/07/ ..." or " ... /search/label/ ... ") or static (" ... /p/ ...") - can be included in a conditional, as long as you can provide the URL.

http://blogging.nitecruzr.net/2012/04/blogger-limits-pages-dynamic-and-static.html