Website Builder Help
Select Design Select Design Video Help guide for Select Design
This area allows you to select the base site design that you would like to use for your website. You can select a site design by clicking on any of the designs arrayed on the right-hand side of the screen, and your selected site design will appear on the left-hand side of the page. You can change your choice of design at any time by coming back to this page and clicking on any of the available designs. You are also able to fully customize your design by going through the other tabs in the web-builder, and making your adjustments in each of them accordingly.
 
Available Color Theme
This allows you to change the color palette of the headers and areas of content in your website. By clicking on one of the color choices provided will provide you with the overall color combination for your site to match your branding.
 
Selected Body Scheme
This allows you to apply a background layer to your site which will be visible behind the various areas of content on each page. You can choose the background body color scheme for your website, by clicking on any of the choices we have provided. These range from solid colors to gradients to patterned backgrounds.
Back to Top
Change Menu Change Menu Video Help guide for Change Menu
Please Select the Menu Layout
This is where you create the menu bar for your website, which will contain the various links that users will click on in order to get to the areas of your site that you will have on offer (i.e. primary page links). Keep in mind that each primary page link can have sub-pages under it.
 
There are two types of menus that you can select and use for your website.
 
1. The first is a ‘Horizontal Menu’ which may sit above your site banner (i.e. at the top of your website) or below your site banner (i.e. close to the midpoint of your website). Refer to the images provided on the page. Note: A ‘Horizontal Menu’ is limited to having 6 primary page links in it (with the ability to add a number of sub-links under each primary page). If you want more than 6 primary links on your navigation menu, you need to select a ‘Vertical Menu’. However, you can select to have Category and Sub-Category links in a separate ‘Vertical Menu’ area, if you have an Ecommerce website package. (see Category/Sub-Category Vertical Menu Add-on).
 
2. The second is a ‘Vertical Menu’ which can either sit inside your site banner area or below the banner. If you require more than 6 primary page links for your navigation menu, the ‘Vertical Menu’ below the banner is the best option to select. This allows you to add an infinite number of primary page links (limited to the number of pages in your site package).
 
