Uploading Images

CMS Express and Pro Versions Only

Before you can insert images using the WYSIWYG editor, you need to upload the images using an Image Manager Module.  An example of this is Shown below.  If you can't find an image manager module or you think they have not been set up, feel free to Contact Us with your query.  Simply click on the "Upload Image" Button to upload an image to the server.  You will be directed to a form where you can set these options:

• Name: This name is just to identify the image, it will not be shown to end users
• Description: Also just to identify the image, usually unneccessary
• Image: Let's you browse to an image on your computer to upload
• Scale %: This is the percentage size of the preview image, it does not affect the original image

Make sure that you resize the image to the correct size and save in a web format (jpg, gif or png) before uploading.  Unsure about editing images? Try downloading this free simple image viewer and editor at www.irfanview.com.  For instructions on how to use Irfanview click here. When all your images are uploaded you are ready to use them in the content editor.

   Image Manager

Inserting Images

Clicking on the image button in the editor will bring up the image dialog box as shown below.  The button can be used either to insert an image at the current location, or to edit a selected image.  This dialog is where you can insert previously uploaded images into your document.  To choose an image click on "Browse Server".  This will bring up a popup box with a simplified version of your website.  To select the image you want to insert, browse to the image manager that has the image you want in it.  Click on the name or picture of the image in the image manager module to select the image.  The location of the image will then be inserted for you.  There are also these image options you can set which are explained below:

• Alternative Text: A short description explaining the image.  This will be used as the tooltip for the image.  Also, if the user cannot display the image for some reason this alternative text will be displayed.
• Width / Height: Specifically sets the width and height of the image in pixels.  It is preferable however to resize the image to the correct size before uploading it so that it is optimised for its size.
• Border: You can set the border width in pixels.  Note that if an image has a link on it, its border will default to 2 pixels, so you must specify border 0 to get rid of this border.  Also, to change the border colour, select the image, and then press the text colour button in the toolbar to select a colour.
• HSpace / VSpace: The horizontal and vertical margins on the sides of the image.
• Align: Set which side of the page to align the image.  In order for text to wrap around the image, you must set this to something.