How to add an image using the HTML editor in Moodle 2.
The HTML editor enables complex text and image tasks. For this example, an image will be added to a post within a Glossary, however, the same steps can be followed to add an image to any text, as long as the HTML editor appears to offer help.
Determine where to place the image.
Type the text that accompanies the image (if relevant).
Type an image description or accompanying text if desired, then place the cursor where the image is to display.
Next, click the "Insert/edit image" icon.
The icon looks like a small tree in the third row of the HTML editor.
Option A, paste a URL for an image file from the web.
Copy a URL into the Image URL field.
Note: Be sure to complete the Image description text for people using page readers for accessibility.
Option B, browse to an image in a folder by clicking "Find or upload an image...."
This will open the File picker and to select the image to be inserted.
Option C, use the File picker to select an image from one of the repositories.
Browse for the file, select it, then click "Upload this file" to the course. Click on the image title in the File Browser. Once selected, click the "OK" button to insert the image into your text.
After the file is selected, go to the "Appearance" tab to alter dimensions and justification of the image.
Update the layout, spacing, and size of the image by adjusting the settings. Then click "Insert."
Preview image
The preview window should display the image. If necessary, readjust the appearance settings to get the desired results.
To change the image settings, click the image itself and press the "Insert/edit image" icon in the editor.
Note that the selection of the image is made clear by the drag icons around the image.
After you have made changes to the settings, click "Insert" and "OK" to save.
Sign up for one of our training offerings to learn more about how to participate in Moodle courses.
| Prev: How to see a list of people in a course in Moodle 2. | Next: How to use the File picker in Moodle 2. |
