How to Enable or Remove the Blogger Navbar Using 2 Methods

Want to learn how to get rid of or delete the Blogger Navbar? The Blogger Navbar is the navigation bar menu at the top of a Blogger blog above the header that appears on older Blogger themes. It is easy to get rid of the Blogger Navbar and in today's Blogger Tutorial I am going to show you two different methods to disable, hide or delete it or to reinstate it if that is your goal. You would use the second method only if for some reason you cannot enable the Blogger Navbar by the easy method which is by turning it on and off in the Navbar gadget in Layout Designer. (Updated April 2022)

Advantages vs Disadvantages of the Blogger Navbar

Most people dislike the Blogger Navbar and want to delete it because it looks unprofessional and in the past it encouraged readers to leave a blog by clicking on the Next Blog link. If you are using a custom template the Blogger Navbar is likely to already be hidden but if you are using one of the older default Blogger templates eg Simple, there will be times when you will need to remove it manually to stop it showing up.

Before you get rid of the Blogger Navbar completely though remember that it has some pretty useful features such as:

• Follow Me link to encourage your readers to follow you (Blogger has removed this unfortunately)
  
• Share via email, Facebook, Twitter
  
• Blog search
  
• Quick links to Blogger New Post, Design and Blogger Dashboard
  

I would suggest that if you do decide to hide or delete the Blogger Navbar that you add the custom search box gadget and some social sharing icons to your blog to partially compensate for the features you will be losing.




If you simply want to change the color of the Blogger Navbar please refer to my Blogger tutorial How to Change the Color of the Blogger Navbar.

2 Ways to Disable the Blogger Navbar - Navigation Search Bar

There are two methods to disable the Blogger Navbar: Method 1 involves turning it off in the Navbar Gadget while Method 2 is mostly geared at bloggers who are using an older Blogger theme and need to hide the Navbar by adding HTML code to the template itself.

Method 1: Steps to Remove or Hide the Blogger Navbar

The following method is a step-by-step guide to turn off or disable the Blogger Navbar using the Navbar Gadget.

1. Sign in to Blogger
2. From the Blogger Dashboard go to Layout
3. Find the Navbar Section which should be the first Gadget at the top of your blog in layout
4. Click the edit link or pencil icon to edit the Navbar Gadget
5. In the Configure Navbar window that opens up scroll down to the bottom





6. Click the on radio button to turn the Navbar Gadget off. Green light for off and clear for on. (If you are trying to reinstate the Navbar make sure the radio button on the Navbar Gadget is clear.)
7. Click Save
8. Click Preview (eye icon at the bottom right-hand corner) to Preview your blog without the Navbar displaying above the header
9. Click the Save icon (located next to the Preview icon)

Method 2: Steps to Remove or Hide the Blogger Navbar

This second method of deleting or removing the Blogger Navbar is done through a change to the Blogger template. Essentially it hides the Navbar with code but does not actually delete the code.

1. Sign in to Blogger and select the blog you wish to change
2. From the Blogger Dashboard go to Theme
3. Click the orange down arrow next to the Customize button
4. Click Backup to back up your blog before proceeding
5. Once backed up click on Edit HTML from the drop down menu by clicking on the down arrow once again
6. Click anywhere inside the template and then search the following code using CTRL + F (PC) or CMD + F (Mac) to bring up the search box: ]]></b:skin>
7. Insert the code below just before the ]]></b:skin> tag
   
   
   #navbar-iframe {
   height: 0px;
   visibility: hidden;
   display: none;
   }


8. When you are satisfied click on the Save button to save your changes
9. Click on View Blog to admire your Blogger blog with the Navbar removed

Blogger Tip:
If you decide that you want to reinstate the Blogger Navbar you can do one of two things:

1. Simply remove the code you inserted:
   
   #navbar-iframe {
   height: 0px;
   visibility: hidden;
   display: none;
   }


2. Or comment out the code like this
   
   /*
   #navbar-iframe {
   height: 0px;
   visibility: hidden;
   display: none;
   }*/

Summary

Today I have explained how to turn the Blogger Navbar off and on in the Navbar Gadget. I have also shown you an easy trick to remove or alternatively hide the Blogger Navbar using the hardcode method. By adding a short piece of code to your Blogger template the Blogger Navbar can be hidden from view. I have also shown you what to do if you need to reinstate a missing Blogger Navbar.

