Menu
The basic problem is this: I have a link to an image file. The desired behavior when I click on the link is to get the download dialog which would allow me to launch an associated image editor. This doesn't happen because the image file is rendered by the browser.
Is there any html magic which I can use to force the browser to offer a download dialog when the user clicks on a link?
Any help or pointers would be much appreciated.
342
Download links are created using the HTML anchor tag < a > ... < /a >, which is the same tag used for creating links to another web page. The only difference is that you have to set the HREF property equal to your download file, rather than specifying a web URL.
Open the three-dot menu on the top right and select More Tools > Save page as. You can also right-click anywhere on the page and select Save as or use the keyboard shortcut Ctrl + S in Windows or Command + S in macOS. Chrome can save the complete web page, including text and media assets, or just the HTML text.
The download attribute specifies that the target will be downloaded when a user clicks on the hyperlink. This attribute is only used if the href attribute is set. The value of the download attribute will be the new name of the downloaded file.
You can use the HTML download attribute to specify that the target will be downloaded when a user clicks on the hyperlink.
Two approachs:
Using Data URIs in the href of an anchor tag:
<a href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAYAAADphp8SAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAAOnAAADpwBB5RT3QAAABZ0RVh0Q3JlYXRpb24gVGltZQAwMi8yNS8xMapAVMwAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzVxteM2AAABjklEQVQ4jZWTwWoTURSGv5lMp1OmxUIUXISCCbW06daNtGuh7uMbCHaeoOBSzBMEN92LXXThohVtoAshOyuKJQkaXWRjKi7aBjPT9v6uEsbpTGp/OHDPvf/5zjmLa0niCo0zWMODA2BZVqZTEkG1RdwhoLaxMKqTBJKWJO1JOpN0Iek8EQqeNxVXLP8jqS7pniXpe+1V9+yw058ft19yoqHKJb+9XikcOcDcYadvj4Mki+P68q1/F5hz4s1qGwsABNUWszMOD+7nWS75THk5wshw0DzhbeM3x/3zJG/CiWdBtTU6r63kuZ2f5NnmD8LI4Lk2TyoFHq7mefnm56XJMldaLE5T2+oSRgaAQWR4sdWlXJpO9WeCbvi5EWSoQWSYmkwvyQRdGOG5/z57rn0JfiWo8emY4FFhBPNcm/VKgQ/Nk1S/k3oLvN4/Ym31Jk8f38FzbQah4fPXU3be/8oEGSCXfBhEhu16j+16L6tXXKENfFwq+u3/caepXPLbwDsk3ZK0G/tr14lTSTuSin8BUMr8td343bwAAAAASUVORK5CYII=">Download</a>
In some specific browsers, like Google Chrome and Firefox, you can do:
<a download="image.jpg" href="http://www.domain.com/image.jpg">Download</a>
103
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
