Today is the common problem is "How To Display Gadgets Or Widgets Or HTML Codes That Are Added To Your Blogspot Template On Your Desire Page/Post In Your Blog With Little CSS Code?", Ther just give you the codes and you did not want that on every page or post, So the time is over now you just get html code and display it there where you want to show it.
When you add the html for a gadget to your blog and want to show it only on your desired page, post or place, then just add a snippet of your desired from given below to your code above it and a closing tag below it. Remember for some gadgets and code that also have CSS, JavaScript And JQuery Codes. They generally direct you to add there Css code you added above ]]></b:skin> and there Script code above </head>. But why you have to do this as you have to allow your widget or code to displayed over your desired single page but there CSS-JavaScript on every page that will make your load time heavy and that will annoy your visitor? Then you also add your that code CSS-Script code also in it.
What Are These Codes?
Blogger conditional tags usually have the <b:if cond=..> starting and an ending of </b:if>.These codes are actually the condition that we keep.We use blogger conditional tags to show certain things only in homepage.or some other things only in post pages.We can there by control where the widget or item should be visible.Lets go into further details Now you understand it, here we come directly to the code that are also known as "Blogger Conditional Tags". Here we have most wanted code.Blogger conditional tag is very important in blogger, because this fonction can make every blogger page different style, not only style CSS but you can put anything. In internet has already many tutorial about this, but it's only a basic tutorial, this tutorial is not basic but advanced, not only page but it can be used for any condition. Ok now for the article....
Features:
1.) 15 Blogger Conditional Tags Collection.2.) Quick To Load And Easy To Install.
3.) Work With Every Codes.
4.) Official Tags Codes.
5.) Only Be Used In Blogger Template.
How To Add In Blogspot?
1.) Go To Your www.blogger.com2.) Open Your Desire Blog.
3.) Go To "Template".
4.) Click "Edit HTML".
5.) Now Click Within Code Box.
6.) Now Copy The Below Code And Paste It Between "<head> </head>" Or "<body> </body>".
7.) Click "Save Template" And Done.
Code Will Be Only On Post Pages:-
The tag we add to the html so it only appears on post pages is this :<b:if cond='data:blog.pageType == "item"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On Home Page Only:-
The code will be displayed only on your home page.<b:if cond='data:blog.url == data:blog.homepageUrl'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On Everything Except Post Pages:-
The code will be displayed only on (Home page, Labels pages, Archive pages etc).<b:if cond='data:blog.pageType == "index"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>Code Will Be Only On One Post Or On Page:-
The code will be displayed only on one post or page.*) Change The Below Text With Your Desire URL.
<b:if cond='data:blog.url == "URL-Of-Post/Page"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>Code Will Be Only On All Static Pages:-
The code will be displayed only on the static pages.<b:if cond='data:blog.pageType == "static_page"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>Code Will Be Only On Selected Author Posts:-
The code will be displayed only on Selected Author Posts.*) Change The Below Text With Your Desired Author Name As In Blogger Profile.
<b:if cond='data:post.author == "Author-Name"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>Code Will Be Only On 404 Error Page:-
The code will be displayed only on 404 Posts.<b:if cond='data:blog.pageType == "error_page";'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On Archive Page:-
The code will be displayed only on archive page like http://www.exeideas.com/2013_01_01_archive.html<b:if cond='data:blog.pageType == "archive"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On Post And Static Page:-
The code will be displayed only on only on post and static page.<b:if cond='data:blog.pageType == "data:post.url"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On First Post:-
The code will be displayed only on first post.<b:if cond='data:blog.pageType == "data:post.isFirstPost"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On Label Page:-
The code will be displayed only on serach label page or label page like http://www.exeideas.com/search/label/anylabel.<b:if cond='data:blog.pageType == "data:blog.searchLabel"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On Query Search Page:-
The code will be displayed only on query serach page like http://www.exeideas.com/search?q=anything<b:if cond='data:blog.pageType == "data:blog.searchQuery"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On Selected Query Search Page:-
The code will be displayed only on selected query serach page like http://www.exeideas.com/search?q=css*) Change The Below Text With Your Desired Query Keyword.
<b:if cond='data:blog.searchQuery == "The-Query-Keyword"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On Selected Label Page:-
The code will be displayed only on selected label page like http://www.exeideas.com/search/label/Blogspot*) Change The Below Text With Your Desired Label Name.
<b:if cond='data:blog.searchLabel == "Name-Of-Label"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Code Will Be Only On Mobile Template:-
The code will be displayed only on Mobile template like http://www.exeideas.com?m=1<b:if cond='data:blog.pageType == "data:blog.isMobile"'>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
Reversing Any Condition:
A condition can be reversed simply by replacing the comparison operator from == (is equal to) to != (is not equal to), like so:<b:if cond="data:blog.pageType != "item"">
THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS
</b:if>
In the example above, the content will only appear on pages other than post pages (i.e. removed/hidden from post pages). This method is not applicable to Label Search and First Post conditionals.
Customization:
1.) Just Add Your HTML Code By Replacing "THE-HTML-CODE-GOES-HERE-BETWEEN-THE-TAGS" With Your Desired Code.2.) Save And Done.
0 comments:
Post a Comment