Customize Your Menu
This tool allows you to manage the actual links that will appear in your navigation menu.
How To Create a Main Navigation Menu
1. Click on the icon that has the ‘+’ sign (underneath the ‘Main Menu’ box).
2. Add in the name of the page link you would like in the ‘Menu Name’ text box
3. Determine where the page link will open up i.e:
  • a. will it open as a new page
  • b. will it link to an existing page (for this, you will be required to select the existing page from the dropdown menu, that you would like the page link to open up.

  • c. will it link to a different website (for this, you will be required to add in the website address that you would like the menu to open up).
4. You can also determine whether the link should open in a new browser window or if it should open up the link in the current browser window when the page refreshes.
5. Click on the ‘Add’ button underneath the ‘Add Main Menu Item’ box in order to add the link.
How To Create a Sub Navigation Menu
1. Select the Primary Link that you would like the Sub-Link to open under.
2. Click on the icon that has the ‘+’ sign (underneath the ‘Sub Menu’ box).
3. Add in the name of the page link you would like in the ‘Menu Name’ text box
4. Determine where the page link will open up i.e:
  • a. will it open as a new page
  • b. will it link to an existing page (for this, you will be required to select the existing page from the dropdown menu, that you would like the page link to open up.

  • c. will it link to a different website (for this, you will be required to add in the website address that you would like the menu to open up).
5. You can also determine whether the link should open in a new browser window or if it should open up the link in the current browser window when the page refreshes.
6. Click on the ‘Add’ button underneath the ‘Add Sub Menu Item’ box in order to add the link.
 
Select Your Menu Theme
This allows you to choose either static (HTML-based) menus for your website or animated (Flash-based) menus for your website.
 
Definition: A static menu (HTML-based) is a menu that shows the link name in the color and form of the site design that is selected, but does not change when a user ‘mouses over’ the menu and it does not automatically show the sub-menu items below on ‘mouse over’. You also cannot customize the look of a static menu.
 
Definition: An animated menu (Flash-based) is a menu that dynamically shows the link name in the site design that is selected, but may be completely customized in terms of color, style and form when a user ‘mouses over’ the menu. It also automatically shows the sub-menu items below on ‘mouse over’, which can also be customized in terms of the way that this sub-menu appears (known as the ‘effect’).
 
This creates a sense of movement and ‘animation’ to your navigation which creates a great interest and appeal for your site visitors. These Flash-based animated menus can be fully customized by you as the site owner.
 
NOTE:
  • If you would like to use the static (HTML-based) menus for your website, all of the settings have been automatically pre-applied in the ‘Customize Your Menu’ section above. You cannot adjust these, other than the link names and pages in your site. If you would like to use the animated menu (Flash-based) for your website, you will need to click on the ‘Create/Edit Your Flash Menu’ button.
  • Once you have clicked on the ‘Create/Edit Your Flash Menu’ button , the step-by-step process to create your Flash menu is as follows:
PLEASE NOTE:
- As you make the various selections in all of these steps below, you are able to see these selections in the ‘Preview Zone’ for your animated Flash menu below the various ‘Settings’ components.
- If you make adjustments that you do not like, you can always go back to the original settings by clicking on the ‘Restore Default Settings’ button.
 
1. Select Your ‘Skin Settings’ – This allows you to choose the style in which you want your menu to appear. This includes the look of your menu, which you can change by selecting one of the various styles of skin for your menu from the drop down provided next to ‘Skin’. This also allows you to select the ‘animation effect’ that you would like to apply to your menu on ‘mouse over’. You can also select this from the drop down provided next to ‘Effects’.
 
2. Select Your ‘Font Settings’ – This allows you to choose the font style, color, size and formatting that you would like the links to appear on your menu. This includes the fonts for your Primary Menu and Sub Menu items. To select the color of the fonts, simply click on the color box which will bring up a range of colors that you can choose from. Click on the color you want and that color will appear in the box as the color you have selected for that font.
 
3. Select Your ‘Color Settings’ – This allows you to choose the colors in which your want your Primary Menu and Sub Menus will appear. To select the color of the menus, simply click on the color box which will bring up a range of colors that you can choose from. Click on the color you want and that color will appear in the box as the color you have selected for that menu. You can also select different colors for the menus when they are in their initial position and when they have been clicked on and/or on ‘mouse over’ (known as ‘Highlight Color’).
 
Once you have completed this process, you will then click on the ‘Save’ button in order to save and commit your changes.
Back to Top
Edit Pages Edit Pages Video Help guide for Edit Pages
This area allows you to manage (i.e. add/edit/delete) all of the pages of your website as well as all of the content that is to go onto each page of your website.
 
You can add content onto each page of your website in discrete ‘blocks’, each of which would have different content in them. E.g. one block may contain written content, one block may contain imagery, one block may contain some pre-built functionality that we offer on the system.
 
Once you add a ‘block’ of content on the site (whatever that content may be add), you can then ‘drag it’ around the page (by clicking your mouse button and holding it down while you move your mouse over the page) and ‘drop’ it where you would like that ‘block’ to sit on the page (by releasing your mouse button).
 
You manage your site content through the following areas:
 
Page Settings
In this area, you can add and/or modify the various pages of your site by using the following tools:
 
Add New Page Name – This is a ‘quick link’ to allow you to add in a new page to your Primary Menu (to add in a Sub-Menu, you would need to go to the ‘Change Menu’ tab at the top of the screen).. You would add in the page name and then click on the icon just to the right of it, which would add the page in your Primary Menu.
 
Select Page – This allows you to select the page of your site that you want to edit in this area. By clicking on this icon, you would get a drop down menu with all of your site pages listed on it. You would then go down the list to the page you wanted to select and click on that page with your mouse. This would then bring that page up as the page that you are going to be able to edit.
 
Page Layout – This icon allows you to choose the different configurations of columns that you can have for each page. (e.g. single column, 2 columns,. 3 columns, vertical columns, horizontal columns, etc). The purpose for selecting different page configurations is to allow you to drag ‘blocks’ of content into the different areas of the page so that they can be positioned as you would like them and in the size that you would like them to appear. E.g. On a page with a 3 column configuration, you can have 3 separate ‘blocks’ of content side-by-side, and all of the same width. This gives the page content a very balanced and well presented look.
 
Properties –
 
Delete – This allows you to delete the page that you are working on / editing. Note that by clicking on this page will delete the page in its entirety i.e. this will remove all page content and will delete the page from the website menu.
 
Add-On Gallery
This area allows you to add pre-built ‘blocks’ of content into your page. Each of these pre-built ‘blocks’ of content will provide your users with useful and functional tools and services in your website.
 
You are welcome to use all of the ‘add-ons’ that we have on offer that fit within your membership package. If there are ‘add-ons’ that you would like to use but are not available to you, simply click on them and the system will direct you to the membership area, where you can upgrade your membership and get to use them in your website.
 
Below is a description of each type of the ‘add-ons’ that you can apply to the pages of your website:
 
Web Page Components – These are the components that we automatically provide for each site design, which you can add into your site page as you are creating it. These components have been specifically built and laid out in a manner that works best with the design you have selected. You should always refer back to the default example we have provided in the ‘Select Template area for how these components look best on your homepage.
 
Web Page Add-ons – These are additional functional pieces of content that may be added to your site pages to give your site a great sense of value and depth for your users and customers. These add-ons include content ‘blocks’ that contain surveys, event calendars, forums, blogs, photo galleries, contact forms, etc.You can create your page to have as many of these as you would like but we recommend that you select the add-ons that are in line with your business and that will add value to your site visitors, without making your site page too cluttered and disorganized.
 
Ecommerce Add-Ons – These are content ‘blocks’ that are specifically built for Ecommerce members. These members are able to add in specific functional Ecommerce add-ons that stimulate sales and drive users to their products in their Online Catalog. These include add-ons such as: Featured Products, Categories, Best Selling Products, Cross-Promotional Offers, etc.
 
Internet Widgets – These are content ‘blocks’ that are available to members that come from other sources on the internet. This allows you to, for example, include YouTube videos on your site page, or drop in Google Gadgets, or RSS Feeds, or widgets from Widget Box. These ‘widgets’ will work seamlessly within your site page, in the position that you have designated for that content ‘block’ to appear.
 
There are also some other tools in this area that allow you to add additional content ‘blocks’ (with functionality) onto your site page. These are located just to the right of the above drop down menus of ‘add-ons’ available to you. These are outlined as follows:
 
Extranet – An extranet is a private network that uses the Internet to securely share part of a business's information or operations with suppliers, vendors, partners, customers, or other businesses. This allows members to securely share documents, images and other files in this private area on the members’ website. provides members with a number of extranet accounts, dependant on the Membership Package they have taken – Silver and Gold members can create unlimited numbers of extranet accounts, up to the total file size of the membership package that they have chosen
 
The member will have the following functions as part of the Extranet tool:
 
  1. Admin can create username/passwords for end-users. Each end-user account will also store their designated email address.
  2. Admin can determine which end-users can upload/download documents or which end-users just download.
  3. Admin can create folders and sub-folders in each end-users extranet account for documents.
  4. Admin can add/delete files in each end-users extranet account.
  5. Admin can add any type of file in each customers extranet account (e.g. PDF, word, xls, jpg, PSD, PPT, video files – all files under 3mb).
  6. Admin can select if end-users are to receive an email notification when a new file is uploaded in their extranet account.
  7. Admin can activate/deactivate/delete end-users accounts.
 
Add Custom ‘Add-On’ – This allows you to create a custom content ‘block’ that you can add whatever content you want. When you add a custom content ‘block’, it starts as a blank content box with a set of tools at the top of the box that allow you to write and format content into the ‘block’. This is known as a WYSIWYG editor (What You See Is What You Get) which allows you to write in content and create hyperlinks to other websites or pages within your own site. You can also add images, Flash files, movies, PDF documents and/or other aspects. For more advanced users, there is a button that allows them to switch to ‘Advanced Mode’ where they can then add in nested tables, web buttons, checkboxes and a whole range of additional features and functions at their disposal. Advanced users can also make their edits in HTML code by clicking on the HTML.
 
Image Gallery – This button allows you to add photographic images to your image gallery and then utilize these images on your site pages. In this gallery, you can manage your images, place borders around them, position them, resize them, etc.
 
Flash Gallery – This button allows you to add any Flash files that you own to your Flash gallery and then utilize these Flash applications on your site pages. In this gallery, you can manage your Flash applications.
 
Create/Edit Banner – This button will take you to the Flash Banner section, where you can create a range of Flash marketing banners that you can add into your Flash Gallery. From here, you can then select any of these marketing banners which you can then drop into any of your site pages as required.
 
You are Editing:
Underneath the control panels, this indicates the page that you are currently editing. This changes when you click on the ‘Go To Page’ icon in the control panel above and select a different page.
 
Editing Content Blocks
Clicking on the ‘Edit’ button on each content ‘block’ will allow you to edit the contents of that particular ‘block’. This includes allowing you to change the name/title of the content ‘block’, the actual contents of the ‘block’ (e.g. you can format any written content through a WYSIWYG editor) or will allow you adjust the presented components in that block (e.g. adjust the dates of the Events Calendar that are presented within that ‘block’). As each content ‘block’ is somewhat different, the different editing capabilities that you have on each ‘block’ will differ somewhat.
Back to Top
Change Logo Change Logo Video Help guide for Change Logo
This area allows you to add/change your logo that will appear on your website header (i.e. in the top logo area of your site)
 
If you would like to add or change your logo, you simply need to go through the following steps:
  • If you would like to add or change your logo, you simply need to go through the following steps:
  • Click the “Browse Button” to search your computer for a .GIF / .JPEG / .PNG version of your logo (no other file type is accepted).
  • A directory box will pop up, allowing you to find the appropriate file on your computer.
  • Once you select the file with your mouse, this file will automatically be uploaded onto your account.
  • If you want to remove the logo you have uploaded, click on the “Restore Default” button which will remove your uploaded logo.
  • If you do not have a logo, you can click through to one of our partners, ‘Logoworks’, the industry’s leading logo design company, where you can get your logo professionally designed.
Back to Top
Header & Footer Header & Footer Video Help guide for Header & Footer
This area allows you to adjust your website header (i.e. the top area of your site where you typically place your logo and your company tagline) and your website footer (i.e. the bottom area of your site where you typically place text links for your, copyright information and partner logos).
 
Header
  • Your header is divided into 4 quadrants: top left; bottom left; top right, bottom right. You can add your logo and tagline each into any one of these quadrants.
  • You can then click on any of the items (logo or tagline) and hold down your button as you ‘drag’ the item into any of the 4 quadrants.
  • You will need to drag the item to the extreme outer corner of that quadrant and you will see it move into the desired quadrant when you see that it has an intermittent rectangular box around it.
  • You then let go of your mouse button to ‘drop’ it into position.
 
If You Do Not Have A Logo
  • If you do not have a logo, simply click on the ‘Business Name’ radio button under the ‘Select Your Logo or Business Name‘ header.
  • You can then type in your business name and format the characters as required (e.g. font size, style, format, color, etc).
 
Footer
  • Your footer is divided into 2 quadrants: ‘top and ‘bottom’.
  • You can add text and images into the top quadrant.
  • You can add your ‘Copyright’ information into the bottom quadrant.
  • To add text and images into the top quadrant, follow these steps:
    • Click on the ‘edit’ button in the top quadrant.
    • This brings up an ‘editor’ box where you can add imagery and or text and position them as required. It is recommended to keep the footer reasonably small, with relevant information only.
    • Click ‘save’ once you have completed your edits.
  • To add ‘Copyright’ text into the bottom quadrant, follow these steps:
    • Click on the ‘edit’ button in the bottom quadrant.
    • This brings up an ‘editor’ box where you can add your copyright text as required. It is recommended to keep the footer reasonably small, with relevant copyright information only.
    • Click ‘save’ once you have completed your edits.
Back to Top
Change Banner Change Banner
This area allows you to create/change the main banner image that appears on your homepage.
 
You can also create/change other marketing banners of different sizes that you wish to use on various pages throughout your website.
 
As part of this process you can also add powerful marketing messages that appear on each of the images in your animated banner.
 
As this is a major visual component of your site, we have provided you with a specialized ‘Banner Control Panel’, which is explained as the last item below.
 
The process for creating banners is outlined below:
 
Homepage Banner
You can select to have this animated Flash banner image appear just on your home page (which is the default setting) or you can choose to have it appear on all of your site pages by clicking on the ‘Click here to use this Banner in all the Pages.’ link. Please note, however, that this is not standard web practice.
 
There are a few different options available in order to help you create your Homepage banner:
A. You can create an animated ‘Flash’ banner through the banner creation system. Flash banners can rotate between different images in a sequence (with different effects and speeds, etc). You can add text and weblinks to any of the banners.
B. You can create a static HTML banner through the banner creation system. HTML banners will be one consistent banner that will not rotate or move. You can add text and weblinks to any of the banners.
C. You can upload your own banner image or Flash application and use it as your Homepage banner for your website.
D. You can create a ‘Banner Collage’, where you can have a number of different animated Flash and/or static HTML banners layered on top of each other, in order to create a ‘collage effect’ for your homepage banner.
 
A. Animated Flash Banner
To create an animated ‘Flash’ banner through the banner creation system, simply go through the following steps:
 
  1. Click on the ‘Create Your Own Banner’ button.
  2. Under the ‘Create Banner’ header, add in the name that you would like to identify the banner (this is for your reference only) and select ‘flash’ as the ‘Banner Type’. Then click on the ‘create’ button.
  3. Click on the ‘Add New Image’ button and then, through the popup window that appears, select the image from your computer that you would like to have in your animated banner.
  4. Go through this process in order to add as many images as you would like into your animated banner. NOTE: It is recommended that you do not include more than 3-5 images in your animation, as each image adds memory size to your homepage which means that your site visitors will have to wait while your banner loads, if there are too many images on it.
  5. You can select a background color for your banner by clicking on the ‘color block’ next to ‘Background Color’ title and selecting the color from the color choices provided.
  6. By checking or unchecking the box next to the ‘Loop Slideshow’ title, you can also choose to have your animated banner loop continuously (set as default) or you can choose to have it play once and then stop on the last image.
  7. You can adjust the transition effects for each image (i.e. the way in which images transition into and out of your animated banner) by using the transition controls on the page. Simply click on an image in your banner’s ‘Slide List’ to select it (indicated by a thick orange block around the image), and then choose from the different effects in the drop down menus.
    • ‘In Effect’ refers to the transition effect when an image first appears in the banner.
    • ‘Out Effect’ refers to the transition effect when an image disappears from the banner.
    • The timing for these effects is controlled by the ‘Duration’ boxes.
    • Other aspects of the banner animation that may be controlled here are the ability to disable either the ‘In’ or the ‘Out’ effect and the interval between each slide (referred to as the ‘Slide Interval’).
  8. You can also set each image to be ‘clickable’ by a user, which can link to a page in your website or to another website, if you choose. You simply need to add in the web address in the ‘Image Link’ text box and then select if the web page indicated should open in the same browser window or in a new browser window.
  9. You will always be able to preview your animated banner in the ‘Preview Zone’ at the top of the page. Just click on the ‘play’ icon in the centre of the screen to view your animated banner as it currently stands.
  10. Once you have completed these steps, you can either click on the ‘Save’ button and continue your edits, or you can click on the ‘Save and Return’ which will take you to the previous page, to go back to the main banner control panel.
Adding Text To Images on Flash Banner
You can add a number of lines of text to any of the images by going through the following steps:
 
  1. In the Flash banner edit page, simply click on an image in your banner’s ‘Slide List’ to select it (indicated by a thick orange block around the image) and then click on the ‘Edit Image’ button below. This will bring up an ‘Edit Page’ for that specific image.
  2. You can then write your text into the text box below the ‘Add Text’ header. When first adding the text, you can select your font style. However, your font will have all of the other default formatting applied to it, which can be viewed under the ‘Text Settings’ header (e.g. black color). You can change this once you have added your text.
  3. You then click the ‘Add New text’ button.
  4. This will add your new text in the top left hand corner of your image area (seen by a red ‘highlight block’), which you can ‘click-and-drag’ (with your mouse) to reposition it on the image.
  5. You can add additional lines of text by going through steps 1-3 above and place them wherever you want on the image.
  6. To change the formatting of any of your text, simply click on the line of text you wish to edit and you will see that it appears in the text block under the ‘Edit Text’ header.
  7. You can then adjust the formatting of this line of text by selecting the various choices that you would like under the ‘Text Settings’ header.
  8. You can also set each line of text to be ‘clickable’ by a user, which can link to a page in your website or to another website, if you choose. You simply need to add in the web address in the ‘URL’ text box under the ‘Edit Text’ header and then select if the web page indicated should open in the same browser window or in a new browser window.
    PLEASE NOTE: All text will initially be applied in black. It is highly advisable to move the newly added text away from the top left corner (and changing the font color, if you do not want black font) before adding additional text. This is to assist you in identifying where all of your text lines are.
  9. If required, you can also change your ‘Image Settings’ for the selected image by using the ‘Crop Image’ and the ‘Scale Image’ tools just under the image. These are for use if you uploaded image is a different size to your banner.
    • If the ‘Crop Image’ checkbox is selected, this will ‘crop’ the image that appears in your banner to the size of the viewable window that you can see on this page.
    • If the ‘Scale Image’ checkbox is selected, this will ‘scale’ (resize) the image that appears in your banner to the size of the viewable window that you can see on this page.
    • If your image cannot be adjusted according to the banner size (e.g. it is the same size as the banner), these tools will not be clickable.
  10. Once you have completed these steps, you can either click on the ‘Save’ button and continue your edits, or you can click on the ‘Save and Return’ which will take you to the previous page, to go back to the main banner control panel.
B. Static HTML Banner
To create a static banner HTML banner through the banner creation system, simply go through the following steps:
 
  1. Click on the ‘Create Your Own Banner’ button.
  2. Under the ‘Create Banner’ header, add in the name that you would like to identify the banner (this is for your reference only) and select ‘html’ as the ‘Banner Type’. Then click on the ‘create’ button.
  3. Click on the ‘Add New Image’ button and then, through the popup window that appears, select the image from your computer that you would like to have in your animated banner.
  4. You can also set each image to be ‘clickable’ by a user, which can link to a page in your website or to another website, if you choose. You simply need to add in the web address in the ‘Image Link’ text box and then select if the web page indicated should open in the same browser window or in a new browser window.
  5. Once you have completed these steps, you can either click on the ‘Save’ button and continue your edits, or you can click on the ‘Save and Return’ which will take you to the previous page, to go back to the main banner control panel.
Add Text To Image on Static HTML Banner
You can add a number of lines of text to any of the images by going through the following steps:
 
  1. In the static HTML banner edit page, simply click on the ‘Edit Image’ button below the image. This will bring up an ‘Edit Page’ for that image.
  2. You can then write your text into the text box below the ‘Add Text’ header. This text will have all of the default formatting applied to it, which can be viewed under the ‘Text Settings’ header. You then click the ‘Add New text’ button.
  3. This will add your new text in the top left hand corner of your image area, which you can ‘click-and-drag’ (with your mouse) to reposition it on the image.
  4. You can add additional lines of text by going through steps 1-3 above and place them wherever you want on the image.
  5. To change the formatting of any of your text, simply click on the line of text you wish to edit and you will see that it appears in the text block under the ‘Edit Text’ header.
  6. You can then adjust the formatting of this line of text by selecting the various choices that you would like under the ‘Text Settings’ header.
  7. Once you have completed these steps, you can either click on the ‘Save’ button and continue your edits, or you can click on the ‘Save and Return’ which will take you to the previous page, to go back to the main banner control panel.
C. Upload your own banner image or Flash application as your Homepage banner
If you already have an image or a Flash application that you would like to use as your homepage banner, you simply need to go through the following steps:
 
  1. On the right hand side of the ‘change menu’ link on the web builder, you can determine the location and type of banner you would like to use fro your site.
  2. Dependant on the type of banner that you already have, click on the relevant ‘Browse’ button and select the file from the designated location.
    • Uploading from your computer requires that you select a file stored on your own computers hard drive;
    • Uploading an image requires that you select a file that you have already uploaded to your Image Gallery on the system,
    • Uploading a Flash file also requires that you select a file that you have already uploaded to your Flash/Multimedia Gallery on the system.
  3. This file will then be used as your homepage banner.
D. Creating a ‘Banner Collage’
To create a ‘Banner Collage’ through the banner creation system, simply go through the following steps:
 
  1. Click on the ‘Create Your Own Banner’ button.
  2. Under the ‘Create Collage’ header, add in the name that you would like to identify the banner (this is for your reference only. Then click on the ‘Add’ button.
  3. Click on the ‘drop down menus next to ‘Flash Banners’ and Static Banners’ to use banners you have already created or, click on the ‘Create New’ button next to these as a shortcut to go to area where you will create these banners.
  4. Each time you want to add a banner to your collage, make sure that it is selected from the drop down menu and click on the ‘Add’ button.
  5. Go through this process in order to add as many banners as you would like into your ‘Banner Collage’. NOTE: Each banner adds memory size to your homepage. It is recommended that you do not have too many banners and banner that are too large in size, as this means that your site visitors will have to wait while your banner loads.
  6. When you add a new banner into your ‘collage’, it will appear in the top left-hand corner of the screen, which you can ‘click-and-drag’ (with your mouse) to reposition it on the page.
  7. You can adjust the ‘Depth Settings’ for each banner (i.e. the layer that each banner sits in on your ‘banner collage’) by using the ‘Depth Settings’ controls on the page. Simply click on an banner in your ‘collage’ to select it (indicated by a thick red block around the banner), and then choose if you want to bring that banner forward or send it backward, as well as bringing it to the front or sending it to the back.
  8. By clicking on any of the banners, you can see the coordinates of this banner in the collage area. This allows you to set the exact positions of the various banners on the collage and to line the banners up perfectly in relation to one another.
  9. You can also set the ‘Opacity’ (Transparency) for each banner so that, dependant on your ‘Opacity’ settings, the banner can either be transparent or not, with various degrees of transparency (or ‘see-through’). Simply click on a banner in your ‘collage’ to select it (indicated by a thick red block around the banner), and then type in the ‘Opacity percentage’ level for that banner and then click on the ‘Apply’ button.
  10. You also have the ability to select any of the banners on your collage and add in a ‘drop shadow’. This is located in the lower right corner of the page. You can determine the strength of the drop shadow, the angle at which the shadow will be positioned, the distance that the shadow will be cast, and the color of the shadow.
  11. Once you have completed these steps, you can either click on the ‘Save’ button and continue your edits, or you can click on the ‘Edit’ button as a shortcut to go to the ‘Edit’ section for that banner, or you can click on the ‘Delete’ button to delete the selected banner or you can click on the ‘Cancel’ button to go back to the main banner control panel without saving your changes.
Banner Control Panel
This ‘Banner Control Panel’ allows you to create the various banners types that you would like in your website as well as to edit and/or view the banners that you have already created.

In order to do this, click on the drop down menu of the banner type you have created, and select the banner you want to edit or view.

Then you simply click on the Edit’ or ‘View’ button which will take you to that function on the selected banner.
 
Most Frequently Used Web Banner Sizes
There are a number of standard marketing banner sizes that are commonly used on the web. Here are some examples of the different marketing banners that are most frequently used:
 
Most Frequently Used Web Banner Sizes
 
Create / Edit Collage
A Collage is a banner consisting of multiple images and/or Flash animations that work together to create your website design. You can order the various images/animations to have these items sit on different layers on your page (i.e. front layer, second layer and back layer) to create your collage.
 
To create a collage:
  1. First type the name of the collage into the text box under ‘Collage Name’ and click ‘Add’.
  2. This will take you to the ‘collage creation tool’, where you can create or add the various components that you would like to make up the collage.
 
Alternatively, if you have already created a collage and you would like to edit or adjust it, you can:
  1. Click on the dropdown menu under the ‘Edit Collage’ header and select one of the collages.
  2. Then click on the ‘Edit’ button and this will take you to the ‘collage creation tool’, where you can create, edit or add the various components that you would like to make up the collage.
 
Create / Edit Banner
A Banner is a single image which can be used in the design. It will automatically have the same dimensions of the site design you have selected as a default, but you can adjust these dimensions to create a custom banner that you would like to use.
Banners can either be animated banners (referred to as ‘Flash banners’) or they can be static banners (known as ‘HTML banners). Flash banners can rotate between different images in a sequence (with different effects and speeds, etc) and HTML banners will be one consistent banner that will not rotate or move. You can add text and weblinks to any of the banners.
To create a banner,
  1. First type the name of the collage into the text box under ‘Banner Name’.
  2. Then determine what kind of banner you would like to create by selecting either Flash or HTML from the dropdown menu next to ‘Banner type’
  3. Then click on the ‘Create’ button.
  4. This will take you to the ‘banner creation tool’, where you can create or add the various components that you would like to make up the banner.
 
Alternatively, if you have already created a banner and you would like to edit or adjust it, you can:
  1. Click on the dropdown menu under one of the banner types beneath the ‘Edit Banner’ header.
  2. Select the banner you would like to adjust.
  3. Then click on the ‘Edit’ button and this will take you to the ‘banner creation tool’, where you can edit or adjust the various components that you would like to make up the banner.
Back to Top
Select Design Upload Custom Design
 
This section of the Website Builder allows you to change CSS classes and images used in your website. Editing can be done online by selecting a desired CSS file, or you may download all resources (which includes the CSS files and images) on to your local computer and then edit it offline, using any custom software you use.
 
The process for using these tools are outlined below:
 
All the resource files are shown in a tree structure, in the left hand side of the screen, as per the below image.
 
 
Following are the details of all the files/folders displayed in the tree structure.
  • a. TestPage.html - This file is being provided to check which CSS Class is used in which area of the page. Please note that changing this file will not have any impact on your website.
  • b. CSS - This folder contains one CSS file, i.e. StyleSheet1 or StyleSheet2 or StyleSheet3, according to the color theme selected in the "Select Design" page. This file contains different classes for header, menu or footer area of your website.
  • c. Images - This folder contains different images used in your website, like buttons, background images etc.
  • d. WidgetCSS - This folder contains one CSS file, i.e. Selected template's Code plus WidgetCSS1 or WidgetCSS2 or WidgetCSS3, according to the color theme selected in "Select Design" page. This file contains different classes for different widgets and the body area of your website.
 
You can edit this CSS Classes using two different methods i.e. Online or Offline. Images can only be edited/replaced/added Offline.
 
- Editing Online – To Edit any CSS Class, click on the desired file from the tree structure in the left hand side navigation. It will open the file in a text area format on the right hand side. After this, you may add/edit any class/properties and click to save. Changes will have an impact on the Preview mode of your website. If you click on any image or TestPage.html it will open the file, but in read-only mode.
 
- Editing Offline - Editing Offline means downloading all of the resources, visible in a tree structure in your local computer. You can edit the files using any custom software.
To do this, Click on the "Download Resources" button in the top right corner of the screen. The system will prompt you to save a zip file to your local computer. After saving, unzip the file and start editing the image/css. To view the changes you may run the TestPage.html. Once you are done with the changes, Zip the resources folder, Select the zipped file using the "Browse" button and Click on "Upload Resources" button. It will upload and refresh the contents in a tree structure. You will then be able to check your website in "preview" mode to view the changes made.
Please note that you have to keep the file names the same in order to view the changes in "preview" mode.
Back to Top
Select Design Search Engines
 
This area of the site allows you to add ‘keywords’ and descriptions to your website to help with ‘Search Engine Optimization’ (SEO). SEO helps your website to be found by members and on the open Internet, through searches on Google, Yahoo, MSN, etc.
 
In order to achieve this you need to add in text into the text areas on the page
 
- Keywords – Here you are required to add the keywords and phrases that best describes your business and that your users will most often type into the search engines as their ‘search phrases’. Use (,) between keywords in order to provide multiple keywords for your site.
 
- Description - Add a description to your pages that best describes your business. This assists Search Engines to crawl and index your pages more efficiently, so that your website can be more easily found when a user is searching for your kind of company.
Back to Top
Control Panel Control Panel
 
This link will take you back to the main Control Panel for your account
Back to Top
Google Analytics Google Analytics
 
The Manage Google Analytics link is intended to allow you to quickly set up and configure a successful set of reports for a profile.
Create a Google Analytics account
To create an Analytics account:
  1. Visit http://www.google.com/analytics
  2. Enter your Google Account email and password and click Sign In. If you don't have a Google Account, click Sign up now to create one.
  3. Click Sign Up.
  4. Enter your Website's URL, making sure to select either http:// or https:// from the drop-down list. Enter a nickname for this account in the Account Name field, then click Continue.
  5. Enter your contact information and click Continue.
  6. Read the Google Analytics Terms of Service. If you agree to these terms, select the Yes checkbox and click Create New Account to continue.
 
The Tracking Instructions page that appears contains the Google Analytics Account # that you'll need to paste into the textbox.
 
 
Back to Top