# Customize "Load More" button

**URL:** https://community.elfsight.com/t/customize-load-more-button/112317
**Category:** Customization
**Tags:** event-calendar
**Created:** [April 8, 2025, 4:43pm UTC](https://community.elfsight.com/t/customize-load-more-button/112317 "2025-04-08T16:43:19Z")
**Posts on this page:** 7
**Page:** 1

<div class="post-metadata">

### Author: ![Encounter](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/encounter/32/25810_2.png) [@Encounter](https://community.elfsight.com/u/Encounter)
#### Post date: [April 8, 2025, 4:43pm UTC](https://community.elfsight.com/t/customize-load-more-button/112317/1 "2025-04-08T16:43:19Z")

</div>

The light gray on lighter gray “load more” button on the list view is barely noticeable. Can you make it more bold or offer the ability to customize it?

---

<div class="post-metadata">

### Author: ![Sina](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/sina/32/59970_2.png) [@Sina](https://community.elfsight.com/u/Sina)
#### Post date: [April 8, 2025, 6:54pm UTC](https://community.elfsight.com/t/customize-load-more-button/112317/2 "2025-04-08T18:54:38Z")

</div>

Hi @Encounter

Add the code below to the Custom CSS field on the Style tab of your [Event Calendar](https://elfsight.com/event-calendar-widget/) widget’s settings:

```auto
.eapp-events-calendar-load-more-button-component {
    color: #000 !important;
    background: #eee !important;
    border: 2px solid #000 !important;
    font-weight: bold !important;
}

```

---

<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: [April 9, 2025, 6:46pm UTC](https://community.elfsight.com/t/customize-load-more-button/112317/4 "2025-04-09T18:46:38Z")

</div>

Hi there, @Encounter 👋

Sina suggested a great solution! Please try to use it in your widget and let us know if it helped 🙂

---

<div class="post-metadata">

### Author: ![Jeroen\_Jonkman](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/jeroen_jonkman/32/46243_2.png) [@Jeroen\_Jonkman](https://community.elfsight.com/u/Jeroen_Jonkman)
#### Post date: [June 25, 2025, 8:36am UTC](https://community.elfsight.com/t/customize-load-more-button/112317/5 "2025-06-25T08:36:35Z")

</div>

Hi, My load more button does not show at all. I tried the custom CSS Sina suggested but still nothing. I am using the masonry lay out. Can you point me in the right direction?  
[https://test.educationfair.net/events-calendar/](https://test.educationfair.net/events-calendar/)

Tnx Jeroen

---

<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: [June 25, 2025, 8:54am UTC](https://community.elfsight.com/t/customize-load-more-button/112317/6 "2025-06-25T08:54:21Z")

</div>

Hi there, @Jeroen_Jonkman 👋

At the moment, the Load More button is available only for the List layout, but we’re currently working on its implementation to other layouts as well.

Please upvote this idea to receive a notification once the feature is released 🙂 - [Load More Events button in all layouts](https://community.elfsight.com/t/load-more-events-button-in-all-layouts/6445/)

---

<div class="post-metadata">

### Author: ![Jeroen\_Jonkman](https://sea2.discourse-cdn.com/flex020/user_avatar/community.elfsight.com/jeroen_jonkman/32/46243_2.png) [@Jeroen\_Jonkman](https://community.elfsight.com/u/Jeroen_Jonkman)
#### Post date: [June 25, 2025, 8:59am UTC](https://community.elfsight.com/t/customize-load-more-button/112317/7 "2025-06-25T08:59:32Z")

</div>

Tnx Max. Too bad. This surely gets my vote.

I have 100+ events. What does this do with load time when I show them all?

---

<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: [June 25, 2025, 9:11am UTC](https://community.elfsight.com/t/customize-load-more-button/112317/8 "2025-06-25T09:11:25Z")

</div>

This shouldn’t significantly affect the loading speed.

It’s hard to share the ETA for this feature, but since it is in the Development stage already, we’re hopeful it will be released in the near future.

We’ll keep you posted on any progress in the Wishlist thread 🙂
