A common question we receive from Joomla beginners is "will I need to learn HTML code to build a Joomla website?" The answer is "no – but it helps". It is easy to insert an image into an article as demonstrated in lesson 10 of our free Joomla training for beginners course – The Basics.

However when you insert an image and align it to the left or right of text, the characters usually end up pressed against the image which doesn't look good. You can add some spacing in HTML mode if you know how. But it's much easier when you replace the standard Joomla editor with a free extension called JCE. Here is the process:

1. Download JCE

2. Install it as you would any extension. Review lesson 12 - Joomla Extensions - if necessary.

3. Enable JCE. You can make this the default editor for all your users in Global Configuration.

The default editor settings in Global Configuration

Or you can just make it available to you on the My Profile page.

The editor settings in My Profile
 

4. Open an existing article or create a new one and note that the editor now looks different. There are now many more icons available. Select an existing image and click the image icon which is on the last row towards the right. Or to insert a new image, position the cursor at the point where you want the image and click the image icon.

Select an image and then click the image icon in the editor
 

5. From the alignment drop-down, choose either right or left.

6. The next line, labelled Margin, is where you can set spacing around the image. To insert the same amount of spacing around all sides of the image, just enter a number into the Top box and leave "Equal Values" ticked.

How to set uniform spacing around an image

But you probably just want a bit of space on one side of the image. In this case, untick the "Equal values" box and add numbers in the relevant boxes. For example, if your image is aligned to the left, you might enter 10 in the right box. The result will be that the image has 10 pixels of space to the right which gives the text some "breathing room". You may also need to add some space to the bottom.

Alignment and margin settings 

JCE is an excellent extension and provides many more features than the standard Joomla editor.

The idea for this article came from our forum. Anyone is welcome to post in our general forum. And Joomla Pro members have access to an exclusive forum for priority support.