How to display a widget on a specified page in Blogger

From this tutorial, you will be able to control whether or not to have a widget displayed on a specific page of your Blogger blog. When designing your Blogger’s template, you may prefer to have certain elements to be displayed on certain pages of your blog. This can come handy for any blog and can be done with the use of the if conditional tags.


Before you begin, make sure you back up your current template in case it doesn’t turn out as expected.

In order for Blogger to detect a widget on your template, you must first create one and place it where you would want it to appear. Here’s a screen shot of mine:
Steps to follow:

1. Login to your Bloggers dashboard

2. Go to Layout > Edit HTML (Click on “expand widgets” box)

3. Locate the widget code you’ve just added. Here’s a screen shot of mine:

To display only on home page
Once you’ve located your widget section code, add the following section code in red to its location:

<b:widget id='HTML8' locked='false' title='Tips Categories:' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

To display only on all post pages but not the home page
Once you’ve located your widget section code, add the following section code in red to its location:

<b:widget id='HTML8' locked='false' title='Tips Categories:' type='HTML'>
<b:includable id='main'>

<b:if cond='data:blog.pageType == "item"'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

To display only on archive page
Once you’ve located your widget section code, add the following section code in red to its location:

<b:widget id='HTML8' locked='false' title='Tips Categories:' type='HTML'>
<b:includable id='main'> <b:if cond='data:blog.pageType == "archive"'>

<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

To display only on a specified link from your blog
Once you’ve located your widget section code, add the following section code in red to its location:

<b:widget id='HTML8' locked='false' title='Tips Categories:' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == &quot;http://www.blogspotvision.com/search/label/tips&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

note: replace the link in blue with the link you want it to show up on.

How to manually add tabbed contents to your Blogger blog

From this tutorial, you will be able to add tabbed contents to your Blogger’s blog. Tabbed contents are usually placed in sidebars to save space and reduce loading time, it can also be appealing to have in some templates. Widgets that are usually placed inside tabbed contents to reduce loading time are the archive, labels, about the author, subscribe box, recent posts/comments, and social networking updates, such as twitter and facebook. Before attempting any tutorials, make sure you back-up your existing template just in case it doesn’t turn out as expected.

Steps to follow:

1. Login to your Blogger dashboard

2. Go to Layout > Edit HTML (Do not click on “expand widgets” box)

3. Search for the following section code:

]]></b:skin>

and add the following section code immediately after it:

<link href='http://www.blogspotvision.com/bspotvision/tabbedcontent/tabview.css' rel='stylesheet' type='text/css'/>
<link href='http://www.blogspotvision.com/bspotvision/tabbedcontent/border_tabs.css' rel='stylesheet' type='text/css'/>
<script src='http://www.blogspotvision.com/bspotvision/tabbedcontent/yahoo-dom-event.js' type='text/javascript'/>
<script src='http://www.blogspotvision.com/bspotvision/tabbedcontent/element-beta-min.js' type='text/javascript'/>
<script src='http://www.blogspotvision.com/bspotvision/tabbedcontent/tabview-min.js' type='text/javascript'/>

