How to change the order of events? (example: December first followed by November etc.)

Ask the Community Customization
1

how to change the order of events? (example: December first followed by November etc.)

1 Like
2

Hi there, @Sandrine_Beaud :wave:

Do you want to just swap the months while keeping the events in the same order for those months? For example, show December events first, but starting from the nearest to the latest December 5, December 13, etc)?

Or would you like to apply a general reverse order? So, the events should be displayed starting from the latest to the nearest ( Dec 17 - Nov 25).

3

Hi thanks for your response, I would like to apply a general reverse order :
1 - December
12 December
5 December

2- November
20 November
5 November
Etc :grin:

Sandrine

1 Like
4

Thank you!

This code should do the trick:

/* to reverse the order of events */
.eapp-events-calendar-list-component,
.eapp-events-calendar-list-events {
  flex-direction: column-reverse;
}

.eapp-events-calendar-list-item:first-child {
  margin-bottom: 0;
}

.eapp-events-calendar-list-item:last-child {
  margin-bottom: 30px;
}

.eapp-events-calendar-list-item-component:first-child {
  margin: 10px 0 0;
}

.eapp-events-calendar-list-item-component:last-child {
  margin: 0 0 10px;
}

Just add it to the Custom CSS field on the Appearance tab of your widget’s settings and let me know if it helped :slightly_smiling_face:

5

Hi Max. In the event calendar with events grouped by day, the code above doesn’t seem to change what i’m seeing or work for my need. How do you reverse the daily order so the event order per day is last to first? For example, putting the 6PM event would be first, and a 1PM would be last in this example. Yet, the different day dates would remain sooner to later.

1 Like
6

Hi there, @user23125 and welcome to the Community :wave:

I’ve checked the code with your widget and everything is working fine now:

image
image1832×772 106 KB


Could you please double-check it?