*open the button for the menu in adobe photoshop
*If u dont have button u can download it from the internet, if further not then read the next post oin which i teach how to make buttons for the website
*after opening the button ur visualisation is look like as shown in fig 211
*Go to file
*click file<<new
*A window is open as shown in fig 212
*choose custom
*Set the height and width of the menu bar
*set the background colour as well
*A new window is open as shown in fig 213 pointed by arrow
*this is the size of ur menu bar
*select the button with the help of magnetic lasso tool as pointed by arrow
*Press ctrl and drag drop the button on the menu by by pressing the left click of ur mouse
*As u see the size of the button is large on the menu bar
*Press ctrl+t then ur button is selected as pointed in arrow in fig 214
*Adjust the button in menu bar by dragging the rectangle with the help of mouse
*Now ur button is fit on the menu bar as shown in fig 215
*Adjust the lenth of the button according to how many buttons u want to place in ur menu bar
*As i adjusted the length of the button so that 5 buttons can fit on my menu bar
*Press ctrl+alt and drag the button on the menu
*By doing this a duplicate button is made after that button
*Repeat this process to obtain 5 buttons on the menu bar as shown in fig 216
*write the text on the buttons according to ur need as shown in fig 217
*select the slice tool as pointed in fig 218
*Divide menu into five slices as shown in fig
*These slices are actually used to create links such that when u press these buttons different pages are open
*After using slices tool ur menu bar is look like as shown in fig 219
*Select the home button slice with the help of slice selector tool
*U can find this tool by clicking the small trianle in the bottom of slice tool
*After selecting home slice click the slice options as shown on the top of the menu of adobe photoshop
*Type the full url of the page which u want to open by clicking this button
*Type a text messege(optional) which ur browser dispaly when u place mouse button on the menu bar
*press ok
*Now select page1 slice with the help of slice selector tool
*Type url of that page which u want to open by clicking that button
*repeat these steps in all the five buttons
*Go to file
*click save for web
*Now a window is open as shown in fig 222
*U can take a preview of ur menu bar with the help of previes option on the bottom
*Now press save
*Select the path to save it
*As i save in destop
*After saving u will c that an new folder of images is made on ur destop
*Now open ur web page on the destop and it will look like in fig 224
*Now the important thing is note here that this web page is only made to open from ur computer. If u want to fed this menu into ut website or ur blog then u have to take some changes in the html code of this web page
*now in this web page
*click view
*click source code
*A source code window will open as shown in fig 225
*Copy this source code in some notepad file
*Now open ur image folder, u will see that thier are five images shown here, these are those images which u select with the help of slice tool. Names of these images are also shown in source code along with extension like .jpg,.gif according to image
*Now u have to publish these images on the web server
*If u are using blog from blogspot.com then go to picasaweb viewer and upload ur photos there. Now u have to save the web address of each photo.
*now open that notepad file where u save the code
*look at the lines pointed in fig 227
*these are the address of the images in ur computer
*delete these code which are between double braces and place the address of that image on it
*repeat this step bec u have 5 web address of the five photos and u have to replace it with the appropiate image code
*now if u want to put this menu in blloger template
then select the code from <table> to </table> as shown in fig 228
*go to costomize ur template
*go to layout
*go edit HTML
*paste this code after the line <body>
*save it and enjoy ur own menu just as i made my own menu as shown in fig 229