Image Faders

To create/edit an image fader for your website you will first need to go to the "Display" Tab and select "Image Faders"

This will take you to the Manage Faders screen.  
You will see a section at the top called "Add fader"

In this section you can enter a fader name for reference such as "homefader" or "aboutfader" or "topbannerfader" or "sidebannerfader" (Be sure not to use numbers or leave any spaces in the fader name).

Name the fader something which you can relate to where you would like to place it on the website.

The background colour will allow you to choose a colour that will go behind the images if they are not the correct size.

 However, we recommend sizing your images to be consistant within one fader for aesthetic purposes.  For example, all images to be 300x300, 420x500 etc, depending on where you would like them to appear.

The last option is the actual dimentions.  Keep this consistant to the size of your images to avoid clipping or unwanted cropping.  If your images are sized at 300x300 make sure you input your dimentions to be 300x300.

Once you click "Create" you will be taken to another screen called "Edit fader" with your chosen fader name following this.

Here you will see information about the fader; Fader Name, Size, Background (all as chosen on the previous screen) and a new option of Fader Type.  This dropdown allows you to choose whether you would like to have the images fading or alternatively in a slide show.

You will notice that directly under Fader Type you will see the following instruction;

Insert ###examplename### into any WYSIWYG editor on the website to get the fader to appear there.

(please note the name "examplename" is just for the purposes of this guide.  The name of the fader within this command will be what you called the fader at the time you created it).

Just below here you will see the images section.  You can browse and upload images from your computer (remember to have them all the same dimentions beforehand to equal that of your chosen dimentions)

Once you have uploaded all of the images you would like in a chosen fader you will see some other available options.

Immediately to the left of each filename you will see a small plus symbol.  

Click this to reveal "Optional Hyperlink" and "Alt Tab".

In the optional hyperlink field you can copy the web address of a target page.  

When clicking on the image on the website, the user will then be taken to the desired page.

For example, if your image is of a particular product you may wish this to link directly to the product page.

In this instance you would go to the website, find the product page you would like to link to, copy the address bar(URL) of the product page and then paste it into the "Optional Hyperlink" field.  

Then, to the right just under the image preview you will see a check box for "New window".  If this box is checked, when someone clicks on the image on the website, the new target page will be opened in a new window.  If left unchecked this will open in the existing window.

The "Alt Tag" is used to give a description of the image so that when a browser is set to be text only (e.g. visually impaired users) this will be displayed rather than nothing at all.

You will also see a "Delay" field.  You can use this to set the number of seconds you would like each image to display for before fading/sliding into the next.

An instance where you may wish to use this is when you may have text on your images that users will need to read.  For this you may wish to have the setting a little longer.

Once you have entered all of your links (if you need them) and chosen your delay settings please ensure you click "Save Changes".

Now you have properly created your fader we are ready to insert it into the appropriate place on the website.

If you would like this to be on the homepage, copy (Using Ctrl+C) the command ###examplename### (the name of the fader you created) and paste this into the homepage content editing box (using Ctrl+V) where you would like it to appear.  

If you would like the fader to appear beneath a body of text, insert (using Ctrl+V) the code underneath the text.
Be sure not to place the fader command code directly next to another image, please leave a space.

If you require some additional or Specific Banners or Promotional Artwork for your site or any additional Graphic Design for a particular promotion you would like to run please feel free to contact your account manager to discuss this or simply contact us

To download a copy of these instructions with detailed step by step visual guide please click here