How do I create a link to add an entry to a calendar

Question

I m working for this nightclub and are currently making a website for them  they ve got lots events and their site is built a lot around events  today they make an facebook event of every event but it would be killer to have a  Add to my Calendar  button which added it to your iCal or Google Calendar  or maybe even Outlook    I ve managed to figure out how to make an calendar feed but then it will be added as a new calendar  only good thing is that people can  subscribe to events  but it s quite messy to have an calendar for every event  So I would like to know how to implement a function which lets them add it to their main calendar easily  Think like a mailto  link but for calendars if that s possible   Also while I m on the subject  does anyone know if it s possible to automatically import an event from Facebook to WordPress or export an event from WordPress to Facebook that would be great  but that s not so important

User · Answer

The links in Dave s post are great   Just to put a few technical details about the google links into an answer here on SO   Google Calendar Link   lt a href  http   www google com calendar event action TEMPLATE amp text Example 20Event amp dates 20131124T010000Z 20131124T020000Z amp details Event 20Details 20Here amp location 123 20Main 20St 2C 20Example 2C 20NY  gt Add to gCal lt  a gt   the parameters being    action TEMPLATE   required  text   url encoded name of the event  dates   ISO date format  startdate enddate - must have both start and end time - the button generator will let you leave the endtime blank  but you must have one or it won t work     to use the user s timezone  20131208T160000 20131208T180000  to use global time  convert to UTC  then use 20131208T160000Z 20131208T180000Z all day events  you can use 20131208 20131209 - note that the button generator gets it wrong   You must use the following date as the end date for a one day all day event  or  1 day to whatever you want the end date to be   details   url encoded event description details  location   url encoded location of the event - make sure it s an address google maps can read easily      Update Feb 2018   Here s a new link structure that seems to support the new google version of google calendar w o requiring API interaction   https   calendar google com calendar r eventedit text My Custom Event amp dates 20180512T230000Z 20180513T030000Z amp details For details  link here  https   example com tickets-43251101208 amp location Garage Boston - 20 Linden Street - Allston  MA 02134  New base url  https   calendar google com calendar r eventedit  New parameters    text   name of the event  dates  ISO date format  startdate enddate - must have both start and end time    an event w  start end times  20131208T160000 20131208T180000  all day events  you can use 20131208 20131209 - end date must be  1 day to whatever you want the end date to be   ctz   timezone such as America New York - leave blank to use the user s default timezone  Highly recommended to include this in almost all situations  For example  a reminder for a video conference  if three people in different timezones clicked this link and set a reminder for their  own  Tuesday at 10 00am  this would not work out well   details   url encoded event description details  location   url encoded location of the event - make sure it s an address google maps can read easily  add    comma separated list of emails - adds guests to your new event    Notes    the old url structure above now redirects here supports https deals w  timezones better accepts   for space in addition to  20  urlencode vs rawurlencode in php - both work

User · Answer

You can have the program create an  ics  iCal  version of the calendar and then you can import this  ics into whichever calendar program you d like  Google  Outlook  etc   I know this post is quite old  so I won t bother inputting any code   But please comment on this if you d like me to provide an outline of how to do this

User · Answer

To add to squarecandy s google calendar contribution  here the brand new OUTLOOK CALENDAR format  Without a need to create  ics      lt a href  quot https   bay02 calendar live com calendar calendar aspx rru addevent amp dtstart 20151119T140000Z amp dtend 20151119T160000Z amp summary Summary of the event amp location Location of the event amp description example text  amp allday false amp uid  quot  gt add to Outlook calendar lt  a gt   test it Best would be to url encode the summary  location and description variable s values  For the sake of knowledge  YAHOO CALENDAR format  lt a href  quot https   calendar yahoo com  v 60 amp view d amp type 20 amp title Summary of the event amp st 20151119T090000 amp et 20151119T110000 amp desc example text  0A 0AThis is the text entered in the event description field  amp in loc Location of the event amp uid  quot  gt add to Yahoo calendar lt  a gt   test it Doing it without a third party holds a lot of advantages for example using it in emails

User · Answer

Here s an Add to Calendar service to serve the purpose for adding an event on   Apple Calendar Google Calendar Outlook Outlook Online Yahoo  Calendar      The  Add to Calendar  button for events on websites and calendars is easy to install  language independent  time zone and DST compatible  It works perfectly in all modern browsers  tablets and mobile devices  and with Apple Calendar  Google Calendar  Outlook  Outlook com and Yahoo Calendar     lt div title  Add to Calendar  class  addeventatc  gt      Add to Calendar      lt span class  start  gt 03 01 2018 08 00 AM lt  span gt       lt span class  end  gt 03 01 2018 10 00 AM lt  span gt       lt span class  timezone  gt America Los Angeles lt  span gt       lt span class  title  gt Summary of the event lt  span gt       lt span class  description  gt Description of the event lt  span gt       lt span class  location  gt Location of the event lt  span gt   lt  div gt

User · Answer

UPDATE  free for personal use   HTTPS IS NOW SUPPORTED  While my answer below detailing how-to for each service WILL work  IMO it s much easier now to go with a third-party like AddThisEvent  https   addthisevent com    It lets you customize lots of options as well as add to Facebook and more   Unfortunately  they ve now made it a paid service for anything other than personal use and do enforce this   I assume there are other third-party solutions like this one  but I can only speak to this one  and it has worked great for us so far     For an  Add to my Google Calendar   they used to have a code generator form you could use  but have since taken it down   For more details on Google Calendar links  see squarecandy s answer below   For Outlook  it s a BIT more complicated  but basically you need to create a  vcs file with the event s data  and just make a link to that file   Step-by-step instructions here   For an iCal link  you could use a PHP class like this one  or follow this page s instructions on how to create an ics file  iCal file

[html] How do I create a link to add an entry to a calendar?

Update Feb 2018:

Examples related to html

Examples related to calendar

Examples related to google-calendar-api

Examples related to icalendar