How to Create Download Link in HTML5 | Making Direct Downloadable Button for Any File Type

แชร์
ฝัง
  • เผยแพร่เมื่อ 6 ธ.ค. 2024

ความคิดเห็น • 189

  • @iliashdz9106
    @iliashdz9106 6 ปีที่แล้ว +10

    LOOK HERE! It's very important that you add ".png" after the name of your image at *download=""* . So that windows can directly recognize it as a PNG file (Image file with transparency). Otherwize the "Open with..." window wil pop up.
    Same applies with the music. Just add ".mp3" after the name at *download=""* .

  • @KhalilCh
    @KhalilCh 5 ปีที่แล้ว +6

    I used (download) at the end of tag but it still takes me to the music page not downloading the mp3 file

    • @ukgames304d
      @ukgames304d 4 ปีที่แล้ว

      Same

    •  4 ปีที่แล้ว

      me too

    • @siddhantdhandore6276
      @siddhantdhandore6276 4 ปีที่แล้ว

      Try using Firefox (if you are using Google Chrome)

    • @self-coder1621
      @self-coder1621 4 ปีที่แล้ว

      if not working download attribute check this out-th-cam.com/video/azssOhJsLEw/w-d-xo.html

  • @PoetAayush
    @PoetAayush 4 ปีที่แล้ว +11

    Its not working on my laptop Every time I click on the link it starts playing song but doesn't download!

    • @Mr2goody
      @Mr2goody 4 ปีที่แล้ว

      Me too bro

    • @samarthkumble8385
      @samarthkumble8385 4 ปีที่แล้ว +2

      For me it worked with .exe files

    • @anshhhwuwuwuuw
      @anshhhwuwuwuuw 4 ปีที่แล้ว

      Try the following ways:-

      Your title

    • @awasthianil8814
      @awasthianil8814 4 ปีที่แล้ว +1

      You should use Microsoft edge

  • @mannycepeda1
    @mannycepeda1 7 ปีที่แล้ว +1

    I'm using html 5 and I have my files in a sub-directory. When I hit the browse, it gives me the correct address yet, I'm getting a "no file found" message. Can you clarify? I want my fans and future hires to be able to download my high resolutions jpgs. Thanks!!!

    • @mannycepeda1
      @mannycepeda1 7 ปีที่แล้ว

      I got it. Realized it was case sensitive and I had some JPG and some jpg. Thanks! It works like a charm!!!

  • @sammbende2
    @sammbende2 4 ปีที่แล้ว

    hi there im also redirected but to the play page rather than downloading. Any help?

  • @dex4755
    @dex4755 4 ปีที่แล้ว +1

    I want to set one dll file in download buton,how to do that?

  • @124ameyrajas6
    @124ameyrajas6 6 ปีที่แล้ว

    hey man I use wix to create my website ,I also want to add download button through HTML can u plz help me???
    As u used logo.png ,I just want to where the file is located logo.png in your computer means I want to know whether it is your computer or stored online somewhere???

  • @ashishvarshneyofficial
    @ashishvarshneyofficial 6 ปีที่แล้ว

    Really Helpful For Me..
    But how to Implement this in wordpress or blogger to let our users download Images From our website..

  • @yogeshborhade5533
    @yogeshborhade5533 4 ปีที่แล้ว +1

    How can we use it to download the same whole html page while browsing it

  • @ankitmaurya6617
    @ankitmaurya6617 4 ปีที่แล้ว

    Thanks for help👍👍

  • @emirlyesmeraldadiazduque3808
    @emirlyesmeraldadiazduque3808 6 ปีที่แล้ว +1

    Thank you, me haz salvado, había visto otro vídeos y hacían muchas cosas, solo para descargar el archivo.

  • @OllytheOzzy
    @OllytheOzzy 5 ปีที่แล้ว +1

    Dude your videos are so to the point it’s awesome !

  • @Tokyu_division
    @Tokyu_division 4 ปีที่แล้ว +1

    i need help my files doesnt apear in my web the file name is keymaker.exe

    • @Tokyu_division
      @Tokyu_division 4 ปีที่แล้ว

      @Axel Steiner nah nvm got the solution

  • @Roki_100
    @Roki_100 6 ปีที่แล้ว

    create button like "press and it downloads 4 files" is possible ?

  • @shakeelnawaz8553
    @shakeelnawaz8553 7 ปีที่แล้ว

    Nice sharing. but its not working on firefox and internet explorer and old browsers. please help

    • @AshishKumar00
      @AshishKumar00 7 ปีที่แล้ว

      yes it do not work in case of internet explorer..
      i was searching for some plugins like file-saver.js but i couldn't able to download for image.
      My code is: -
      let base_image = new Image();
      base_image.src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==';
      return (
      FileSaver.saveAs(base_image.src, "image.png")}>DOWNLOAD
      Plz help

  • @dzjrx
    @dzjrx 4 ปีที่แล้ว +3

    Wow, thanks bro, helps a lot!

  • @thegamerbalaji
    @thegamerbalaji 6 ปีที่แล้ว

    Does this work for document files

  • @MahendraSaini
    @MahendraSaini 4 ปีที่แล้ว

    Very Helpful.
    THANK You

  • @ferget9111
    @ferget9111 7 ปีที่แล้ว

    i have very simple question is this code also able to be use for android type devices..meaning they could download content from a website?

    • @blockcamp
      @blockcamp 7 ปีที่แล้ว

      i think yes

  • @theislamic_messages_media6762
    @theislamic_messages_media6762 6 ปีที่แล้ว +1

    hi bro ,it does download in chrome please ...how can solve that ...it only worked for me in Firefox...but i would like it download in chrome too

    • @self-coder1621
      @self-coder1621 4 ปีที่แล้ว

      if not working download attribute check this out-th-cam.com/video/azssOhJsLEw/w-d-xo.html

  • @MaheshKumar-ds3cu
    @MaheshKumar-ds3cu 6 ปีที่แล้ว

    Fantastic bro Nice information 👌✌️

  • @abhimanyudoifode3704
    @abhimanyudoifode3704 7 ปีที่แล้ว

    thank .. i did it ..successfully

  • @umerzia9665
    @umerzia9665 7 ปีที่แล้ว

    bahi css3 software download krna hai

  • @davidbermudez7704
    @davidbermudez7704 6 ปีที่แล้ว +1

    Okay I’m creating a website to sell books and will either be PDF or EBook.
    Will the same function work if I replace .png or .mp3 with PDF and EBook?
    Thanks awesome tutorial I enjoyed it!

  • @akhilkumarsingh5041
    @akhilkumarsingh5041 4 ปีที่แล้ว

    this will work if i host my website????????

    • @self-coder1621
      @self-coder1621 4 ปีที่แล้ว

      if not working download attribute check this out-th-cam.com/video/azssOhJsLEw/w-d-xo.html
      yes

  • @lovekush9103
    @lovekush9103 5 ปีที่แล้ว

    Can you make a software with Dll files

  • @vinayn9110
    @vinayn9110 7 ปีที่แล้ว

    can you use it to download a folder with files inside?

    • @topvisualkitten4338
      @topvisualkitten4338 4 ปีที่แล้ว

      yes, but zipo recommended cuz it downloads faster

  • @AmnaTahir-h4h
    @AmnaTahir-h4h 8 หลายเดือนก่อน

    THANK YOU SO MUCH!!! SO SO HELPFUL!!! LIFE SAVER

  • @S-Lomar
    @S-Lomar ปีที่แล้ว

    💕💕💕💓💓💕💕💕💕💕💕

  • @user-bb1vl9tc9d
    @user-bb1vl9tc9d 2 ปีที่แล้ว

    I have a question. I do link a certain pdf file in Google Drive. So, how to ensure that when I press the download button, it will automatically download the pdf without pop-up the file in Google Drive?

  • @David-th5nx
    @David-th5nx 2 ปีที่แล้ว

    Awesome. I just couldn't get it to download on Chrome, Firefox and Edge

  • @dagimzeru8597
    @dagimzeru8597 2 ปีที่แล้ว

    very interesting thank you

  • @harshinisg2832
    @harshinisg2832 2 ปีที่แล้ว

    Hi could you please tell me how to download mp4 file , I tried same way its opening in new browser , I need to download locally ,Do you have any solution for this kind?

  • @feelingboo6216
    @feelingboo6216 3 ปีที่แล้ว +1

    Please help😪😪😪😭😭

  • @feelingboo6216
    @feelingboo6216 3 ปีที่แล้ว +1

    Mine its playing the music not downloading why ?

  • @kapilsharma6597
    @kapilsharma6597 3 ปีที่แล้ว

    My download attribute is not working

  • @seo-insights
    @seo-insights 3 ปีที่แล้ว

    Thank you so much for this tutorial

  • @BirajShrestha123
    @BirajShrestha123 3 ปีที่แล้ว

    thanks

  • @adityawaghmare4784
    @adityawaghmare4784 3 ปีที่แล้ว

    It says file couldnt be accessed plz help

  • @kumardharmendra9423
    @kumardharmendra9423 3 ปีที่แล้ว +1

    Thanks a lot! This helped me a lot! You got a new subscriber!

  • @mr.himalayan6258
    @mr.himalayan6258 3 ปีที่แล้ว

    No working in mobile

  • @shoryagupta7097
    @shoryagupta7097 3 ปีที่แล้ว

    Bro awesome . It's great . Love from 2021

  • @vigneshkumar4546
    @vigneshkumar4546 3 ปีที่แล้ว

    Bro for me its not woeking.

  • @padasalgi
    @padasalgi 3 ปีที่แล้ว

    It is not working it only displays an image. Please advise. Thanks

  • @hypersurfer_
    @hypersurfer_ 3 ปีที่แล้ว

    Dude It wont Download

  • @arkaprava9973
    @arkaprava9973 3 ปีที่แล้ว

    why is it saying file not found for me because my image is still in the computer

    • @smashtheshell
      @smashtheshell  3 ปีที่แล้ว

      Sorry for late response... connect with me on twitter/fb for the help if you're still having issues with it. 😊

  • @1-minutesanimation853
    @1-minutesanimation853 3 ปีที่แล้ว

    this is not working on in google 88.0.4324.150

    • @AryanPadarthi
      @AryanPadarthi 3 ปีที่แล้ว

      I think you should use repl. Then open the code into a new tab.

  • @helayounsi7136
    @helayounsi7136 3 ปีที่แล้ว +1

    Thank you this helped me

  • @brainwavenp5354
    @brainwavenp5354 4 ปีที่แล้ว +1

    nice video

  • @muhammadhassankhan6164
    @muhammadhassankhan6164 4 ปีที่แล้ว

    Thanksyou

  • @sandeelacerna7292
    @sandeelacerna7292 4 ปีที่แล้ว

    does it works even if my files are on google drive and i will paste the link to download?

  • @vxcaie
    @vxcaie 4 ปีที่แล้ว

    when am pressing the button its open a page but its the code from my file (Noob OS.vbs)

    • @otiopo7459
      @otiopo7459 4 ปีที่แล้ว

      its FAKE
      my file said its not found

  • @aeditonx1
    @aeditonx1 4 ปีที่แล้ว +1

    Nice Thnx Bro

  • @topvisualkitten4338
    @topvisualkitten4338 4 ปีที่แล้ว +1

    So if i upload the .ZIP file next to the .HTML file in a server that's named .htdocs, will it work?

    • @smashtheshell
      @smashtheshell  4 ปีที่แล้ว

      Most probably it should! I haven't tried doing that though. 🙂

  • @FunnyBusiness33
    @FunnyBusiness33 4 ปีที่แล้ว +1

    amazing bro

    • @smashtheshell
      @smashtheshell  4 ปีที่แล้ว

      Thanks! Please consider subscribing to the channel for getting more contents. 😊

  • @a.beloucif1348
    @a.beloucif1348 4 ปีที่แล้ว

    does it work on zip files?
    because i want to make a downloadable zip file

  • @A2Dfarm
    @A2Dfarm 4 ปีที่แล้ว

    i can't it is just play the video not downloading can you proof it with without local url like " -------------------------------" please.

  • @mrigkrafts4859
    @mrigkrafts4859 4 ปีที่แล้ว

    Hey can you just answer why my file when start to download says that the file was not found and the download failed. Can you list some reasons this can happen??

    • @angellyclouds4520
      @angellyclouds4520 4 ปีที่แล้ว

      Did u put the file in the folder of the page?

    • @mrigkrafts4859
      @mrigkrafts4859 4 ปีที่แล้ว

      @@angellyclouds4520 Yup, but now it works
      I did some things and now it does work

  • @parvapatel6013
    @parvapatel6013 4 ปีที่แล้ว +2

    Who had been unlinked, remove it😡 from unlike and like👍 this video

  • @ayhemgamerdz1476
    @ayhemgamerdz1476 4 ปีที่แล้ว

    Thank u so much bro

  • @blast9335
    @blast9335 4 ปีที่แล้ว

    what about folder

  • @ShaikhZahid
    @ShaikhZahid 4 ปีที่แล้ว +1

    Thankyou for sharing this information .

  • @DForre6040
    @DForre6040 4 ปีที่แล้ว

    Why doesn't it work on Chrome?

  • @Nirob
    @Nirob 4 ปีที่แล้ว

    Not working

  • @user-co7jf8hs7j
    @user-co7jf8hs7j 4 ปีที่แล้ว +1

    It's not working 😡😡😭

  • @spagetti2514
    @spagetti2514 4 ปีที่แล้ว

    how am i able to code to be able to download audio files ?

  • @devikakrishna4464
    @devikakrishna4464 4 ปีที่แล้ว +1

    I think you should start using vscode
    or visual studio
    those are the best ides

    • @smashtheshell
      @smashtheshell  4 ปีที่แล้ว

      Thanks! Your suggestions are highly appreciated. I am already using Vscode nowadays. It's fantastic ☺️.

  • @tellusmore5162
    @tellusmore5162 4 ปีที่แล้ว

    Is there a way to make it only to download one time?

  • @tellusmore5162
    @tellusmore5162 4 ปีที่แล้ว

    need a timer to be add

  • @jmus2894
    @jmus2894 4 ปีที่แล้ว

    Note: This method does not work on Linux Mint.

    • @jmus2894
      @jmus2894 4 ปีที่แล้ว

      @@redst5ne No, it's just a name.

  • @samratpatra3143
    @samratpatra3143 4 ปีที่แล้ว

    audio start playing but not downloading

  • @universenerdd
    @universenerdd 4 ปีที่แล้ว

    sorry bro, this is not downloading, downloading is a server uploads a file, the client receives it, so if you were downloading C:/users/example/downloads should have a file called logo.png or something

  • @universenerdd
    @universenerdd 4 ปีที่แล้ว +2

    you could make it in pure html, it is called the tag

  • @captain_steve104
    @captain_steve104 4 ปีที่แล้ว

    YEET!!!!

  • @flyxuz7074
    @flyxuz7074 4 ปีที่แล้ว

    Thank you!

  • @ivansavchenco5636
    @ivansavchenco5636 4 ปีที่แล้ว

    This still doesn't work in my case. Any suggestions? Code exactly the same.

    • @smashtheshell
      @smashtheshell  4 ปีที่แล้ว

      Which browser you are using?

    • @ivansavchenco5636
      @ivansavchenco5636 4 ปีที่แล้ว +1

      @@smashtheshell Sorry my bad. It did not work locally but when I uploaded it on server it started to work.
      Sorry....

  • @yoseyus4141
    @yoseyus4141 4 ปีที่แล้ว +4

    thank u a lot! i finally found what i really wanted to do

  • @daniflows007
    @daniflows007 6 ปีที่แล้ว

    hi in explorer ???

  • @DrArindam
    @DrArindam 6 ปีที่แล้ว

    Sir, i am making a blog & i have the source file for movies in my desktop, now i want it to b downloadable by other.. So how to proceed?

    • @ShaikhZahid
      @ShaikhZahid 4 ปีที่แล้ว +1

      I think you need to upload your files on Google drive then add the link to download. I hope you got help from this.

  • @ziskador
    @ziskador 6 ปีที่แล้ว +11

    I can't make it work in google chrome

    • @srivignesh3826
      @srivignesh3826 6 ปีที่แล้ว

      Seba Contreras yeah me too...it just navigates to the image and music

    • @PixelHamster
      @PixelHamster 6 ปีที่แล้ว

      @@srivignesh3826 I have a feeling they removed this

    • @kruzezab6663
      @kruzezab6663 5 ปีที่แล้ว

      It's still working for me. Make sure the file you are trying to download is actually saved on your computer.

  • @damianfallon
    @damianfallon 7 ปีที่แล้ว

    Nice Video, but when I try it on my website it just keeps saying network error, do you have any advice. Thanks

  • @shilpakharat4746
    @shilpakharat4746 4 ปีที่แล้ว

    this helped a lot

  • @gbemisolaagboola8255
    @gbemisolaagboola8255 6 ปีที่แล้ว +1

    i cant make this work on chrome,any suggestions please

    • @self-coder1621
      @self-coder1621 4 ปีที่แล้ว

      if not working download attribute check this out-th-cam.com/video/azssOhJsLEw/w-d-xo.html

  • @onyekachidaniel9387
    @onyekachidaniel9387 6 ปีที่แล้ว

    thank you so much dear, your tutorial is great

    • @smashtheshell
      @smashtheshell  6 ปีที่แล้ว

      I really appreciate you liked the video. Thank you. 🙂

  • @subodhsingh2226
    @subodhsingh2226 6 ปีที่แล้ว

    I am sure that you will upload this types video thank you

    • @smashtheshell
      @smashtheshell  6 ปีที่แล้ว

      Hi Subodh, Thank you for watching the video. I have been really busy and I am pretty sure I will start uploading more and more videos soon.

  • @oaeskuruni313
    @oaeskuruni313 4 ปีที่แล้ว

    thanks a million

  • @robertreimann1846
    @robertreimann1846 6 ปีที่แล้ว +1

    Well it kind of works. But when I click the button, it downloads as "Failed - No file", even tho the file is in there

  • @masnsenboultif5229
    @masnsenboultif5229 5 ปีที่แล้ว +1

    What about apk file,how to do that

    • @lohithkumar6922
      @lohithkumar6922 5 ปีที่แล้ว

      i would suggest Zip it and allow the user to download the zip file

    • @masnsenboultif5229
      @masnsenboultif5229 5 ปีที่แล้ว

      @@lohithkumar6922 thank u

  • @rudraksha2177
    @rudraksha2177 5 ปีที่แล้ว +2

    Soo helpful

  • @judeedi
    @judeedi 7 ปีที่แล้ว +2

    Awesome.! Great. Thanks a lot.!

    • @smashtheshell
      @smashtheshell  7 ปีที่แล้ว

      Hi, it's a great pleasure! :) Thanks for watching this video.

  • @isaacattaampofosenior3081
    @isaacattaampofosenior3081 4 ปีที่แล้ว

    Thanks a lot but how can i apply it for PDF

  • @salmansallu6320
    @salmansallu6320 5 ปีที่แล้ว

    I am not getting to download in any browser .what was the problem behind .pls tell me the solution for that

    • @Design.Nation
      @Design.Nation 5 ปีที่แล้ว

      i've tried 4 diffrent videos for it , all show the same , did the same exact thing and still cant get the download link in browser .. either browser don't support it or the attr simply doesnt work :x

  • @vocelia
    @vocelia 5 ปีที่แล้ว

    I am trying this on python file but it's not working.

  • @svensselevics8467
    @svensselevics8467 4 ปีที่แล้ว

    Thanks bro appreaciate it

  • @semicolon-academy
    @semicolon-academy 5 ปีที่แล้ว

    thanks its work with me

  • @moneymakingmodules
    @moneymakingmodules 7 ปีที่แล้ว +7

    Thanks good info

    • @smashtheshell
      @smashtheshell  7 ปีที่แล้ว

      Hi, I am glad you found it useful! :)

  • @AshishKumar00
    @AshishKumar00 7 ปีที่แล้ว +2

    hello ..
    image do not download in case of Internet Explorer.

    • @smashtheshell
      @smashtheshell  7 ปีที่แล้ว

      Hi, Actually download attribute is not supported in any of internet explorer versions. Please refer this link to see the support for this attribute. caniuse.com/#feat=download

    • @AshishKumar00
      @AshishKumar00 7 ปีที่แล้ว

      ok..
      so, do you have any other way to download image in 'internet explorer'.
      i need it ..
      (any other plugins or like that)

    • @smashtheshell
      @smashtheshell  7 ปีที่แล้ว

      You might wanna check this stackoverflow discussion. stackoverflow.com/questions/18652750/any-fallback-client-side-solutions-for-the-html5-download-attribute
      Also you can try download.js, which is supported IE-9 and above. danml.com/download.html

    • @self-coder1621
      @self-coder1621 4 ปีที่แล้ว

      if not working download attribute check this out-th-cam.com/video/azssOhJsLEw/w-d-xo.html

  • @srijeetsaha6011
    @srijeetsaha6011 6 ปีที่แล้ว

    Hey,
    I have used the download attribute in the anchor tag, but still after clicking the link it does not downloads it, rather it open the file in the tab.
    I am using chrome.
    What can I do to fix it?
    Please help me.

    • @self-coder1621
      @self-coder1621 4 ปีที่แล้ว

      if not working download attribute check this out-th-cam.com/video/azssOhJsLEw/w-d-xo.html

  • @user-qh8qf4js2z
    @user-qh8qf4js2z 5 ปีที่แล้ว

    Can u give the code? With css

  • @luisbetancourt3837
    @luisbetancourt3837 6 ปีที่แล้ว

    At 2:52 Is where he shows you how to make it downloadable. Get right to the point next time.