How to Make The Navigation Menu Bar (Links) on Blogspot (I)

Not like WordPress which provides navigation facilities in the header of the blog, Blogspot does not have it.
So if we want to have Navigation (Links) Page on the header Blogger/Blogspot then we must first create our own. This article will explain "How to Make The Navigation Bar (Links) Menu on Blogspot".

Navigation Bar is a link to the address we are going to (in the same pages, other pages within a site, or even in the pages of other sites). We provide this facility to our site / blog to accelerate or to shorten access to the link address (spesific phrase, articles, menu or anything that we think is important or interesting for our guests).

Because it is "a link", then we can create a simple Navigation Page with HTML. Script for links in HTML is:

<a href="Location_of_Document">Name of The Link</a>

The following are some example for it :

<a href="doit2us.blogspot.com">Home</a> | <a href="http://www.blogger.com/profile/07471629071890951823">About Me</a> | <a href="mailto:mc4tur@gmail.com">Contact</a>

and the result will look as follows:

Home | About Me | Contact

The Next step is put these link into the header bloger, or right under the header bloger.

1. Log in to Blogger .
2. On your Dashboard, select the Layout menu, and click the Page Element.
3. Click (one of) "Add a Gadget".

Note :If you want to add facilities "Ad a Gadget" on the Header and Blog Posts ... Please read How to Add The "Add a Gadget" on Header and Blog Posts of Blogger Page Elements
4. From the "Add a Gadget window pop up", choose/click the HTML/JavaScript.

5. On the page "Configure HTML / JavaScript", enter The Links in HTML Script, such as the example below.

Then click Save, "Configure HTML/JavaScript" page will disappear and you will be brought back to the "Page Elements" page, with The "New" HTML/JavaScript Widget

Note : The position of the HTML / JavaScript widget can vary depending on the "Add a Gadget" that you choose. In the example above I use a "Header Add a Gadget".

6. The next step is to set the laying of the Page Navigation (Links).
If you want to put it in the header, then arrange for the following position.

The result will look like the following.

If you want to put the Navigation Page (Links) Right below the header then set as the following position.

And the result will look like this

Thats for "How to Make The Navigation Bar Menu (Links) on Blogspot", in the next post we'll try to make the link look more attractive...

15 comments:

Coach Purses, February 28, 2010 at 11:06 PM: Your article is very technical content, well written, for many people have helped
Firdaus Bin Abd Rahman, March 17, 2010 at 7:00 PM: thanks sharing this to me. after download and use 3rd party templet, i bit blur to change html navigation script.
Thnaks again.

FIRDAUS ABD RAHMAN
Kota Kinabalu, Sabah
çizgi film izle, May 17, 2010 at 10:51 AM: I keep listening to the news speak about getting free online grant applications so I have been looking around for the best site to get one.
Rackmount Monitor, May 24, 2011 at 12:21 AM: I went through your blog and honestly am impressed with the way you write, along with the expertise you have about the Navigation menu bar on blogspot. I would want to see more updates on your blogs.
audio service milano, June 9, 2011 at 12:22 AM: Great Blog with very good posts. I so impress after saw this post so much. Can you please tell me that how much time you take to create this wonderful blog, although I am new on internet but your work is very good and I appreciate your work? Thanks for sharing this post so much.
how to name a company, July 7, 2011 at 11:32 PM: This idea can make as many navigation bar you want, you just need to modify and add attribution to the java script.
smj, July 10, 2011 at 10:38 AM: thanks, for information
ipad 2 keyboard case, September 16, 2011 at 8:16 AM: Would this also be applicable for PBB forums?
Cursos de ingles en el extranjero, September 30, 2011 at 8:11 AM: Thanks for your marvelous posting! I certainly enjoyed reading it, you could be a great author.I will ensure that I bookmark your blog and will come back in the future. I want to encourage you to definitely continue your great work, have a nice day.
Seo Melbourne, October 7, 2011 at 5:27 AM: Took me time to read everything, but I really enjoyed it. It proved to be Very helpful to me and I am sure to all the other visitors here!
get website traffic, October 7, 2011 at 11:07 PM: Thanks for sharing this. I find around your blog and found your blog is superb. There is a lot of info for me to study, Thanks for your great share.
Internet Marketing, November 5, 2011 at 2:26 AM: Thanks for sharing this great idea and this informative information. This is very useful information for all blogger.
Rackmount LCD, April 27, 2012 at 4:30 AM: It is good for us. I like your idea. I think some helpful and impressive tips really work for getting good. It has been really very nice to know about this.
desain kemasan, May 12, 2012 at 1:37 AM: realy easy to understand and fit to my blogger template. thanks.
eatmywords.com/about, November 6, 2016 at 1:41 AM: This idea can also be learn f you want to have your business in web marketing,just like owning a website.