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.

[@adrianramirezl.4388]

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

[@airfryersforhomeuse9524]

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

[@sktechnology522]

Your teaching style is very easy. Thanks, Josh!

[@dashingbooks3436]

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

[@brookeb9697]

Worked so good! Thank you!

[@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?

[@bearhawk7497]

This is extremely helpful! Thanks for making this video!

[@DannyIrvinephotography]

Fantastic, worked first time.

[@brentstutzman]

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

[@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.

[@crispinosantamaria5501]

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

[@janfm8670]

Great Input. Downloaded IT Directly 😉

[@VeganSmythe]

Thanks Josh, your videos really are quite awesome!

[@tomvaichus5541]

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

[@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?

[@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)

[@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.

[@lucierychetska2648]

Great, thanks 👏

[@publikanguro.tecno.marketing]

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

[@connectionearth]

Amazing thanks!!!✌

[@MartinKleine]

Thanks for that toutorial

[@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..

[@worksprings9399]

Thank you. Very helpful video.

[@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!

[@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?

[@samfabio]

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

[@JoelElangovan]

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

[@fifthdaniel6413]

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

[@marnie.aramruck7441]

Thank you so much!

[@perfecto1701]

Thanks mate, pretty good.

[@ChGoertz]

Many thx- very helpfull

[@adrianramirezl.4388]

Hola. Muchas gracias!

[@Drop-jb5td]

so for the file ?

[@aniketjoshi7518]

really easy peasy

[@brucefoh]

did not work for me.

[@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

[@studio47designer61]

Merci

[@MoLtenMetaL7]

Didn't work for vCard

[@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.

[@25thming44]

*mâchine*