Moodle Markdown editing – hidden treasure Part 8
Part 8 of our using Markdown in Moodle series, this time we look at using images.
Previous posts in this series
- Introduction to Markdown – https://wp.me/p8KJp1-No
- Editor preferences – https://wp.me/p8KJp1-Nx
- Text formatting with Markdown – https://wp.me/p8KJp1-NJ
- Creating headings with Markdown – https://wp.me/p8KJp1-NQ
- Markdown to create lists – https://wp.me/p8KJp1-O4
- Quoted paragraphs – https://wp.me/p8KJp1-O8
- Adding links with Markdown – https://wp.me/p8KJp1-Oc
Images are included using Markdown in a very similar way to web links, but are preceded by an exclamation mark.
The alt text (meaning alternative text) is provided for users who cannot see the image (for whatever reason) so the text should make sense without any visual cues. Doing this will also provide a reminder or hint to those editing the text in Markdown as to the purpose of the image.
The optional title text is displayed in a pop up when the user hovers over the image and so can provide additional information:

Just like web links, you can organise your document by keeping all the URLs together using footnote style references. Just give the image a short, unique name:
![alt text][photo]
and the anywhere else in your document, usually at the bottom, associate that name with an image file:
[photo]: /url/to/img.jpg "Optional Title"
Here is an example:

The alt text, which is also important for accessibility reasons, will often be used by browsers when links to images are broken or temporarily unavailable:

There you have it – adding images with Markdown, not too difficult eh?
Why not try adding some images to a Label or Page using Markdown?
More interesting Markdown tips next post…
- H5P periodic table – 8th September 2023
- Moodle 4.0 – 15th May 2022
- Moodle 4.0 other highlights – 14th May 2022