Image configuration

Once your account and domains have been configured you are ready to configure the images on your website, in order to do this you will have to alter the <img> tags in your code to include the operations that you wish to apply.

The correct html form of your <img> tag has to include the “src” property, you will have to remove this property in order to use ZMD, but do not worry your code will still be valid because the ZMD script will rewrite it the correct way with the final URL including your operations.

...
<img src="https://example.com/myimage.jpg" alt="My image description"/>
...

Below you will find that the “src” property is replaced by the custom “data-zmd-src” with the full URL to your image, this is important because ZMD need to know exactly which image your are trying to optimize.

Next, the custom “data-zmd-op” property will contain all the operations you want to apply to the image, like changing dimensions.

...
<img src="" data-zmd-src="https://example.com/myimage.jpg" data-zmd-op="w:800;h:550" alt="My image description"/>
...