How to Embed an Image

The HTML widget can be used to display online images in the mobile app.

Example project available

Clone documentation/forms-display-images-and-files to how this works.

Your layer should contain a text field for storing the full URL link (here: link).

To show an online image in the form, add the HTML widget to the form and configure it with this expression (replace link with the name of the appropriate field in your layer):

<script>document.write(expression.evaluate("'<a href=\"'||attribute( @feature, 'link' )||'\"><img src=\"'||attribute( @feature, 'link' )||'\" width=300></a>'"));</script>

Make sure that the HTML widget works before taking it to the field by testing it in the mobile app. It should look something like this:

Image preview in QGIS

Some QGIS versions may not display the preview of the image correctly. This issue does not occur in mobile app. Therefore we recommend trying the setup by opening the form in the mobile app to make sure it works as intended.