How to Animate Gifs in the Quote Area for TpT

This post is about how to animate gifs in the quote Area for TpT (Teachers Pay Teachers online education store).

Have you noticed animated gifs in the quote are on TpT stores? This post has information about making an animated set of pictures that rotate for the quote area on Teachers Pay Teachers stores. Would you like a gif like this one?  This is an informational post, and the same information is available as a free product also on Teachers Pay Teachers.

First, here is a YouTube video showing how to make the gif.

After watching the video, please see this PDF with instructions to refer to as you create your animated gif.

animated-photos-tpt-quote-area

The PDF has links and step by step information for you to make your quote area pop.  It is free to create animated gifs at the site listed in the printable.

This is a link which will open a free blank Power Point all set up ready for your own pictures. The slides are correctly sized already.

blank-Power-Point-for-TpT-quote-area

You can view the quote area on my store for an example. The gifs may be updated from season to season as needed, also.  Do save whatever you create for future editing. The best blank-power-point-for-tpt-quote-area program to use is Power Point, I think.  Save the PDF for for future reference. These directions are also available as a free download on TpT.

How to Make an Animated Gif for the Quote Area in Teachers Pay Teachers Online Stores

  1. First, watch the free video at https://youtu.be/QUgkXX7ywWs
  2. The video shows how to size the slides in Power Point. These directions use photos made correctly with Power Point.
  3. Open four tabs
    1. http://tinyurl.com/
    2. http://gifmaker.me/
    3. An online page where you store photos (blog, WordPress, Photoshop—-wherever you can obtain a URL for the photo.
    4. Your store dashboard, edit profile section
  4. Have these links ready:
    1. Your TpT store link
    2. Your animated gif link when made and ready (you download it from gifmaker.me)
  5. On TinyURL.com get a shortened link for your store.
  6. On TinyURL.com get a shortened link for your animated gif.
  7. In the HTML code below, paste the shortened link for your store where the first link is.
  8. In the HTML code below, paste the shortened link for your photo where the second link is.
  9. Be sure to copy/replace the links exactly where the links are, and be sure not to accidentally remove a quote or any of the code.
  10. Copy paste your new code in the quote area space in your TpT store (edit profile area).
  11. SAVE the code you create. If you change the animated gif in the future, you can just replace the second link below as the rest will remain the same.

<a href=”http://tinyurl.com/foryourstoreorsite“><img src=”http://tinyurl.com/foryouranimatedgif“></a>

USE TinyURL

Use TinyURL not bitly  (at least in my experience)

Why TinyURL? Because the quote area space in TpT is limited. If the links are not shortened, it will not work.

These instructions require some familiarity with blogging, Teachers Pay Teachers, a little HTML knowledge, and how to find the edit profile area of your store.  These instructions only apply to TpT and are not intended for other stores.

how-to-tutorial-animate giffs-quote-area-tpt

 

About the Author:

Carolyn Wilhelm is the author of The Wise Owl Factory site and blog. She has an MS in Gifted Education, a MA in Curriculum and Instruction K-12, and has completed the KHT Montessori 12 month program. She makes mostly free resources for teachers and parents.
29 Shares
Pin2
Share3
+11
Share1
Tweet22
Buffer