WriteNowDesign 303-907-6133 patfortino@writenowdesign.com

To add a pop-up image to a Joomla article

If you have a large image that doesn’t fit into the 500px width, you can add a popup image. The Popup image functions allows you to put a smaller, thumbnail image on the page. This image has a magnifying glass icon on it. When the users clicks the thumbnail, the larger image is displayed.

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. Joomla displays the Insert/Edit Image screen.

Important – If you want the image to float to the left or right of text, place your cursor in the text paragraph where you want the float to begin.

Figure 11 Insert/Edit Image Screen

3.	Click the Popup tab.

4.	In the Popup Image section at the top of the screen, select the Enable.

5.	Click the image you want to use.

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

6.	Click the Create Thumbnail button. Joomla creates a thumbnail image.

7.	Again, click the image you want to use. Joomla displays the following message: Use Associated Thumbnail?

8.	Click Yes.

9.	Click the Advanced tab.

10.	From the Class List, select one of the following styles:

n	If you can the thumbnail positioned below the proceeding paragraph, select img-border

n	If you want the thumbnail to positioned to the left of the paragraph text, select img-border-fl

n	If you want the thumbnail to positioned to the right of the paragraph text, select img-border-fr

11.	Click Insert and then click Apply.

12.	View the page in your browser to test the popup image.