Please help me create a new graphical navigation bar.

I just took over the website pictured below and one of my first tasks is to expand the navigation bar. Well I a going for a bit more professional look so I am going to use pictures instead of text. I know this can be done in Photoshop but I am having trouble figureing out how to do it (I never use Photoshop). Could anyone give me some suggestions as how to do this in Photoshop?

From what I can see the navigation buttons are already graphics. They are not text links. All you would have to do is create the images files that you want to replace the old ones with and then substitute them in the html file.

the navigation buttons are already image and you need to make it text just delete the image and type your text and give a back ground color and you done .
if want to change this image with another just make your new button on photoshop and replace them with the one in the design .........that's all

1.fill the background image with black
2.create text layer and input text
3.change the text to whatever style you want (in the same way you would do on microsoft word)
4.save for web and devices, you can choose whatever format you want i would use png
5.in your html file include: <img src="path to your file" class="whatever" />
6.in your css create a new class called "whatever" and apply some style to it.