DEV Community

Arsh Sharma
Arsh Sharma

Posted on • Edited on

Creating an Add Event to Google Calendar Link for Your Project

What are Add Event to Google Calendar Links?

With the pandemic not seeming to go there are more conferences day by day. This has led to many apps and websites scheduling events on the user's google calendar so that the user gets a timely reminder for events/meets. Today I'm going to show you how you too can add this functionality to your web or mobile app very easily. By the end of this article, you'll be able to generate a link which then you can provide directly to your users or embed nicely in a button or image on your app. So let's get started.

The Process

The process is fairly simple. Google Calendar provides this base URL:
https://calendar.google.com/calendar/r/eventedit
We can modify this string by adding parameters as per our needs. These are the following parameters we can add:

Event Name

The first parameter we can specify is the name of the event. This is mentioned using the text parameter. For the sake of this example let's have the event name to be Hello World Meet.

Date and Time

Providing a starting and ending date and time is mandatory. This must be provided in the ISO format. So if the starting time is 5 pm on 17th October 2020 and the ending time is 11 am on 18th October 2020 your starting and ending ISO strings would be 20201017T1700 and 20201018T1100respectively. In case you haven't noticed the pattern it is:
Year_Month_Date_T_TimeIn24HourFormat without the _

Event Details

You can also choose to provide some extra information about the event in the Details section. For the sake of this example let the event details be: The meet is going to be about programming. This is optional though.

Event Location

Another optional parameter is the location of the event. Let's take this to be Hierarch Square, Novigrad.

With this, we're all set. The link that will create a Google Calendar event with all these properties is:
https://calendar.google.com/calendar/r/eventedit?text=Hello+World+Meet&dates=20201017T1700/20201018T1100&details=The+meet+is+going+to+be+about+programming.&location=Hierarch+Square,+Novigrad

Just in case you've not spotted the pattern here it is:

https://calendar.google.com/calendar/r/eventedit?text={event name}&dates={start and end date and time in iso format}&details={event details}&location={event location}

where you can replace the stuff in { } with the values you desire.

Where did I learn to do this?
Kloudless Monday Mentorship

Thanks for reading :)

Top comments (4)

Collapse
 
maureento8888 profile image
Maureen T'O

Interesting way of implementing the Google Calendar! Perhaps I'll use this in my next projects 😄

Collapse
 
rinkiyakedad profile image
Arsh Sharma

Glad you found it useful! :D

Collapse
 
koas profile image
Koas

Thanks for the article! Is there a similar way to edit / delete an existing event?

Collapse
 
sajeevan profile image
Sajeevan

Great article..