Inserting an image into a web page via the Edit Text box

A picture is worth a thousand words - each community has a multitude of ways to use photographs, via home page images, web page images, page galleries, and media galleries.

The page image tool is the normal method for inserting a single image on a page, and will appear to the left or right of the screen depending on the alignment chosen in the upload image tools.  Both the page image and page gallery images must be in the form of a .jpeg, or the system will not allow the image to be uploaded.

To insert a .gif or .jpeg image into a selected place in the page, and control how far down the page it will appear, a simple html code is used.

To see how this code works, look at the image of an anchor on the following 'A Learning Place Showcase' PLC site page about using anchor points in a page:  Anchors, found in the 'Editing web pages with html' site section in the menu .

The image at the top of the page is actually a gif, and it is loaded by simply uploading the gif image into the 'Document Store' site section, taking note of the image properties, and adding one line to the html code, as shown by the bolded section below:

<BR><STRONG>Anchor Tags<BR></STRONG>
<P align=right>
<IMG alt="anchor" src="/uploads/documents/store/doc_184_429_anchor.gif"></P>
<P><STRONG>Links within a page - anchor tags</STRONG></P>

Where src is the ‘source’ location of the image, in this case the location of the image in the document store (find the doc_ number_name id number for your image by looking at the image properties in the document store). 
TIP:  if you don’t want a list of images appearing in your Document Store area, put them in the Secure Documents area so that they will not be visible to the public.

The alt tag is necessary so that visually impaired visitors using impairment assist software will know there is an image in that location as their software will read the word you place in the alt tag to them.  It is also EQ policy that you will include alt tags.

The line above the image tag (IMG), is where you manually select the alignment, so you can choose if the image is justified right, center or left.

The html code of the page can be found by opening the ‘Edit text’ button in the page tools, clicking on the <> ‘View html source’ button and inserting the first 2 lines above before the rest of the html code.  ‘Anchor Tags’ in the first line is merely where you type the title of your page.

REMEMBER:  This manual process means you must optimise your photos yourself – be careful you don’t upload photos with a huge file size into  your web page or it will take a long time to download the image and open the page (if at all!).