How to Create a Direct Download Button in Divi

[@jakobus6504]

Wow i am so impressed!!! i never saw a tutorial in that quality! i had no idear how to do this! Thank you!!

[@tracytrathen3162]

I was looking for this! Have a certain post type using ACF and for the link - since I didn't use a button, I had to figure out how the link selector was nested... so I had to do a nesting solution with the jQuery (i.e. jQuery('div#my-id > div > div > h5 > a'), and it finally put the "download" attribute on the a! Very nice solution to fix something I need to wrap up for a client today!!! Will make it easy to do for her too, when she uploads new audio samples!

[@lewisdesignplus]

Thanks for this solution Josh! Worked great.

[@airfryersforhomeuse9524]

I will be adding this to all of my sites. Thanks Josh

[@adrianramirezl.4388]

Hello again. I tried today the first method and it worked out perfectly. Great!

[@bearhawk7497]

This is extremely helpful! Thanks for making this video!

[@sktechnology522]

Your teaching style is very easy. Thanks, Josh!

[@dashingbooks3436]

Thank you Josh. You made it much easier than I thought it would be.

[@kalebschad8403]

Just tried this and have the same issue Brian Mercer has. I've cleared it all and started over and still not working. Any thoughts on what might have changed?

[@brookeb9697]

Worked so good! Thank you!

[@DannyIrvinephotography]

Fantastic, worked first time.

[@brentstutzman]

Worked like a charm! Thank you Josh! Grateful for these videos. 🙏

[@crispinosantamaria5501]

Thanks for the tutorial mate, please continue the good work!!

[@guteFILMEwelt]

In my case I had to target the tag. -> ".download-button a" jQuery(document).ready(function() { var downloadButtons = jQuery('.download-button a'); downloadButtons.each(function(index) { jQuery(this).attr('download', ''); }); });

[@entresuite1973]

Thanks... this resolved my issue also. The tutorial worked fine for me with inline text. But my buttons are contained within 'Call To Action modules, not just button modules. Now I added the 'a' it's all working great. Cheers.

[@jojololo301]

Hei i have an problem, how can i ad this class to, for example, an text-module? It works fine with the button-module and normal text. But when adding it to an other module the image still opens in another tab and does not download directly..

[@VeganSmythe]

Thanks Josh, your videos really are quite awesome!

[@janfm8670]

Great Input. Downloaded IT Directly 😉

[@carpetcleanertraining8020]

I have a question. I used the code however it functions without putting download-button in the class for the button. I'm not sure why. I was trying to make the button visible only when a menu tab is clicked so the class was also linked to the menu button. However, I couldn't get the button to show up when I put download-button in the class as well so I removed it and just left the class name for the menu. I checked to see if the button was now visible and it was. I clicked it and to my surprise, it downloaded without being labeled with the download-button class. Can you enlighten me as to what is going on?

[@tomvaichus5541]

Hi Josh, how do I add the CSS Class to a button that is part of a contact form?

[@publikanguro.tecno.marketing]

Thank you a lot Mr. Josh, it works great now and it all tanks to you!!!!!

[@melaniesaidmaizaabril7472]

Thank you so much your content is really usefull!!! LOVE IT

[@PaylessTravelBurwood]

Hi Josh, its a nice video. Code is not working, and please can you advise I need to allow a Doc file.

[@brianmercer6967]

I've tried this and it still open in a separate window. I upgraded to Divi 4.0. Has something changed, maybe?

[@tinajthesinger]

Same for me...

[@zabity]

the jquery function finds any html object with a class 'download-button' and gives it the attribute 'download' which allows the direct download. so: 1. check if your button has correct class, it could be anything as long as it's the same in both divi and the jquery code 2. it doesn't work in internet explorer (doesn't support the download attribute)

[@davidkuehne5291]

Isn't this code just adding an attribute of "download" to the link? Why not simply add this "download" attribute in the advanced tab of the module? Is it not less work? Am I confused?

[@connectionearth]

Amazing thanks!!!✌

[@JoelElangovan]

Works perfectly on desktop, but doesn't work on mobile (Android). What do u think the problem is ?

[@worksprings9399]

Thank you. Very helpful video.

[@lucierychetska2648]

Great, thanks 👏

[@samfabio]

HI Josh! How to add a (Print out) button on any page in divi or wordpress?

[@MartinKleine]

Thanks for that toutorial

[@fifthdaniel6413]

hello Josh, does this work for videos with KZbin URL?

[@tvstarks]

This is great, Josh. Thanks! You vids have been very helpful for my Divi biz. Wondering if you have a jQuery variable for printing a file directly from the button module? Am trying to print coupons from a site from Button module. Click button, launch print dialog box. Thanks!!!

[@toxizwastez]

Thanks alot for this!

[@marnie.aramruck7441]

Thank you so much!

[@brucefoh]

did not work for me.

[@perfecto1701]

Thanks mate, pretty good.

[@Drop-jb5td]

so for the file ?

[@ChGoertz]

Many thx- very helpfull

[@adrianramirezl.4388]

Hola. Muchas gracias!

[@amberlihartwellacting]

I did this on my site to (download a photo x3 ) and it worked great. Then I changed the photos and redid it and now it doesn't work. I have tried lots of times - could it be because new photos are png instead of jpegs? or is it because of the more recent changes to divi?

[@JoshHallco]

The filetype or any changes to Divi won't be an issue. Maybe the link to the file is wrong? Make sure the link is correct and the class is in there then you should be good to go.

[@amberlihartwellacting]

@@JoshHallco Thanks for your reply thats helpful - I have checked and rechecked spent about 2 hours on it tonight (I am not techy!) I think it will be something in the code somewhere.

[@JoshHallco]

@@amberlihartwellacting yeah in that case, I always recommend just starting from scratch and you'll usually be good to go!

[@amberlihartwellacting]

@@JoshHallco Hey thanks Josh - itching to ask you - you took out the .et what does that do? I had that in the old version - thanks heaps

[@JoshHallco]

@@amberlihartwellacting the class can actually be anything you want to call it. I just took it out for my reference but you can keep it in - doesn't matter!

[@katelyndawn3446]

Dang this works on Chrome but not on my other browsers

[@fullpreteristnow]

Isn't this code just adding an attribute of "download" to the link? Why not simply add this "download" attribute in the advanced tab of the module? Is it not less work? Am I confused? OK, just realized that I cannot add just any attribute in the attributes panel, but only those which Divi deems necessary. That's so lame-stupid in fact. They should have left an option to enter a custom attribute. Time to hack the model and add "download" as an option.

[@aniketjoshi7518]

really easy peasy

[@MoLtenMetaL7]

Didn't work for vCard

[@studio47designer61]

Merci

[@25thming44]

*mâchine*