WriteNowDesign 303-907-6133 patfortino@writenowdesign.com

To add an image to a Joomla article

Important – This procedure requires that you have JCE Content Editor ( http://www.joomlacontenteditor.net/ )installed.

Generally, images cannot be wider than 500px. Check with your website designer if you don’t know the maximum width for your article images. If you need to add an image larger than 500px, see To add a pop-up image to a Joomla article.

1.	In an open article, add a new paragraph. To add a new paragraph, put your cursor at the end of an existing paragraph and click Enter. If the paragraph is a heading 1, 2, etc, on the Format menu, click Paragraph.

2.	With your cursor in the new, blank paragraph, click Insert/Edit Image

3.	Click the images folder and then click the image you want to use.

Note – If you want to upload an new image, from the image directory, click Upload and then navigate to the file on your local machine.

4.	Add the following settings to the Image Manager dialog box.

n	In the Description box, enter a description. Title and Description can be the same. Use something descriptive to help search engines.

n	In the Title box, enter a title. Title and Description can be the same. Use something descriptive to help search engines.

n	In the VSpace box, delete the text.

n	In the HSpace box, delete the text.

5.	Click the Advanced tab and change the following settings:

n	In the Style box, delete ALL text.

n	In the Class List, select img-border.

n	If you want the image to float left of the text, place your cursor in the text paragraph where you want to start the float and select img-border-fl from the Class List.

Figure 39 Image Floated to the Left

n	If you want the image to float right of the text, place your cursor in the text paragraph where you want to start the float and select img-border-fr from the Class List.

Figure 40 Image Floated to the Right

6.	Click Insert to add the image.

7.	(Optional) If you want to add a caption:

n	Add a paragraph below the image.

n	Type the caption text.

n	With your cursor in the caption paragraph, in the Styles box, select Caption.

Figure 41 Styles List

8.	Click Apply and then in a different browser screen, open that page on your live website to see the changes.