Using conditional tags, you can hide/show content on specific post/page/label/sidebar etc.
In this tutorial, I will share or update all blogger conditional tags and how to use them properly in your template.
1. Conditional Tag Use
First you need to know how to use them. See below example:
<b:if cond='ADD_CONDITION_HERE'> ADD CONTENT HERE </b:if>
The conditional tags syntax start with <b:if> tags and a cond attributes. Condition need to write as the value of cond attribute. Every opening <b:if> tag need to be closed with a closing </b:if> tag.
2. All Blogger Conditional Tags List
Below I have listed all blogger conditional tags. Recently blogger released new condition tags for specific label, I also added this.
Homepage
<b:if cond='data:blog.url == data:blog.homepageUrl'> ADD CONTENT HERE </b:if>
Blog Post/Article Page
<b:if cond='data:blog.pageType == "item"'> ADD CONTENT HERE </b:if>
Index Page
Index pages include homepage, label page, search page and yearly archive page.
Static page means blogger page which we created by blogger page section.
<b:if cond='data:blog.url == data:post.url'> ADD CONTENT HERE </b:if>
Label and Search Pages
<b:if cond='data:blog.searchLabel'> ADD CONTENT HERE </b:if>
Specific Label
Change PUT_LABEL_NAME_HERE with your label name. Label name is case sensitive.
<b:if cond='data:blog.pageType == "archive"'> ADD CONTENT HERE </b:if>
Specific page/URL
Change PUT_URL_HERE with any page/post/label etc url<b:if cond='data:blog.url == "PUT_URL_HERE"'> ADD CONTENT HERE </b:if>
404 Error Page
<b:if cond='data:blog.pageType == "error_page"'> ADD CONTENT HERE </b:if>
First Post
This is not for a page type. It's used for targeting the posts on multi-post pages like
To apply a conditional tag to a content, you need to put your content between the opening <b:if cond..> and closing </b:if>. Example see below
By putting <b:else/> tag, you can add multiple condition. It means that if first condition not work then execute second condition to all of pages. See example below
Above example means that execute content-1 in post page. If it's not post page then execute content-2.
Applying Reverse Conditional Tags
If you want to reverse a conditional tag, you can do it by changing comparison operator from == (is equal to) to != (is not equal to).
In this tutorial, I will share or update all blogger conditional tags and how to use them properly in your template.
1. Conditional Tag Use
First you need to know how to use them. See below example:
<b:if cond='ADD_CONDITION_HERE'> ADD CONTENT HERE </b:if>
The conditional tags syntax start with <b:if> tags and a cond attributes. Condition need to write as the value of cond attribute. Every opening <b:if> tag need to be closed with a closing </b:if> tag.
2. All Blogger Conditional Tags List
Below I have listed all blogger conditional tags. Recently blogger released new condition tags for specific label, I also added this.
Homepage
<b:if cond='data:blog.url == data:blog.homepageUrl'> ADD CONTENT HERE </b:if>
Blog Post/Article Page
<b:if cond='data:blog.pageType == "item"'> ADD CONTENT HERE </b:if>
Index Page
Index pages include homepage, label page, search page and yearly archive page.
<b:if cond='data:blog.pageType == "index"'> ADD CONTENT HERE </b:if>
Static Pages
Static Pages
Static page means blogger page which we created by blogger page section.
<b:if cond='data:blog.pageType == "static_page"'> ADD CONTENT HERE </b:if>
Post and Static Pages
Post and Static Pages
<b:if cond='data:blog.url == data:post.url'> ADD CONTENT HERE </b:if>
Label and Search Pages
<b:if cond='data:blog.searchLabel'> ADD CONTENT HERE </b:if>
Specific Label
Change PUT_LABEL_NAME_HERE with your label name. Label name is case sensitive.
<b:if cond='data:post.labels any (l => l.name == "PUT_LABEL_NAME_HERE")'> ADD CONTENT HERE </b:if>
Archive Pages
Archive Pages
<b:if cond='data:blog.pageType == "archive"'> ADD CONTENT HERE </b:if>
Specific page/URL
Change PUT_URL_HERE with any page/post/label etc url<b:if cond='data:blog.url == "PUT_URL_HERE"'> ADD CONTENT HERE </b:if>
404 Error Page
<b:if cond='data:blog.pageType == "error_page"'> ADD CONTENT HERE </b:if>
First Post
This is not for a page type. It's used for targeting the posts on multi-post pages like
(index,archive,label,search query).
<b:if cond='data:post.isFirstPost'> ADD CONTENT HERE </b:if>
Applying Conditional Tags
Applying Conditional Tags
To apply a conditional tag to a content, you need to put your content between the opening <b:if cond..> and closing </b:if>. Example see below
<b:if cond='data:blog.pageType == "item"'> CONTENT (TO BE EXECUTED IF CONDITION IS TRUE) </b:if>
The above example means that the content will appear only on post pages.
Applying Multiple Conditional Tags
The above example means that the content will appear only on post pages.
Applying Multiple Conditional Tags
By putting <b:else/> tag, you can add multiple condition. It means that if first condition not work then execute second condition to all of pages. See example below
<b:if cond='data:blog.pageType == "item"'> Content-1 EXECUTE IF TRUE <b:else/> Content-2 EXECUTE IF FALSE </b:if>
Above example means that execute content-1 in post page. If it's not post page then execute content-2.
Applying Reverse Conditional Tags
If you want to reverse a conditional tag, you can do it by changing comparison operator from == (is equal to) to != (is not equal to).
<b:if cond='data:blog.pageType != "item"'> CONTENT (TO BE EXECUTED IF CONDITION IS TRUE) </b:if>
In the example above, the content will appear all of pages except post page. Remember that you can not apply this method to Label-Search and First Post conditionals.
Remember: You can place all of conditional anywhere inside the template HTML. It will not work on blogger Layout like (Add a Gadget>HTML/Javascript)
That's it. I think that it will help you to customize your template as your wish.
In the example above, the content will appear all of pages except post page. Remember that you can not apply this method to Label-Search and First Post conditionals.
Remember: You can place all of conditional anywhere inside the template HTML. It will not work on blogger Layout like (Add a Gadget>HTML/Javascript)
No comments:
Post a Comment