How to Insert an Image into an Article in Joomla - dummies

How to Insert an Image into an Article in Joomla

By Seamus Bellamy, Steve Holzner

Image files stored in Joomla’s Media Manager can be displayed in articles. In fact, the same picture can be displayed in more than one article. Remember, in Joomla, the webpage doesn’t exist until the user requests it. Then Joomla grabs all the necessary elements from the database — including image files — and builds the page on the fly. To insert an image into an article, follow these steps:

  1. Open the article in which you want to insert the image. (Choose Content→Article Manager and then click the article’s name to open it in the article editor.)

  2. Click the place where you wish to place the image.

  3. Click the Image button below the Article Text window.

    The image-insertion dialog box opens.

  4. Locate the image file you wish to use in Media Manager’s main directory or one of its subfolders.


  5. Click the thumbnail image of the picture you want to include in your article.

  6. Click the Insert button in the image-insertion dialog box.

    Joomla inserts the image into the article.

  7. Now, click the Save & Close button.

    After you return to the Article Manager: Articles page, use the View Site link at the top of the page to inspect your work. Navigate to the Privacy Policy page. You find that your newly inserted image has really spruced up the page.


In the same way that you can insert images into articles, you can insert multimedia. To do so, click the Insert/Edit Embedded Media button in the TinyMCE editor’s middle toolbar.

Note that instead of navigating to Media Manager each and every time you want to upload an image for an article, you can also add images on the fly from inside of an article through the options available to you after the Image button below the Article Text pane has been clicked. Now that’s convenient!

If you plan on using an image hosted anywhere other than your own computer — a Dropbox or Flikr account, for example — be sure to either write down the image’s HTML address or copy it from your web browser so that it can be entered into the Image URL field.

Take the time to consider both the image’s dimensions and file size before adding any image to your site. If an image’s dimensions are too large, its inclusion in one of your articles may detract from your site’s design instead of enhance it. If the image’s file size is too large, your site’s viewers could face long load times before the picture you wanted to include with an article appears on their monitor.

Fortunately, most modern image editing programs such as Photoshop CS5 or GIMP can change the dimensions and file size of any image you throw at them.