# Add a clickable button from Google Calendar

**URL:** <https://community.elfsight.com/t/add-a-clickable-button-from-google-calendar/141075>\
**Category:** Customization\
**Created:** [November 1, 2025, 6:41pm UTC](https://community.elfsight.com/t/add-a-clickable-button-from-google-calendar/141075 "2025-11-01T18:41:42Z")\
**Posts on this page:** 1\
**Showing post:** 3

<div class="post-metadata">

**Author:** ![Max](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/max/32/710_2.png) [@Max](https://community.elfsight.com/u/Max)\
**Post date:** [November 2, 2025, 9:02am UTC](https://community.elfsight.com/t/add-a-clickable-button-from-google-calendar/141075/3 "2025-11-02T09:02:06Z")

</div>

Greetings and welcome to the Community, @Atelier_des_Bricoleu 👋

You’re referring to the Event Calendar widget, right? If so, currently it’s impossible to import the button to events from the Google Calendar, but this idea is already on the Wishlist. Feel free to upvote here - [Add button for EC connected to Google Calendar](https://community.elfsight.com/t/add-button-for-ec-connected-to-google-calendar/81026).

However, there is one workaround. You can add a clickable text for the button in the event description in your Google Calendar:

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/3/4/34c643afdcf347e96f1b587dfe37f9a9bcb4e20c.png)

  

After that, please check \*\* Description\*\* in the **Event Elements** section on the **Layout** tab:

 ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/1/0/10d24088a43d2ea26508b6bb09e1efbd2a74cdbc.png) ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/9/3/9309d124e8517824e8839a02f314b99dc3a441e4.png)

  

Finally, paste this code to the **Custom CSS** field on the **Style** tab of your widget’s settings:

```auto
.global-styles, a {
display: inline-block;
font-size: 12px;
font-weight: bold;
color: white;
background-color: purple;
padding: 10px 20px;
border: 0px solid purple;
border-radius: 20px;
text-align: center;
text-decoration: none;
cursor: pointer;
text-wrap: auto;
overflow-wrap: anywhere;
}

.global-styles,
a:hover,
a:focus {
color: white !important;
}

```

  

This solution isn’t perfect (especially for long descriptions) and the code might need some adjustment, since it can work differently depending on the website. However, this is the only option for now.

Give it a try and let me know if it worked for you 🙂

---

_[View the full topic](https://community.elfsight.com/t/add-a-clickable-button-from-google-calendar/141075)._