Related Links

How to Change the Color of the Blogger Navbar
How to Add a Copyright Notice to a Blogger Blog
How to Add a Print Friendly Button to Blogger
How to Backdate Blogger Posts to Publish Articles on a Retrospective Date
How to Remove Blogger Labels Counter
Add a Follow Me Twitter Icon Button to Blogger
Make Money From Affiliate Banners with Blogger
How to Get More Adsense Clicks with Blogger
Easy Ways to Put Banners on Blogger

How to Remove the Date Header From Blogger Posts in Blogspot

How to remove or delete the date header from Blogger posts in Blogspot is a question that comes up frequently especially for beginner bloggers. If you want to stop the date header from showing then there is a simple tweak in Blogger to hide the date. Read on as I show you how to switch off the date header at the top of posts via the Blog Posts gadget.

Why Remove or Hide the Blogger Post Date Header

When you first create a blog, Blogger displays a date header at the top of Blogger Posts by default. Depending on the settings of your blog and the template you are using, Blogger displays the day, month and year of all your Blogspot blog posts so that your readers can know when the article was posted. In some cases the date header provides useful information but in many cases it can be a deterrent especially if some of your content was published a number of years ago.

Another reason that you may choose to turn off the date header is because you have crafted your posts for longevity and they are what is typically called evergreen. In this case it is immaterial when the post was first published and therefore dating it is unnecessary. Keep in mind though that even if you do turn off the date header your readers will still be able to tell the date a particular post was published by referring to the URL.

Toggling the date header on and off is one of many Blogger settings that can be configured according to a blogger's own preferences. To switch off the date header or turn it back on again is an easy fix that only takes a couple of minutes to perform. Please note that all past and any future blog posts will have the date removed.

Steps to Remove or Hide the Date Header from Blogger Posts

1. Log in to Blogger


2. At the dashboard choose Layout from the menu at the left


3. Find the Blog Posts Widget under the Main Section in the Blog Layout


4. Click on the Edit link or pencil to bring up the Configure Blog Posts pop up window





5. Under the option to Show Date Header move the slider to the off position to remove the date header. The switch will turn clear. The toggle switch is blue-green when on and clear when off.


6. Click on Save to commit your changes. The Save Button is positioned at the bottom right of the pop-up window.


7. Now click on the View blog link in the side menu and you will see that the date header has been removed from your blog posts.

#bloggertutorials #blogspottutorials #bloggertips

Summary

In this Blogspot tutorial you have learned how to turn off or hide the date header from posts in your Blogger blog by configuring your preferences in the Blog Posts gadget. The Show Date Header option is activated or deactivated by sliding the toggle switch. The main advantages of deleting or removing the date header is for blogs with evergreen content or blogs with older content.

Related Articles

How to Add a Welcome Message to a Blogger Homepage
How to Change the Color of the Blogger Nav Bar
Why Blogger is a Better Blogging Platform than Wordpress
How to Choose a Great Topic for a Blogger Blog Tips
How to Add a Copyright Notice to a Blogger Blog
How to Remove or Turn Off the Labels Counter in a Blogger Blog

How to Add a Sticky Welcome Message Post to Blogger Blog

How to add a sticky welcome message post to the Blogger homepage is a question that is often asked by beginner bloggers keen to make their blog more welcoming and attractive to visitors. By adding a welcome message above your blog posts readers landing on your blog will immediately be greeted by the welcome message. Adding a sticky welcome message is a simple addition to Blogger and it only takes a few minutes to create a nice friendly welcome message that sends clear welcome wishes to your blog visitors.

In this Blogger tutorial you will learn how to add a sticky welcome message to the main section in Blogger above the blog posts as seen in the image below. We have chosen to put the message above the post area because it is a placement that is very central for your readers to see your greeting when they land on your homepage. If you are interested in other placements like the sidebar or below the header then check out my detailed instructions on the other placement options for welcome messages on your Blogger blog in my companion article how to add a welcome message to a Blogger homepage.

Why Add a Sticky Welcome Message to Blogger

A sticky welcome message placed above your posts on the Blogger homepage will immediately grab your readers attention. You will engage your readers and if it hits the right note can promote trustworthiness in your blog and your content.

