How to Create a Navigation Bar.

Hello everyone! I hope you are all doing fantastic today. Thank you Mal for letting me post on your cute blog. I wish her safe travels on her way home!!
My name is Justine. Mal was one of my first blog friends! I love talking to her and reading her blog.

my little slice of the blog world is over here.

OK, I wanted to get a little technical this morning, and teach everyone how to make their own navigation bar for his or her blog. One to fit under your header or on your side bar. 

First step, you need to make a list of what links you want! For example, I have About me, Goodreads, Twitter, Flickr and Tumblr. 

Now head to your posting page in your dashboard. You will then see a link that says EDIT PAGES. Click this.

That will bring you to a page that says add new page, DO SO.

Now, this page can be anything you please, your subject line will be at the end of your URL though, so if its your about me page, make the subject say ABOUT or ABOUT ME. Then add whatever you please in the body.

CLICK BELOW IF YOU WANT TO READ MORE

When you hit publish you will be brought up to this page:

CLICK NO GADGET.

Click SAVE

Then click VIEW PAGE.

When you are viewing your page, please copy the URL into a document or sticky note for later!

Now, create as many pages as you please!!

When you are done, make sure you have all the URLS saved so its easier later. 

Now, open up photo shop or paint or any other image creator software you might have.

I will use paint for this tutorial since almost everyone has it, I usually use photoshop though.

I made my document 120x49, just drag your corners and you will see the size moving on the bottom, (if you are on photo shop when you create a new document you can add the size right in)

You can add your text right onto this document

Now, save this image as a PNG

Then you will need to upload it to an image hosting site, like photobucket.

NOW REPEAT with however many tabs you are going to have!! 

Then come back here and keep reading.

Ok, all done?

Now, lets get really technical.

Go to your dashboardàdesigns-àpage elements

ADD A GADGET underneath your header or on your side bar (wherever you want this placed)

Click HTML/Javascript

Now tab over to your photobucket, click what your first tab is going to be, mine is my ABOUT page. Copy its HTML code.

Add this into your gadget. NOW YOU WILL SEE THIS:

<a href="http://s14.photobucket.com/albums/a302/Justine19/?action=view&amp;current=about-14.png" target="_blank"><img src="http://i14.photobucket.com/albums/a302/Justine19/about-14.png" border="0" alt="Photobucket"></a>

WHERE IT IS RED REPLACE WITH THE URL FROM YOUR PAGE THAT YOU CREATED.

Like this:

<a href="http://missjustinelynn.blogspot.com/p/about-me.html" target="_blank"><img src="http://i14.photobucket.com/albums/a302/Justine19/about-14.png" border="0" alt="Photobucket"></a>

BINGO!

If you have made it this far you are almost done!!

Now, repeat, all steps until your gadget looks like this:

Then click save and view!!

You can drag this box around, so if you decide to place it under your header or on the side after, don’t worry, you can!

I change mine up often:

Now, for some of you this might be easy and for some you might be really lost. If you have any questions, feel free to email me at justinelynn08@gmail.com so I can help you individually!

You can also visit my blog here! 

Thanks guys!! <3


Justine, you're a champ.  Thank you so much for doing this guest post for me!  Justine if full of helpful hints about all facets of life (seriously!) so you should definitely check out her blog :). I'm on a plane right now headed towards home so send me some happy thoughts and I'll see you tomorrow!

xo Mal