I would like to have shields.io badges on my website, but I’d rather avoir “leaking” user info to their CDN by hyperlinking images to them. Instead, I’d really like a Tera function that downloads the image from shields .io, stores it in the public directory and returns a static URL that I can put in an img tag. That way, I’m hosting copies, and my user’s IP addresses are not shared with a third party. This also makes my website more resilient.
Since shields .io badges are SVG, I tried using load_data to directly embed them in the HTML. It kinda works, but their SVG uses id="" attributes which conflict with one another when more than one shield is on the same HTML page. I guess they’re really not meant to be embedded, and are supposed to be referenced by img tags. Because the shields depend from page information provided by Zola, I can’t just make them manually beforehand.
Would you be interested in a PR that implements such a function? Ideally, it would look pretty much like “load_data” with an additional argument to specify the end of the output file name (the full name would probably include some kind of leading hash, like resize_image does). It would respect the Content-Disposition: attachment; filename="file name.jpg" HTTP header in case the argument is not provided, and would ultimately fall back to just using the URL’s basename as a file name.
An alternative option for me is to partially reimplement shield.io badges myself using pure Tera. That’s doable but rather ugly.
They are generated on-demand based on some Zola-provided metadata. It would be really cumbersome to create them manually. I could also keep the shields .io URL up to build time, and have a second pipeline step that downloads the files locally while replacing all instances of the URL, but it’d be simpler if this was built into the SSG.
Could this just be done as a build step before you run zola build or serve? Pretend, for example, that you have a curl command that downloads the images using the arguments that you want, and saves them in the static directory. Then you just run zola build and reference them that way. A lot of people build zola as a part of other processes so using npm run build or some kind of other build script is pretty normal. A lot of things you actually can’t do otherwise. If the locations of the images is dynamic then you could even write them to a file and then later read them back in zola. Just an idea!