ToolmakerSteve.com

Add Sub Links - Dividing Web Site into Sections

For all but the simplest web sites, there will be too many pages to fit into a single link bar on your home page. Therefore, you will organize your web site by grouping related pages into a section. The main link bar on your home page will allow the visitor to reach one page of each section. Within each section, the link bar will have a way to return to Home Page, plus links to the other pages of that section.

I will use my own web site, ToolmakerSteve.com, as the example. Initially I may not have decided all the details of my site structure, but I know I will have information on the TMS-SiteNav product, plus some Expression Web samples. In EW, I create the main page for each of those sections. I decide to create a folder for each, with an "index.htm" page in each folder. However, TMS-SiteNav does not require such a structure -- these main pages could have any name, and could be anywhere within my web site.

So far in the tutorial, in Adding Pages, we added those "index.htm" pages to the group of links for the Home page:

Home header with links "TMS-SiteNav", "EW-Samples", and "Support".

Now I want to add some user guide pages that I have already created using Expression Web (EW). However, I want these user guide pages to be inside a section of my website devoted to TMS-SiteNav. Let me stress again that the structure which the visitor sees -- which is the "Site Structure" you are describing using TMS-SiteNav -- does not have to be the same as the physical organization of the files on your web server's hard drive.

So far, the Site Structure shows that we have a single group of pages (or links). This is the blue box, with "Home" as its "header", and the three captions "TMS-SiteNav", "EW-Samples", and "Support". As we saw briefly in Adding Pages, the result is a link bar with four buttons for these four pages. If you were to Insert this link bar onto each of these four pages, you would have a simple four-page web site. But I want a website with a whole section for this User Guide.

I need to create another "group of links". I do this by selecting (clicking on) the "TMS-SiteNav" caption. Then clicking the "Add Sub Links" button.

Link "TMS-SiteNav" is hightlighted + Button with text "Add Sub Links" is emphasized; also see another button "Unlink" ==> To the right of the home group is now an empty group with header "TMS-SiteNav"

The "TMS-SiteNav" group is automatically selected; web pages will be added here.

Now, I can go to the left-hand tree of Web Pages, and click on each page in the order I want it to appear:

Web Pages list, showing files within sitenav folder ==> UGuide pages with long titles

Now there are two columns describing the site structure. The added pages have titles much too long for use in a link bar, so edit each one to an appropriate caption. Note that the section heading, "TMS-SiteNav", appears in two places. It is in the left column, as a child of Home. It also appears in the right column (in a small blue font bracketed by "--  --"), as a section heading followed by its children.

UGuide pages, short captions

To give a sense of what a more full-fledged site structure looks like, here is ToolmakerSteve.com's site structure, after more pages and sections have been added:

ToolmakerSteve.com's site structure with more pages added

Tutorial Note: At this point, you might want to skip ahead to "Inserting a Link Bar", to see how the site structure is used within your web pages, to create navigation link bars. Then continue on with "Site Structure - Rearranging Pages".