# Change button and text color in Event Calendar **URL:** \ **Category:** Customization\ **Tags:** event-calendar\ **Created:** [June 17, 2026, 4:30pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285 "2026-06-17T16:30:24Z")\ **Posts on this page:** 10\ **Page:** 1
**Author:** ![swiss\_Moser](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/swiss_moser/32/100497_2.png) [@swiss\_Moser](https://community.elfsight.com/u/swiss_Moser)\ **Post date:** [June 17, 2026, 4:30pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/1 "2026-06-17T16:30:24Z")
Hi Max, I’m new here, but I’m getting an error message: Line 1: Expected a JSON value. Line 1: Expected ‘]’ and instead saw ‘class’. Line 1: Unrecoverable syntax error. (25% scanned). What can I do? Greetings Benno ---
**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:** [June 17, 2026, 4:35pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/2 "2026-06-17T16:35:51Z")
Hi there and welcome to the Community, @swiss_Moser 👋 It seems that you’ve added the code snippet to the **Custom JS** field. This code should be added to the **Custom CSS** field on the **Appearance** tab of your widget’s settings: ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/3/5/35413c8a94c3a8c0b733f94f28ca495b91360ad9.png) Please try it out once again and let me know if it worked 😉 ---
**Author:** ![swiss\_Moser](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/swiss_moser/32/100497_2.png) [@swiss\_Moser](https://community.elfsight.com/u/swiss_Moser)\ **Post date:** [June 17, 2026, 4:43pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/3 "2026-06-17T16:43:02Z")
I’ve added this—what else do I need to do? And can I also enter the color as the code #BA9C5E? ![Screenshot 2026-06-17 184126](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/8/1/81fb8c640bff62e9f9e051f5137013c78d3f8306.png) ---
**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:** [June 17, 2026, 4:51pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/4 "2026-06-17T16:51:57Z")
The code mentioned in this topic is for our Forms widget. I see that you’re using the Event Calendar widget and a different CSS code. Do I get it right that you’re trying to change a color of the event button text? ---
**Author:** ![swiss\_Moser](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/swiss_moser/32/100497_2.png) [@swiss\_Moser](https://community.elfsight.com/u/swiss_Moser)\ **Post date:** [June 17, 2026, 4:54pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/5 "2026-06-17T16:54:00Z")
I’d like to change the button and the text color, yes ---
**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:** [June 17, 2026, 4:59pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/7 "2026-06-17T16:59:03Z")
You can change the button color in the **Event** section on the **Style** tab: ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/6/8/68b5ed99331c8d6b29d7afeb76101b642d813c9f.png) ![image](https://us1.discourse-cdn.com/flex020/uploads/elfsight/original/3X/c/6/c63569725e3059e4f2871c0505980525648e3fc0.png) To change a button text color, please use the CSS code below 🙂 ```auto .es-button-base-ellipsis { color: black; } ``` ---
**Author:** ![swiss\_Moser](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/swiss_moser/32/100497_2.png) [@swiss\_Moser](https://community.elfsight.com/u/swiss_Moser)\ **Post date:** [June 17, 2026, 5:18pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/8 "2026-06-17T17:18:41Z")
Ah, it’s all right in front of me—I just have to find it. Thank you so much. ---
**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:** [June 17, 2026, 5:20pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/9 "2026-06-17T17:20:46Z")
You’re very welcome 😉 In the meantime, we’d like to invite you to join our Birthday Contest, where you could win **6 FREE Months** for your subscription. Check the details and join in: [Birthday Contest: 10 Winners, 5 Free Years with Elfsight! 🎁](https://community.elfsight.com/t/birthday-contest-10-winners-5-free-years-with-elfsight/161985) ---
**Author:** ![swiss\_Moser](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/swiss_moser/32/100497_2.png) [@swiss\_Moser](https://community.elfsight.com/u/swiss_Moser)\ **Post date:** [June 17, 2026, 5:44pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/10 "2026-06-17T17:44:47Z")
I’ll take a look at that. Thanks. One last question: How do I upload my page to the website? Where can I find the HTML code for my calendar? ---
**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:** [June 17, 2026, 5:50pm UTC](https://community.elfsight.com/t/change-button-and-text-color-in-event-calendar/164285/11 "2026-06-17T17:50:16Z")
Sure, this article explains where you can find the widget’s installation code - [Where to get Elfsight widget installation code - Elfsight Help Center](https://help.elfsight.com/article/1167-where-to-get-elfsight-widget-installation-code-new-dashboard)