Search code examples
github-pages

How can I make gifs show up on Github Pages posts?


I've found that I can make a gif show up on the README.md page like so:

![gif](https://github.com/jss367/antools/blob/gh-pages-2.3.4/assets/images/cat.gif)

or like so:

<img src='https://github.com/jss367/antools/blob/gh-pages-2.3.4/assets/images/cat.gif' />

However, those same lines of code don't work when I add them to a blog post. Do I need to add something to the layout? Or is it turned off in Github Pages?

I've found that they show up on the blog post when the gif is hosted on gifs.com but not when hosted on Github. For example, this works:

<iframe src='//gifs.com/embed/k8A5jN' frameborder='0' scrolling='no' width='1280px' height='720px' style='-webkit-backface-visibility: hidden;-webkit-transform: scale(1);' ></iframe>

but this doesn't:

<iframe src='https://github.com/jss367/antools/blob/gh-pages-2.3.4/assets/images/cat.gif' frameborder='0' scrolling='no' width='1280px' height='720px' style='-webkit-backface-visibility: hidden;-webkit-transform: scale(1);' ></iframe>

I'd like to host it directly on github.com.


Solution

  • Your link goes to a webpage. Use a direct link or proper directory

    Try this:

    <img src='https://github.com/jss367/antools/blob/gh-pages-2.3.4/assets/images/cat.gif?raw=true' />