Insert Image on MkDocs

Now that you know how to install MkDocs and edit the configuration, it’s time to manage your documents. One of the managements is to insert images. In addition, this post also shows how to make our documents online, so that our documents can be read by all people in the world.

Setting mkdocs.yml

This file is available when we finish installing MkDocs via PIP. This file can be opened with any editor, such as Visual Studio Code (VSC). Please delete or edit the available menus according to your needs.


This is the main part for editing text, namely mark down (md). To make it easier where the script, titles, and images are placed, run the mkdocs serve server. By running the server, the changes we can see the change immediately. Insert the image using the following code in the section you want.


Continue by filling in the image in the img folder location in the docs folder in MkDocs.

Deploy markdown results

Finally, deploy settings by running the code:

mkdocs gh-deploy

If there are no errors, the site folder in MkDocs is ready to be uploaded online. For details, see the following video.


Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:


You are commenting using your account. Logout /  Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout /  Ubah )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.