Blogger makes it easy to insert a text box above the posts and customize it to the look and color scheme of your blog using the Rich Text Editor. You can even add further advanced styling to your sticky welcome message using HTML code.  If you want to add third party scripts or videos just swap the text gadget for a HTML/Javascript gadget.

You can choose to place your welcome message only on the homepage or have your message display on every blog page. I have included instructions on how to show the welcome message on the homepage only.

Craft a Good Sticky Welcome Message Post to a Blogger Blog
to Engage the Visitor

Points to Consider When Adding a Sticky Welcome Message to Blogger 

Before you go ahead and create your sticky welcome message think about what you are going to say to attract a readership.  What value will your blog provide to a potential follower?  Are you informing or entertaining your readership?  Remember you are more likely to impress a visitor if they can easily identify how you can help them and what value to their lives your blog is going to provide them with.

It may be tempting to add your welcome message in the header instead of a blog description but I would advise against this. The blog description has an SEO benefit and needs to contain at least one of your keywords. It is far better to create that personal touch by generating your blog's welcome message using a Blogger text gadget and leave the blog description as a tagline that describes the purpose of your blog. For more on how to add a blog description to Blogger and why it is important to do so please visit my companion post.

Steps to Add a Sticky Welcome Message Above the Posts in a Blogger Blog

The following steps will help you put a sticky welcome message above the posts on all pages of your blog. If you only want it to appear on the homepage and not every post page then see below for instructions on how to display the message only on the homepage.

1. Login to your Blogger account at Blogger.com
   


2. From the Blogger Dashboard click on Layout from the menu on the left-hand side
   


3. Click on the Add a Gadget link in the Main Posts section or Post Body section (called different names depending on what theme you are using)
   
   Note if there is no Add a Gadget link in the Main Posts section you may need to open up the section depending on your Blogger theme. I suggest you try adding the gadget to the sidebar first and then dragging it into the Main Posts area afterwards. If this doesn't work then please refer to my detailed step-by-step guide to Adding a Widget or Gadget Above a Blog Post in Blogger in which I show you how to open main section to add more gadgets.
   


4. Select the Text gadget from the pop-up menu. You could also choose to use a html/javascript widget instead if you want to add third party scripts to your message.
   
   





Use the Text Gadget to Add a Welcome Message Sticky to the Top
of the Main Post Section on the Blogger Homepage





5. Click on the plus+ icon at the right of the Text gadget to create your sticky welcome message.
   
   
6. Give the gadget a name like welcome message to make it easy to identify later.
   


7. Use the Rich Text Editor icons to add some simple styling to your sticky welcome message. Use Edit HTML if you need to add advanced styling. Check out my other posts for more on how to add advanced styling to Blogger.
   





Use the Text Box Gadget to Craft Your
Sticky Welcome Post Message in Blogger




8. Click Save to save your welcome message gadget.
   


9. Click on Preview icon at the bottom right-hand corner to view your sticky welcome message.
   


10. Once you are satisfied with your sticky welcome message drag it above the blog posts if it is not already there. Or if you created it first in the sidebar then drag the gadget over to the main section and position it above the blog posts gadget.
    





Drag and Drop the Text Widget into the
Main Section Above Blog Posts in Blogger Layout




11. Click Save Arrangement once you are satisfied with the positioning of your Blogger welcome message by clickingon the save icon in the bottom right-hand corner.
    
    


12. Click View Blog in the Dashboard and admire your new welcome message that is greeting your blog visitors.
    

How to Display a Welcome Message Only on the Homepage of Blogger

If you like the idea of a welcome message but would prefer to have it show only on the homepage rather than all pages it will require a manual edit of your Blogger template. Follow these steps to set the text gadget to only show up on the main page:

1. Login to your Blogger if not already logged in
   


2. Check the name of the welcome message gadget
   


3. Return to the Dashboard and Choose Theme
   


4. Click the down arrow denoted by the triangle next to the orange Customize button
   


5. Choose Back up your theme to download your template in case
   


6. Choose Edit HTML
   


7. Click on the Jump to Widget icon in the top left corner of the editor
   


8. From the drop down menu of widgets click on the gadget you created for your welcome message eg Text1
   


9. The code that you jump to will look similar to this:
   
   
   
   <b:section class='main' id='main' name='Main' showaddelement='yes'>
