Changing Your Website Layout

The layout of your site can consist of the following elements:

• Header. This is the topmost area where a banner image and a company logo are usually placed. You can do the following to the header:
  • Move the banner image and logo from the header area to any place on the page.
  • Reduce the header height to 25 pixels by removing all elements from it.
  • Change the header width from the default size to 100 percent, so that it is expanded to fit the page width.
• Content area. This is the main part of a webpage where most of the content is placed. You can do the following to the content area:
  • Adjust the height of the content area.
  • Divide the content area into several columns. You can do this by dragging new modules to the left or right edge of the content area and inserting them.
  • Change location of the columns in the content area by moving the content to the left or to the right.
• Sidebars. These are vertical columns that can be used for placing all kinds of modules, site-wide and page-specific. You can do the following to sidebars:
  • Add one sidebar and place it to the left or to the right of the content area.
  • Add two sidebars. They will be placed to the left and to the right of the content area.
  • Adjust the height and width of the sidebars.
  • Move the sidebars to the top of the page and place them to the left or to the right of the header area.
  • Switch places of the sidebars.
• Footer. This is the lowest area where the company name, contact information, or a copyright notice are usually placed. You can do the following to the footer:
  • Reduce the footer height to 25 pixels by removing all elements from it.
  • Change the footer width from the default size to 100 percent, so that it is expanded to fit the page width.
• Advertisement block below the footer. Depending on your hosting plan, an additional text block containing some advertisement from your hosting provider might appear below the website footer. If that advertisement block appears on your site, you might want to upgrade to another hosting plan to remove it.

To change the layout of your site:

1. Go to the Design tab > Layout tab.

2. Select the number of sidebars: Under Sidebars, select No, One, or Two.

3. Select the locations of sidebars:

   • To move a sidebar to another side of your website, or to switch places of sidebars (if you have two sidebars on your site), click Switch sidebars.
   • To move the sidebars to the top of the page, click them in the layout model.

4. Set the size of page elements:

   • To set the total width of the website pages, under Website width, select either of the following:

     • Fixed layout: your website will be of a specific size regardless of the size of the browser window viewing the page. In this case, specify your website width in pixels.
     • Liquid layout: based on percentages of the current browser window’s size. In this case, specify your website width as a percentage of the browser window’s size.

   • To change the width of the header, footer, and the main content area to fit the page width, click the corresponding elements in the layout model.

   • Under Minimal column height in pixels, specify the height of the main content area and each sidebar, if you have chosen to use them.

     This value shows the height of your website elements without content. When you add content to the main content area and to the sidebars, they will stretch in height to fit the content.

   • To ensure that the sidebars and the content area are vertically aligned, select the checkbox Stretch the sidebars and the content area down to the footer.

   • If you use one or two sidebars, under Sidebar width in pixels, specify the width of each sidebar. The size of the main content area will be determined automatically.

   • Under Margin sizes in pixels, specify the size of vertical and horizontal margins. A margin is the space between the edges of neighboring elements.

5. Click OK to save changes.