<style type='text/css'>
.yui-content { padding:1em; /* pad content container */
}
.yui-navset .yui-content {
border:1px solid #ccc;
}
.yui-navset .yui-nav .selected a, .yui-navset .yui-nav a:hover {
background-color:#fff;
}
.yui-navset .yui-nav li a {
background:#e5e5e5 url(http://developer.yahoo.com/yui/examples/tabview/img/round_4px_trans_gray.gif) no-repeat;
}
.yui-navset .yui-nav li a em {
background:transparent url(http://developer.yahoo.com/yui/examples/tabview/img/round_4px_trans_gray.gif) no-repeat top right;
padding:0.5em;
}
/* top oriented */
.yui-navset-top .yui-nav { margin-bottom:-21px; } /* for overlap, based on content border-width */
.yui-navset-top .yui-nav li a {
border-bottom:1px solid #ccc;
}
.yui-navset-top .yui-nav .selected a { border-bottom:0; }
.yui-navset-top .yui-nav .selected a em { padding-bottom:0.6em; } /* adjust height */
</style>

4. Next, go to Layouts > Page Elements, and click Add a Gadget.

5. Copy and paste the following section code in it and click Save.

<div id="demo" class="yui-navset">
<ul class="yui-nav">
<li><a href="#tab1"><em>Tab1</em></a></li>
<li class="selected"><a href="#tab2"><em>Tab2</em></a></li>
<li><a href="#tab3"><em>Tab3</em></a></li>
</ul><br/>
<div class="yui-content">

<div id="tab1"><p>Tab One Content</p></div>
<div id="tab2"><p><ul><li><a href="http://yourblog.blogspot.com/search/label/yourlabel/">Your Label/Link text</a></li></ul></p></div>
<div id="tab3"><p>Tab Three Content</p></div>
</div>
</div>
<script>
(function() {
var tabView = new YAHOO.widget.TabView('demo');

YAHOO.log("The example has finished loading; as you interact with it, you'll see log messages appearing here.", "info", "example");
})();
</script>

6. Your done, if you want to add your labels in one of the contents, you will have to add them manually. The following section code highlighted in red indicates a link, for example:

<div id="tab2"><p><ul><li><a href="http://yourblog.blogspot.com/search/label/yourlabel/">Your Label/Link text</a></li></ul></p></div>

Four simple shortcuts to instantly boost revenue

Here are four ways to instantly boost your revenue. If you’re a beginner and just now starting a blog, you’ve most likely found it a bit frustrating and almost impossible to generate even ten dollars. Pushing the revenue line to the right can almost make you give up hope at times if your blog isn’t producing any income. Whether you’re just starting to learn about adsense or affiliates, or in the process, here are four ways to instantly generate or boost revenue. Don’t give up hope just yet until you’ve implemented these simple shortcuts.

1. Connect your blog to social networking sites – If you haven’t already, you should start connecting your blog or blogs to, if not all, the most popular social networking websites operating today. Social networks can provide great promotions and open a door for more traffic while allowing you to connect with others who is after the same thing you are. Some of today’s most popular social networking sites include:

MySpace

Facebook

Xanga

Orkut

2. Provide quality sites/content – Providing quality content will also boost revenue, assuming your ads are placed in the right spots. You can create 1,000 websites/blogs that provide contents by the quantity and still find that you are only making at most ten dollars a day, risking the fact that you might violate adsense terms and conditions. The fact is that you can’t create an empire by increasing the quantity of websites/blogs or your contents, but by increasing quality of your contents. When you provide your readers something they know will benefit their website/blog, and have 1,000 website that’s able to replicate the same results, you will have then created an empire that will continuously generate high revenue for you.

3. Apply for more advertisement and affiliate programs – Google’s adsense is a great way to start out for all bloggers, but it isn’t the only way to generate revenue on your blog. With today’s technology advancement, many other ad/affiliate programs are trying to compete with one another, including Google’s adsense. You’ll find other programs that are willing to pay you more for clicks and imps than Google’s, but always watch for bogus programs. Here are some of today’s most popular advertising and affiliate programs.

Google’s Adsense

Adbrite

WidgetBucks

Linkshare

Commision Junction

These programs have been tested and proven to generate revenue, however, some may require approval before you actually start working with them.

4. Connect with other bloggers – Connect and network with other bloggers, better yet, start working with some of them. It’s a great way to make a name for yourself on the web and drive more traffic to your website/blog. By helping other bloggers, you are, in turn helping yourself to create a network and even friends. Ideas can be combined and recombined to create a unique product or service that the whole world might just find interesting, even rendering some blogs that provide the same product or service obsolete.

Five ways to increase visitors and traffic

1. Keep track of your web-site statistics – keeping track of your website’s stats can definitely give you the right information for minor and major changes necessary for your page. Web hosting usually provides this information for your domain/hosting purchase, but if you’re not registered with any services, Google Analytics is a free of charge service that gives critical insight and information for you to see where your visitors are coming from. Having the right information can allow you to make the changes that are needed and save you the hassle of experimenting.

2. Put SEO to your advantage – optimizing search engines for your blog can greatly drive traffic towards your page. In fact, SEO increased searches for this blog by a whopping 110%, according to Google Analytics. If you’re a beginner, modifying your title is the first step towards SEO. Go ahead and give it a try and you’ll be surprised at the traffic search engines can offer you.

3. Provide quality and useful content – your visitors and readers are like you when you are in need of content that will be beneficial to you. Providing them with poor quality content will only drive them away, providing them with content that has no use or cannot be used to their advantage, and you might really start losing some visitors. Give your visitors content that you yourself find useful and beneficial, don’t give them no crap!

4. Interact and respond to your visitors – your visitors are important. Just like good customer service, your visitors should be your number one priority. If you take care of them good, they’ll be back, just as customers in retails and other industries that require good customer service. You should treat your blog as if it was your business, if you wish to push demand of your service or product.

5. Update – updating your blog is crucial. Your regular readers will learn your time span between updates. They’ll be back, sometimes, just for the update. This pushes us back to the fourth reason, interacting and responding to visitors. Once you have clearly developed an updating time span, stick with it. Either update ahead of time or on your default time, but never later.