HorizonWeb Online Support

        How can I create my own Layout?

Horizon Web allows you to select one of several pre-defined layouts or gives you the flexability to create your own from scratch. This has recently been made even better with the introduction of the 'CSS Friendly' layouts which allow you not only to move the objects around on the page but completley restyle them, giving your website its own unique look and feel unlike anyone elses!

To create a custom layout, login to your website as the administrator and click on the 'Admin' link at the bottom of the page.

This will open the admin page, note this will look slightly different depending upon the version of HorizonWeb you are using but the settings themselves remain the same for this process.

Click the 'Customisation' Link to take you to a page where the following options are available,

Site Layout (1)
Select the layout you wish to use from this list, 0,1,2 and User Defined are the standard layouts that use images for the tabs and buttons. For these if you want to change the look past just positioning you will need to create new images and upload them to the webbox. The remaining two layouts, CSS Friendly and CSS Friendly User Defined all use CSS classes to style to page and as such are much more flexible when it comes to completley chaning the look of your site.
CSS Friendly Colours (2)
This option only effects the CSS layouts, if you have picked either of these then select either a preset template from this list or 'User Defined' which allows you to select your own colours for the website.
CSS Friendly User Defined Colours (3)
These three options are used to change the main colours of the website, if you have 'User Defined' set for option (2) simply use the lists to select your colours. Primary is the colour used most on the site - the default header colour, background colour to tabs and the hover over colour of buttons as well as various headers throughout the site. Secondary is the colour used as the default background of the buttons or to indicate which tab is currently active. Button Text is the colour of the font used on the buttons.

If you have selected the 'CSS Friendly User Defined' Layout in option (1) above then you will need to use the boxes in section (4) to position the controls you wish to use on your website.

The controls available to you are: (see screenshot for examples)

  1. LoginBox -
    Control that allows users to login, has links to email password or change password and also displayed Loyalty Points.
  2. Sector Browse -
    Gives quick access to the product sectors.
  3. Product Search -
    Allows searching via code and text, also allows searching within single sectors.
  4. Order Traching -
    Allows customers to seach for outstanding orders.
  5. SubTotal Cart -
    Provides a summary of the current cart, only displays item count and total value.
  6. Consumables Link -
    Gives access to the consumables finder.
  7. Authorise Orders -
    This shows a list of orders a customer has placed that are awaiting authorisation from their authoriser.
  8. Saved Orders -
    Displays orders that have been saved by the logged in user.
  9. Mini Cart -
    Displays the contents of the cart.
  10. Login Link -
    A Login Bar for use in the Header or Footer to allow users to login without needing the full box
  11. Menu -
    Displays the default menu, Home, Browse, Offers etc. For use in the Header or Footer but can be used elsewhere with some styling.


In addition to the above there is also a 'Featured Offer' control that can be added to the page,

        Back To HorizonWeb Designer Options