Prepare the Image for Uploading

Your picture is likely to be on your own computer, where you can edit it and give it a suitable name.

    • The image should be a file in a standard format - normally jpeg or png
    • Give the image a short name without spaces. (The computer-way is to use capitals - eg LondonVisit)
    • Images should be in JPEG or PNG format and MUST BE OPTIMIZED!  Images larger than 100KB are probably too large!  

    Note on editing images:

    This is a large subject in itself. There are many packages used for editing photographs and various images. If you are doing simple illustrations, a simple editor like Paint is perfectly suitable - Adobe Photoshop is the industry leader.  Contact your web developer by opening a ticket (above) for help if you are unsure.  If you are experienced using images, you will know enough about image manipulation not to need to be told it here... 

  • This is very useful for screen capture and simple editing -
  • Video tutorial:  Prepare Photos for Upload

To Insert an Image Using JCE Editor:

1. Select the image from the File Browser section by clicking on its name. The Display view will update with the image's details, and the image's attributes will be transferred to the Attributes section. There will be a slight delay as the image's dimensions are retrieved. The Insert button will be disabled while this happens.

2. Adjust the Article Image properties.ime tab image

URL - The URL field represents the image's src attribute, and is the path to the image on the server. This should be absolute, ie: it should include the protocol and hostname in the url.

Alternate Text - This represents the alt attribute, and defines a short description of the image.

Dimensions - The width and height of the image, in pixels. Changing these values automaticaly updates the Style value. If the proportional checkbox is checked, changes to one value will automatically be affected on the other.

Margin - Represents the amount of space (in pixels) between the image and surrounding items. If the Equal Values box is checked, all margin positions will inherit the same value.

Alignment - The position of the image relative to surrounding text. In the case of Left and Right the float style is used, otherwise the text-align style is set.

Border - Although this would appear to represent the border attribute, as this has also been deprecated, the chosen values are used to assign a border style to the image. If any of the values is set false (ie: 0 or none or blank) the border stlye is not inserted or an existing one is removed.

Changes to the Margin, Alignment and Border attributes are all reflected in the sample image and text layout in the Preview sectio3. Click 'Insert'.

To Update an Exisiting Image Using JCE Editor:

When the Image Manager opens, all relevant fields in the Attributes section are populated with the image's attributes. Any of these fields can be edited.

The folder where the image resides is opened and the image selected. The image's properties are displayed in the Details view.

At this point you can change the image by selecting a new one (follow the steps above) or alter any of the fields in any of the tabs  in the Attributes section.

Once you are happy with the changes, click the Update button.