This item helps you insert an image in an article (or event) to make the content come alive. You can either upload an image from your computer or link to one already on the website.
Inserting an image generally takes place in the middle of creating or editing an article (or event). If the next paragraph causes your eyes to glaze over or you find inserting an image difficult then please just create the article with text and send your raw images to the
The site uses images 250 pixels wide (and 400 pixels wide if a larger image is useful on the article page). Ideally we use square images, that is 250x250 or 400x400, but getting the width right is the more essential of the two. For photos we use JPGs at a quality of about 80. You will probably need to use an image editor to reduce your digital photos to these formats/quality level. Eyes glazed? See the paragraph above.
To insert the first image in an article:
- When editing the article, click on the Images and Links tab (just under the Save and Cancel buttons).
- Click the Select button in the Intro Image field - this brings up a separate file explorer type window showing the folders and image and other files on the webserver.
- If your image needs to be uploaded to the website, browse in this window to the folder where you want the image file to be stored and then click on the Upload option at the top right - this opens a further file explorer type window showing folders and files on your computer. You can scroll down to the bottom of this new window and click on the Browse button to select one or more image files that you want. Once they are selected click on the Upload button to upload them to the webserver. This window will now close to reveal the file explorer window that is looking at the webserver files.
- Highlight the 250 pixel wide image you want to appear as the intro image for the article and click on the Insert button at the bottom of the window. This will close the file explorer window looking at the webserver files.
- Type in a Alt text string that describes the image suitably to a blind or other person that cannot see the image. Providing Alt text for images is important to the site meeting accessibility standards.
- Type in a caption (if relevant) - this will appear attached to the bottom edge of the image. We tend to use this to list people appearing in photos etc.
- Complete the same information for the Full Article Image section. In most cases this is most easily done by copying and pasting all the information entered via steps 2-6 above in the Intro Image field. However when there is a detailed image such as a photo of a lot of people then it is better to upload a matching 400 pixel wide image for the Full Article image - the Alt text and caption would remain the same.
It is this first image that appears on the site home page (with featured articles) and in the eNewsletter. It contributes to the professional and engaging look of the site and newsletter.
In rare cases you may wish to upload and display more than one image in an article.
To display a second and subsequent image
- Place the cursor in the text in the editor window where you want the image to be inserted - this should not be in the intro text area but should allow room for the first image to be displayed.
- Click on the Image button at the bottom of the Editor text area. This will open a separate pop-up window that allows you to:
A. Input a URL address for an image already located elsewhere on the internet by simply typing or pasting the full URL into the Image URL field;
B. Select an existing image already on the site by simply using the navigation options at the top of this pop-up window to select the image - this selection will put the appropriate URL into the Image URL field; or
C. Upload a new image (or images) that you can then select - navigate to the site folder where you want the uploaded image file to be stored and then scroll down to the bottom of the pop-up window to select the image file on your computer and upload it - once this is uploaded you can then select the image in your site's folders to put the appropriate URL in the Image URL field. - Once the Image URL field is populated appropriately you need to add some simple information before clicking the Insert button at the top right of the window:
A. Select whether you want the image to be left or right aligned withing the article using the Align drop-down immediately to the right of the Image URL field;
B. Scroll down and add an Image Title and an Image Description - these are useful to improve the site's accessibility, in particular to vision-impaired users and search engines; and
C. Check the Caption box if you wish to use the Image Title as a caption - When your content item is complete and saved it would be worthwhile previewing it and checking that the image appears as you intended.
- If you wish to edit the image once it is in a content item, in the article or event Editor window you have two simple options:
A. You can select the image and drag the corners to make it bigger or smaller - but try to avoid loading a large image file only to then make it smaller as the large file will be loaded each time the article is loaded; or
B. You can select the image and delete it from the article and start again (though you won't have to upload it again as it will still be on the server).
We hope this FAQ item has assisted you. Please
