How to add a Menu Navigation Bar with hyper links at the top in a blogger blog with new XML template?

A blog does have a blogger navigation bar at the top but lacks a MENU BAR with links to your own blog or any other link with your own choice links, as we see in many websites.  http://codezila.blogspot.com/

This helps in easy navigation across your blog/site. The reader will have a wide variety of choice and will stay on your site or blog for a longer time. This also helps in categorizing your blog posts according to their category or genre. http://codezila.blogspot.com/

Follow the following steps and its all done... very easy indeed.
 http://codezila.blogspot.com/

1. Login to your blogger account and go to LAYOUT & then  PAGE ELEMENTS (default) 
2. Now click on EDIT HTML  and  check " Expand Widget Templates" 
3. Use Browser Text Search Feature using shortcut "Ctrl+F" and type in "Inner layout" to find "/* Inner layout */" inside ""
4. Paste the following code after "/* Inner layout */" :

/****** Top Navigation ******/
#topnav {width: 100%; 
   height: 20px;
   text-align: right;
   font-size: 0.7em;
   color: #999999;
   float: right; }
   
#topnav img {
   border: none; 
   padding: 5px; }


/****** Navigation ******/
#navigation {
   width: 100%;
   background: 
url(http://1.bp.blogspot.com/_3SdVQe5mP8U/Sssg9YVGb_I/AAAAAAAALfE/7QSG50RJYnM/s320/menu_button.JPG) repeat-x;
   height: 35px;
/*   border-top: ##58b2eb solid 1px; */
   margin-bottom: 2px;}
#navbar_link {
   height: 34px;
   float: left; }
#navigation #navbar_link ul {
   float: left;
   height:34px;
   width: 100%;
   list-style-type: none; }
#navigation #navbar_link ul li {
   display: inline; }
#navigation #navbar_link ul li a {
   padding: 0px 15px;
   color: #ffffff;
   text-decoration: none;
   line-height: 1.7em;
   float: left;
   border-right: 2px solid #0c5684;
   text-decoration: none;
   font-size: 1em;
   font-weight: bold;
  }

#navigation #navbar_link a:hover { 
   text-decoration: none; 
   border-right: 1px solid #0c5684;
   color: #FFFFFF;
background: #ddd 
url(http://2.bp.blogspot.com/_3SdVQe5mP8U/Sssf0YtHOyI/AAAAAAAALe8/H9Gh5b9Dn90/s320/menu_button.JPG) repeat-x;
}
   
.1ST a {
background:  url(http://2.bp.blogspot.com/_3SdVQe5mP8U/Sssel0xFZRI/AAAAAAAALe0/Mm9U_ETVHeQ/s320/menu_button.JPG) repeat-x; 
}

5. Now Uncheck " Expand Widget Templates" at the top right.
6. Use Browser Text Search Feature using shortcut "Ctrl+F" and type in "header-wrapper" to find
   div id="header-wrapper"
7. Now before this header div ends , paste the following code after /b:section
   
   
   
   
   
   

   <!--navigation links-->
   <div id='navigation'>
         <div id='navbar_link'>
           <ul>
              <li class='1ST'><a expr:href='data:blog.homepageUrl'>Home</a></li>
              <li><a href='url1'>Link Title</a></li>
              <li><a href='url2'>Link title2</a></li>
              <li><a href='url3'>link title 3</a></li>
   
   <!-- add as many links as you want -->
   
           </ul>
         </div><!-- end of navbar_link -->
         </div><!-- end of navbar -->
   

   
   
   
   
   
8. Replace the url1/url2/... with your own links and Link Title1/2/3.... with your link title.
9. Save the Template. Its All Done. You can see the green navigation bar as shown above.
10. Having problem with the code? feel free to ask through below comment area.
11. enjoy a new look to your blog or site.

Follow I Love India on Facebook:

Like this Post??? Share it:

How to add adsense ads just after the post title and after Post Ends in blogs.

It is always beneficial to show the ads just after the post title before the real content starts. But by default the ads are shown either in the sidebar or after the comment link at the bottom of the post. So many a time your visitors did not even give a look to the ads which is not desirable.

So what to do to make the adsense ads come just after the post Title and at the post bottom before the Comments or reaction buttons or anything else.

Follow the following steps and its all done... very easy indeed.

1. Login to your blogger account and go to LAYOUT >> PAGE ELEMENTS (default) 
2. Click on EDIT in BLOG POSTS (a pop-up window "configure blog posts" will open)
3. Check the radio button  "SHOW ADS BETWEEN POSTS" at the last of "Post Page Option" in the pop-up.
4. Scroll down and click on Ok (you can edit the colour of the ad displayed, its better to match the ad colour to your blog colour especially ad background and border must be same as blog background colour)
5. Save the template by clicking on the BLUE button at the top right.
6. Now click on EDIT HTML >> check " Expand Widget Templates" 
7. Use Browser Text Search Feature using shortcut "Ctrl+F" and type in "adcode" to find <adcode> just after the comment section.
8. Then add "!" before adcode like <!--adcode--> (this makes the defalut adcode as a comment for the browser and it will ignore it while interpreting the codes)
9. Then Find  "<data:post.body/>" using "Ctrl+F".
10. After and Before "<data:post.body/>" paste this code:
<b:if cond='data:post.includeAd'> <data:adEnd/> <data:adCode/> <data:adStart/> </b:if>
11. Save the Template. Its All Done. Now after every each post title your ad will be shown and at the bottom also. To edit the type of ad size and colour see point 4. But its better to use a square size ad format.
12. Best of Luck. Happy earning.

NOTE: Always Save your template before editing your HTML codes.

Follow I Love India on Facebook:

Like this Post??? Share it:

Karan Johar is now a blogger!!!

Like his colleagues Amtiabh Bachchan [Blog]and Aamir Khan[blog], ace filmmaker Karan Johar has also started blogging, but says he is doing it to put his thoughts into writing rather than vocalising them all the time.

'I've always been a closet writer. I've been offered newspaper columns that I almost did, but never got down to.'

'I feel a blog would be a good way to express my thoughts on cinema. Things that don't routinely get space in the traditional media outlets these days,' added the director who is all set to direct his next 'My Name is Khan' with Shah Rukh Khan.

Karan promises to be regular.

'But not compulsive. I don't see myself blogging from my sets when I start shooting 'Khan...' or when I'm abroad for my various events.'

Once a week on the blog is all you'll get of Karan.

'I've a staff to take care of the blog. And I certainly won't be peering anxiously into it every day. And the blog isn't to discuss my daily routine or my sexuality, although both may crop up when the need arises. But I'm not turning blogger to blabber about my life. God knows, I do enough of that on a daily basis.'

So is it lucrative?

'You mean am I getting paid to write the blog? Who's going to pay me to hear me talk on the net when there's so much of the Karan Johar wisdom being spewed in every possible place? No, I'm doing the blog for free.'

Karan Johar is now a blogger!!!

Follow I Love India on Facebook:

Like this Post??? Share it: