How to create multi-page menu

Website Tips

Some websites call it Dynamically Updating Pages. You develop one menu and then use it in all pages wherever you want it.

Method 1 - BlueVoda Tips, Tricks and Shortcuts - How to create and use a single Menu and use it in all your pages, WITHOUT using Iframes. The description is excellent. You should have no difficulty following it. I implemented it. It worked fine. Then one day I started testing my website. Everything else checked out fine, but this implementation created, in my case, two pairs of <html> and </html> tags. The automated test software gave me error and the message was that this kind of thing is search engine Unfriendly. Maybe you could make it to work for your website.

Method 2 - Menu with JavaScript - When I encountered problems with Method 1, I began to search for another method and I found out that I could develop menu using Javascript and would include it in all the files wherever I wanted it. I encountered problems with method 2 as well. I read somewhere that search engines do not expand on JavaScripts. That means the search engines spybots do not see it...

Method 3 - The final menu implementation, so far - This method is the one I use now. The menus are expanded by the server. Here, it is a tedious job. Again, I had to make changes in more than 250 pages to implement it.

This method is called Server Side Includes (SSI). I was told that SSI is expanded on the server side. That means, hopefully, it is search engine friendly.

Like the previous two methods, there are two parts to it. An include file and the content file with the statement include in it. It works only when the content file extension is shtml and the include file where the menu resides must have extension in html. It is very easy to convert the file extension from php or html to shtml. You can do it in one stroke of the keyboard, explained below.

Step 1 - For your menu file. You can implement the file as an ads file, or the header.

Create a file in MS Notepad something like below. Make all the necessary changes to your taste.

<div style="position:absolute;left:810px;top:121px;width:161px;background-color:#ffffff;" align="left">
<font style="font-size:13px" color="#a00000" face="Verdana">

<br /><a href="http://www.yourdomainname.com/yourfilename.shtml" title="">menu item 1</a>

Now this is your own created dot shtml file.

<br /><a href="http://www.externaldomainname.com/" title="">menu item 2</a>

This is of course pointing to external website page.
And you keep adding in a similar fashion.
</font>
</div>

When you are done with the whole file, save it as, let's say, menu.html, upload it to
public_html using your FTP.

I have three html include files. 1) the header including the horizontal menu 2) left side vertical menu and 3) the right side ads file.

Obviously, you have to bypass the preview because this is generated in Notepad.

Step 2 - Include you menu.html file in your content file (dot shtml)
Now right click on your mouse at a blank spot outside your content text box. Click on Page HTML...
Look for End of Body and enter the below include statement. For me, the End of Body works, because in my opinion and a whole lot of others, the content file takes precedence. It must load first and then anything else.



Repeat the above include step for all your content files.

Step 3 - How to change a PHP extension to SHTML extension
Using your FTP, create a temp directory. I call it php. In page properties, I have all my content files published as php. When I publish, in the window, I have changed the Folder to public_html/php.
All my pages go to the temp php directory.

Connect to your server using your FTP. You would see your temp directory as php. Click on it and see that all your files are with the extension php.

Create a temp directory on your computer. I call it SHTML. I copy all my php files from the temp directory on the server to the shtml directory on my local disk.

I rename them as follows. It takes only a stroke or two on your keyboard.

If you have lots of files that have php or html extensions and you want to convert them to dot shtml, then in Windows, Click Start - All Programs - Accessories - Command Prompt. Here you are at MS-DOS level. Use CD command to go to the directory where you have all the php or html files. Then do this:

ren *.php *.shtml or
ren *.html *.shtml (ren here is rename)

After you are done, type Exit to go back to windows or better yet leave the Command Prompt open.

If you are using UNIX or Linux, then you know what you are doing.

After I rename them to shtml, I select all and copy them over to their proper destination. I assume you already have grouped the files in sub-directories. Make sure that the shtml files are copied over to the proper sub-directory.

As you can see, I have multiple menus. To make it simpler and easily managed, I have three include files. The first one loads the header and horizontal menu, the second one the left menus and the third one downloads any ads that I may have.

Step 4 - Important for me
I delete all files from the temp php directory on the server and from shtml directory on my local disk. So the next time I start with the clean slate to avoid any confusion.