How to Make & Upload Animated GIF to Instructables (Video)




About: One of a kind nifty gadget reviews | Life-changing hacks | Weird facts and news.

In this project I'll show you how to make animated GIF files online for free and how to upload them to

If you don't prefer to read, you can skip it and watch the video instead where I have explained all the steps in detail. If you do, then continue reading the written steps along with pictures in the following steps. Find out more similar projects and gadget reviews on my YouTube channel

For this tutorial, I'll be making a GIF animation from one of my previous DIY Flamethrower project. You can watch that complete video here.

Step 1: Get Started!

I'll be making a GIF video from one of my existing videos since that is what I usually require.

1- Open Google chrome and go to

2- Click on 'Choose file' to upload a video from your computer.

3- Once the video is loaded, it will display on the screen in the builtin video player and it will say 'Media is active' below it in green. That means this format is supported and it supports most usual video formats like mp4, m4v, webm, mkv etc.

4- Move the timer to the position you want to start recording from. You can do this manually by dragging the the timer with your mouse.

5- When you are happy with the position, click on 'Use this frame as starting'.

6- Select a capture width resolution between 30-900px. I keep it around 500. The larger the resolution, the bigger the file size hence that much more time it will require while loading online.

7- Select the number of frames you want to capture. I start with 20, you can change it later.

8- Select the frame record intervals. Keep it around 50. The higher you go, you animation will lose fluency and it will seem like its lagging.

9- Click on capture frames

10- After a couple of seconds, it will display all the frames captured, Now click on Compile to GIF.

11- It will prepare the GIF animation and you can preview it before saving and the bottom of the screen.

12- Go ahead and save it to your computer.

Let's move to the uploading part.

Step 2: Upload Your GIF Video

In order to upload the animated GIF to instructables, it must be somewhere online first. So you can upload it to your Google drive. This is relatively simple and you can follow the steps in the pictures to upload your GIF file from your computer to your G Drive.

1- Once uploaded, double click on it to open it within google drive, click on the 3 dots in the top right corner of the screen and click on 'Open in new window'

2- Then go to the new window and again click on the 3 dots in the top right corner, this time a new option will show up, Embed Item, Click on it.

3- It will display an HTML code. Select the whole code, right click and select copy.

Step 3: Upload to Instructables.

1- Go to Instructables and open your project. You can edit an existing one or start a new one.

2- In the image upload section, upload the GIF file from your computer.

3- Initially it will show as a still image in the image bar. Right click on the image and click on Inspect.

4- A window will open up in the right side of the screen with some text highlighted.

5- Right click on the highlighted text and select Edit as HTML.

6- Delete whatever you see in the text box and paste the HTML code you copied earlier from google drive.

7- Click on the small X in the top right corner to close the Inspect function and then go ahead and save your project.

Your GIF is now ready and when you or anyone visits your projects, your GIF file will be playing like a mini video among the still images like you can see in the last image above.

If you know of any simpler ways to do this, do let me know in the comments below.

I hope you like this project and don't forget to share it with your friends and family.
I do all kind of life hacks, tech hacks and science projects on my YouTube channel MiiBooth along with gadget reviews and facts videos, so make sure you subscribe and let your friends know as well. You can also check out my other instructables on my profile page

- Subscribe to my YouTube channel

- Follow me on Instructables @ MiiBooth

- Like my page on Facebook at

- Follow me on twitter @MiiBooth



    • Barbeque Challenge

      Barbeque Challenge
    • Backyard Contest

      Backyard Contest
    • Paint Challenge

      Paint Challenge

    9 Discussions


    1 year ago

    Does this still work? They don't seem to show up for me and I don't see any animated gifs in this instructable either


    1 year ago

    this is a really well made instructable! thanks for your help!


    2 years ago

    Thanks for the helpful instructable!

    I Follow Aslan

    2 years ago

    That was so helpful and straightforward! Thank you!


    2 years ago

    Thanks for the instructable. cheers


    Reply 2 years ago

    When I upload it straight from my PC, it shows as a still image. How do I get an HTML embed code if I don't upload it online first?


    Reply 2 years ago

    in edit it shows that it is still but when you preview or publish it there is motion. Also, you can right click on the gif (after it has been uploaded) open it in a new tab, copy the address, and then put the address in place of <img alt="test" src="the text here" style="width: 200.0px;height: 200.0px;">