file download link in shopify page content

ErSanjay
Shopify Partner
293 20 42

I don't want to open a file in the browser when the user client on download it will download the file in the system.

i try in w3school but the Shopify link not working  here my test code, when you click on the 3wschool  logo it downloads b 

 

 

<!DOCTYPE html>
<html>
<body>

<p>Click on the w3schools logo to download the image:<p>

<a href="https://www.w3schools.com/images/myw3schoolsimage.jpg" download>
  <img src="https://www.w3schools.com/images/myw3schoolsimage.jpg" alt="W3Schools" width="104" height="142">
</a>

<a href="https://ni26gl1ffc-flywheel.netdna-ssl.com/wp-content/uploads/2015/08/BLUE_desktop_900x600.jpg" download>
  <img src="https://ni26gl1ffc-flywheel.netdna-ssl.com/wp-content/uploads/2015/08/BLUE_desktop_900x600.jpg" alt="W3Schools" width="104" height="142">
</a>

<a href="https://ni26gl1ffc-flywheel.netdna-ssl.com/wp-content/uploads/2015/08/BLUE_desktop_900x600.jpg" download>
  <img src="https://ni26gl1ffc-flywheel.netdna-ssl.com/wp-content/uploads/2015/08/BLUE_desktop_900x600.jpg" alt="W3Schools" width="104" height="142">
</a>


<a href="https://cdn.shopify.com/s/files/1/0815/3777/products/IC0A12881_180x.jpg?v=1597916651 180w"  download >
 <img src="https://cdn.shopify.com/s/files/1/0815/3777/products/IC0A12881_180x.jpg?v=1597916651 180w" alt="W3Schools" width="104" height="142">
800x600</a>
</p>

<p><b>Note:</b> The download attribute is not supported in Edge version 12, IE, Safari 10 (and earlier), or Opera version 12 (and earlier).</p>

</body>
</html>

 


 

Business Owner & Shopify app developer - shopify consting - Full Stack Sofware Engineer
Er Sanjay
Reply 1 (1)

HandHugs
Shopify Expert
198 1 60

this depends on the browser, but chrome and firefox only allow  same-origin download links, and since shopify serves all its images from their CDN it disqualifies it.

"* Chrome 65+ and Firefox only support same-origin download links."

Source:

https://www.w3schools.com/tags/att_a_download.asp