The problem is because you’re using a cross-domain URL. From the documentation for the download
attribute:
download
only works for same-origin URLs, or the blob:
and data:
schemes.
To fix this you need to host the image on the same domain as the parent site.
Noob webdeveloper here.
I’m trying to download an image from an url on click. But when I use the image url as my href it just redirects to that url instead of downloading. Of course I am using the download attribute. I have tried my own code and also mulitple code blocks from other people. But all of them just redirect. I am using google chrome.
My code:
<a href = "https://autoooo.nl/wp-content/uploads/2018/12/F5144B9C-2B27-4070-828E-2361EBD702EF-400x400.jpeg" download="car" id="downloadQRCodeButtonHref">
<p>download</p>
</a>
Code I used from someone else 1(accepted answer):
<a download="custom-filename.jpg" href="/path/to/image" title="ImageName">
<img alt="ImageName" src="/path/to/image">
</a>
Code I used from someone else 2:
<p> Click the image ! You can download! </p>
<?php
$image = basename("http://localhost/sc/img/logo.png"); // you can here put the image path dynamically
//echo $image;
?>
<a download="<?php echo $image; ?>" href="http://localhost/sc/img/logo.png" title="Logo title">
<img alt="logo" src="http://localhost/sc/img/logo.png">
</a>
Some help will be appreciated. I might just be a big dum dum and overlook something extremely obvious.
This downloads an image from an already existing php page with the image on it. I want to download an image from an url. But it might come in handy. Thanks.