You are here: netFORUM Pro Modules > Web Site > Web Site Wizard > My Web Site - Selecting the Web Site Layout

Selecting the Layout: Header, Footer, and Navigation Bar

Tip: Only entities that do not have an eWeb site created will be able to access the Web Site Wizard. Once you have an eWeb site created, you will only have access to the Web Site Editor. The Web Site Editor gives you the ability to manage every aspect of your eWeb site.

The first step of the Web Site Wizard, you will set the Site Layout and Site Theme for your eWeb site. The Site Layout includes setting the header, footer, navigation bar, and whether your site will be DIV or TABLE-based.

Setting the Site Header

The Web Site Header will display on every page of your Web site. You can use the header to display your company logo or other information (that can be repeated on every page).

To add a Web Site Header:

  1. Click the  Site Header check box located in the Site Layout section of the Select Site Layout & Site Theme page.
    After you click the Site Header check box, the Layout Preview section will update to show a mock-up of your web page with the header in place.

Setting the Site Footer

The Web Site Footer will appear on the bottom of every page of your Web site.

To add a Web Site Footer:

  1. Click the Site Footer checkbox located in the Site Layout section of the Select Site Layout & Site Theme page.
    After you click the Site Footer check box, the Layout Preview section will update to show a mock-up of your web page with the footer in place.

Setting the Navigation Bar

The Web Site Navigation Bar contains the links to your Web pages, including your Online Store, Upcoming Events, Login page, and more.

To set the navigation bar and its position on the Web site page:

  1. Click the Site Navigation Bar check box located in the Site Layout section of the Select Site Layout & Site Theme page.
  2. Expand the Site Navigation Bar - Default Position drop-down menu and select the Default Position for the navigation bar (Left or Top.)
  3. To position the navigation bar on the left side of the Web page, select Left from the Site Navigation Bar - Default Position drop-down list.

  • To position the navigation bar on the top of the Web page, select Top from the Site Navigation Bar - Default Position drop-down list.

Tip: You can choose to have some of the navigation links on the top and some of the links on the left during third step of the wizard, however this will overwrite the navigation position selected above. In addition, selecting custom positions for site links using the Web Site Editor (after your site is created) will also overwrite the layout selected in this step.

Setting DIV or TABLE-Based Formatting

You may choose to use DIV-based formatting or table-based formatting for your Web site.

Each type of formatting has its own advantages and disadvantages and supporting themes that will be selected in the next section of the Web Site Wizard. Some Web Site designers prefer DIV Tag formatting for the ease of placing components inside blocks that are then controlled through style sheets without the need to modify the actual HTML whereas sites with many Lists may prefer table formatting instead where content is very fixed.

The themes that are supported by each format type are not compatible with each other. When a format type is selected, only those themes available for that type of layout will be available in the pre-defined visual themes drop-down.

Note that the DIV-based layouts also take advantage of the newest standards in Web development; HTML 5 and CSS 3. However, this also means that they are also only compatible with the newest Web browsers with regard to some functionality such as rounded corners and drop corners as a result. The older browsers should render your Site on the whole just fine however.

To select DIV or TABLE-based layout for your site:

  1. Click the radio button for the option you prefer for your site.

    • Selecting the Use Table-based Layout (instead of Div-based) will build your site using tables. The Theme Preview section (located in the Site Theme section of the Select Site Layout & Site Theme page) will update to show a preview of a page using a Table-based layout.

  • Selecting the Use DIV-based Layout (instead of Table-based) will build your site using DIV tags. The Theme Preview section (located in the Site Theme section of the Select Site Layout & Site Theme page) will update to show a preview of a page using a DIV-based layout.

After completing the settings for your header, footer, navigation bar, and site layout style you must specify what theme will be used on your site. This is done in the Site Theme section of the Select Site Layout & Site Theme page.