Adding animated gifs

02/11/2017
<img src="URL TO IMAGE" style="max-width:100%;height:auto;">

You cannot simply add animated GIFs to your Webnode project. You will have to upload  the image to an external website and then link to it in Webnode using a HTML code. You can use the code above that I've created for you. 

What you should do with the code

1. Upload the picture you want to use. I will recommend using pictr.com. Copy the Direct link (URL) and paste it where I wrote URL TO IMAGE in the code. If you upload it to any other site, please make sure that you have the URL with the image extension at the end (.gif).

2. You can change the value of max-width to whatever size you want the animation to be displayed in. In the code on top it says 100%, this means 100% of the original size of the picture. You can change this to a lower percentage or pixels (px). Here's an example:

<img src="https://i.imgur.com/eQ399k6.gif" style="max-width:50px;height:auto;">

3. Simply paste the code into a HTML block in the project. Tadaa!

'

Why all this code just for an image?

To make it responsive! This way it will change size to look proper on smaller devices as well. the value "auto" for the height makes the height relative to its original width.

Make everyone happy :)

Check out the presentation here