Hi folks,
I’m unsure if this is a known issue; I have a Hugo static website (v1.13.0) with the Autophugo theme (link) which I use as a gallery. I added a transparent GIF to the website yesterday, and the website renders the GIF with all of its frames at once. This also happened when using a transparent WebP image.
Link to the offending post. The GIF in the source looks exactly as it should; it just comes out of the Hugo site rendering looking like this.
I have tried adding configuration options for imaging.webp but this made no difference.
The resources section in the posts _index.md definition:
[[resources]]
src = '/smilky-pyrowiggly/001.gif'
weight = -1
description = ""
Any help with this would be hugely appreciated!
Thanks in advance!
Pyro
Hugo does not render GIFs. Your browser does. And here’s the “offending” line generated by Hugo:
<img src="/smilky-pyrowiggly/001_hu_bebb6ba22fb18034.gif">
It is just an img element with a src attribute pointing to your GIF. I have no idea if there really is a problem or what it might be, but it’s certainly not related to Hugo.
And checking your GIF here Check If GIF Is Transparent – Online GIF Tools gives exactly the same result as on your site.
Providing a screen capture and a link to a theme is insufficient to troubleshoot your issue.
You are more likely to receive a prompt and accurate response if you post a link to your project’s Git repository.
See Requesting Help.
Let us see your code
Include a link to the source code repository of your project, because we really need the context of seeing your templates and partials to be able to help you. It is trivial to do a quick git clone on your repo, then run hugo server in your project, to help you out. On the other hand, recreating your code from screenshots, or sort of guessing at it, is not.
If you can’t share your repository for whatever reason, consider creating a dummy repo that you can share, which reproduces the problem you’re experiencing.
Hi chrillek, thanks for having a look!
It’s confusing because I can even see in my codes repo that the GIF looks exactly as it should (link here); absolutely no idea what could be causing it to look so funny on just my own site!
Hi folks, narrowed this down to my use of theme; spun up a new site using Ananke and the GIF renders perfectly on that.
Will raise this with the Autophugo devs for assistance there.
Thanks for your assistance!
That theme does some resizing operations, so the problem is unlikely to be specific to your theme. Please post a link to your project’s Git repository, or a dummy repo which reproduces the problem you’re experiencing.
