Timeline: How to display marker numbers in reversed order

By default, numbered markers in the Timeline app go from 1 to 5 from left to right.

But sometimes the opposite order makes more sense — for example, if your timeline is showing a countdown, a ranking, or a sequence that leads toward the final step.

If you want the markers to appear as 5, 4, 3, 2, 1, you can do it with a small Custom JS tweak.

Add this code to the Custom JS field on the Settings tab of your widget:

util.waitForAllElements('.es-marker-point').then((markers) => {
  [...markers].forEach((marker, index) => {
    marker.textContent = markers.length - index;
  });
});

Note: Custom JS doesn’t function in the preview mode, so you can check the result right on your website or through the Share Link


Default display:


After adding a script:


That’s it — the script automatically reverses the numbering based on the number of events in your timeline. So if you add or remove events later, you won’t need to update the code manually :sparkles:

Was this solution helpful? Let us know in the comments :wink:

2 Likes