<b:widget id='Text1' locked='false' title='' type='Text' version='1'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<p style="background: #ffffff; border: double;">Welcome! At <span style="font-weight: bold;">Blogspot Blogger Guide</span> we show you the easy way.</p>]]></b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<!-- 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>

   
   


10. Add the following line of code immediately after <b:includable id='main'> which adds an if statement saying homepage only:
    
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    
    


11. Add the following line of code immediately before </b:includable>
    to close the if statement
    
    </b:if>
    
    


12. The following shows the code with the if statement added and is highlighted in blue:
    
    <b:section class='main' id='main' name='Main' showaddelement='yes'>
<b:widget id='Text1' locked='false' title='' type='Text' version='1'>
<b:widget-settings>
<b:widget-setting name='content'><![CDATA[<p style="background: #ffffff; border: double;">Welcome! At <span style="font-weight: bold;">Blogspot Blogger Guide</span> we show you the easy way.</p>]]></b:widget-setting>
</b:widget-settings>
<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>



13. Click the Save icon from the row of buttons in the top right-hand corner
    


14. You will be returned to the Dashboard. Click View Blog from the menu and navigate to several post pages to check that your welcome message is now only showing on the homepage rather than every page.
    

In today's Blogger tutorial I have shown you how to put a welcome message on your Blogger blog that extends welcome wishes to your blog visitors. The welcome message acts in the same way as a sticky note and always appears above your blog posts in the main section of your blog. A welcome message similar to the example can be added with a text gadget and can be customized and styled to suit any Blogger blog.

Related Articles

Basic Blogger Tutorials to Customize a Blogger Blog
Advanced Blogger Tutorials to Customize a Blogger Blog
How to Add a Welcome Message to a Blogger  Homepage
How to Change the Color of the Blogger Nav Bar
How to Put a Twitter Follow Icon on Blogger Next to Post Title
How to Add a Blog Description to the Blogger Page Header

Remove Blogger Labels Counter or Turn On Counter in a Blogspot Blog

Until recently the only way to turn off, disable or remove the counter of the labels widget in Blogger was to use a Blogger hack. Luckily Blogger has now added a new feature so that Blogspot bloggers have a choice about whether to show or not show a post count next to the corresponding tag when using the Blogger labels widget. (Updated as at 18 February 2022)

How to Turn Off  / Remove / Delete the Blogger Labels Counter?

If you already have a Blogger labels widget installed and you are using an older template then Blogger shows a count of the number of posts with that label or tag next to each label by default. If you want to turn off the label counter you will need to disable it.

Removing the Blogger labels counter is easy and only takes a minute. Switching off the labels counter can be useful sometimes for instance when establishing a new blog where a limited number of posts may deter visitors. Fortunately Blogger has listened to users and now installs a new blog with the Labels Counter turned off.

Conversely you may find that your Blogger label counter has been disabled and you want to reinstate it. In this case you would navigate to Blogger and follow these steps except that you would reverse Step 4.

1. Log in to Blogger
2. At the Dashboard go to Layout Menu
3. In the Blogger sidebar click on the pencil or click the edit link to edit your Labels Gadget
4. Use the toggle button to switch between on (blue-green) and off positions (white) in the Show Number of Posts Per Label heading.
5. Click on Save
6. View your Blogger blog without the number of posts shown next to the labels tag

#bloggertutorials #blogspot #bloggergadgets

Summary
Today you have learned how to turn off the Blogger labels counter so that no count of the number of posts is shown next to the label in a Blogspot blog. Disabling this feature only takes a minute and can be a useful feature for new blogs with few posts. If you are new to Blogger and blogging you can learn more useful tricks and tips for customizing your blog at Blogspot Blogger Guide. Watch out for more Blogger tutorials in this series of Blogspot Tutorials for Beginners.



Related Links
How to Put a Copyright Notice on a Blogger Blog
How to Add a Print Friendly Button to Blogger
How to Change the Date of Blog Posts in Blogger
Add a Follow Me Twitter Icon Button to Blogger
Easy Ways to Put Banners on Blogger
How to Add a Welcome Message to Blogger Homepage
How to Unlock or Delete Locked Widgets in Blogger
Making Money From Affiliate Banners and Links with Blogger
How to Get More Adsense Clicks with Blogger
Easy Ways to Put Affiliate Ad Banners on Blogger