Howi.In

Blogger Template Designing Tutorial Part 2

<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center;">
<a href="http://3.bp.blogspot.com/-NhTZvIQSUco/VkjMsdQD7SI/AAAAAAAAHD8/lG47unlUFto/s1600/Blogger%2BTemplate%2BDesigning%2BTutorial-min.png" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Blogger Template Designing Part 2" border="0" src="http://3.bp.blogspot.com/-NhTZvIQSUco/VkjMsdQD7SI/AAAAAAAAHD8/lG47unlUFto/s1600/Blogger%2BTemplate%2BDesigning%2BTutorial-min.png" title="Blogger Template Designing Part 2" /></a></div>
<h2 style="text-align: left;">
Introduction:</h2>
<div>
In the previous post we learned about some great tags that used in Blogger for designing Blogger Templates such as <b><b:skin></b>, <b><b:widget></b>, <b><b:section></b>, Etc. Today we are going to learn about a new tag that will help to manage our Blogger Title Tag. We know that Blogger Blogs will display Titles in two way's, a static Title for Homepage and Dynamic one for Blog-Posts. We can know that a web page can only run one Title at a time; It will not run Two Titles at a time. So we have to use an (<b>IF</b>) condition on the header of Blogger Template to detect whether the visitor of a blog was on Homepage of the blog or not.</div>
<iframe allowfullscreen="" frameborder="0" height="350" src="https://www.youtube.com/embed/xS52Ug4Vaww?rel=0" width="820"></iframe>

<br />
<h4 style="text-align: left;">
Blogger Template Designing Part 2: Adding of Title Tags:</h4>
<div>
It is very easy to add Title to a Blogger Template if you know the basic programming concept of (<b>IF</b>). We use (<b>IF</b>) Condition to check whether a condition was true or not.<br />
<b>Example:</b></div>
<pre class="brush: js;">set name="Muhsin";
//the variable "name" Now have the value="Muhsin"// 
if(name=="Muhsin")// Checking condition with if
{
print: name was correct // Print if the condition was true
}
else
{
print: name was incorrect //print if the condition was not true
}
</pre>
Like the following example that I gave above this text, We can use the (<b>IF</b>) condition Tag in Blogger for showing specified title for blog Homepage and Blog-Posts.<br />
<h4 style="background-color: white; color: #333333; font-family: Bitter, serif, sans-serif; font-size: 18.2px; font-stretch: normal; font-weight: normal; margin-bottom: 10px;">
Full Code That Defined in The Tutorial Video:</h4>
<pre class="brush: js;"><head>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<title>MY FIRST</title>
<b:else/>
<title><data:blog.pageName/></title>
</b:if>
 <b:skin><![CDATA[
  ]]></b:skin>
</head></pre>
Here on the above code "<b><b:if cond='data:blog.pageType != &quot;item&quot;'></b>" will check whether the user was in blog Homepage or Not. If the user was in Homepage of the blog, then the "<b>MY FIRST</b>" Title Tag will run otherwise it run the "<b><title><data:blog.pageName/></title></b>" Tag. The "<b><data:blog.pageName/></b>" will display the Title of the blog-post were currently the user was standing.<br />
<h4 style="text-align: left;">
<span style="font-weight: normal;">Use of <data:blog.pageName/> in Blogger Template:</span></h4>
<div>
The main use of <b><data:blog.pageName/></b> in Blogger Template designing is to show the title of the post were the a visitor of a blog currently standing. By using this Tag, we can show specified Widgets, Images, Videos, Etc for specified Blog-Post or page.</div>
<h4 style="text-align: left;">
Use of <b:if cond='data:blog.pageType != &quot;item&quot;'> in Blogger Template:</h4>
<div>
The use of  <b><b:if cond='data:blog.pageType != &quot;item&quot;'></b> in Blogger Template is to check wather the current page was Homepage or Not. We can use this Tag for showing Widgets and other scripts runs only in Homepage of Blogger Blog.</div>
<h4 style="text-align: left;">
Suggested Article for Blogger Template Designers:</h4>
<div>
<ul style="text-align: left;">
<li>Blogger Template Designing Part 3: Add of Widget Section</li>
</ul>
<div>
<div>
I hope you well understood the matter that I specified through this article If you have any doubts or suggestions related to this article. Please let me know by using the comment box that given below or on my Facebook Page. Thanks</div>
</div>
</div>
</div>

Blogger Template Designing Tutorial Part 2

Introduction: In the previous post we learned about some great tags that used in Blogger for designing Blogger Templates such as <b...

+ Read more »