In this blog, we will see how to use Add to calendar link in Salesforce Marketing cloud email which will download an iCal or ICS file with all the information filled in dynamically using Ampscript and JavaScript.
We will achieve this using Cloud page. When customer clicks on the add to calendar link in the email then ICS file will automatically get downloaded.
You can use this concept not only to download ICS file but also txt, html and other files as well!
We will be using ICS file version 2.0. You can find a nice overview of ICS file format over here.
Below is the code which you can add it to the landing page:
If you are just confused about what properties you want to define in ICS file then you can find the complete properties here. You can use the same cloud page for different events as well by passing parameters in the cloud pages.
Now you can see using little snipped of JavaScript & ampscript we can make dynamic ICS file. Below is the GIF on how it works:
Please feel free to let me know if you find this article useful and leave your feedback/comment in case of any queries.
Happy Learning!
Hi everyone,
Code works on mobile but not on desktop. I used the recommendation below "data:text/plain" attribute to "data:text/calendar".
I think it has something to do with this portion but can't point my finger on it. Can someone please help?
Thanks!
function download(filename, text) {var element = document.createElement('a');element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text));element.setAttribute('download', filename);
Hi, This isnt working in Android phones. But works in iPhone. data:text/plain" attribute to "data:text/calendar" is added too. Could someone help on this pls to make it work on the Android phones?
Hey, thanks for this!
One small bug I noticed: The file downloads as ics.txt on mobile (Safari). This can be fixed by changing the "data:text/plain" attribute to "data:text/calendar".
Thank u.. Could u please provide explanation too for the above code?
What is SET @PRODID_txt = "-//SalesforceFan//EN"?
Thank you for this! I've tried to do this in our instance and it works great for desktop but not for iOS mobile (haven't tried in Android). What happens is after downloading the file, it cannot be saved in your Calendar or there's no option to say the least. Or perhaps, I'm missing something here. Hope to hear from you guys! Thanks!