Streaming live at 10am (PST)

Dynamic Collection List Item Numbers

Hi,

I would like to display a number for each item in a collection list. In the screenshot below, the item numbers would be on the left where the number 1 currently is.

Each time I update the list, I want the newest item to get assigned number 1 and the older item numbers to get incremented.

Can you please advise a convenient and simple way to do this (apart from switching to an ordered list)?


Here is my public share link. The issue is on the “Publications” page: https://preview.webflow.com/preview/omni-lab-webpage?utm_medium=preview_link&utm_source=dashboard&utm_content=omni-lab-webpage&preview=6adcf3223614bdd50a657fdb49c00a3f&mode=preview

Thanks in advance!

Something like this may work:

Or you could look into using jQuery to increment the string based on the number of child elements index - search on stackexchange, it’s your friend! :wink:

Hello :slight_smile:

Try this adding this snippet into the body tag (footer code)

<script>
$('.pubs_number').html(function(i) {
  return 1 + i + '.';
});
</script>

I also noticed you had style’s in your body tag (footer code). CSS styles in your site should always goes in the head code.

To note: custom scripts will only appear on the published site :slight_smile:

Thank you for the suggestion.

It took me a while to realize that the script won’t execute until it’s published. Now that I know this, the script works beautifully!

Thanks a lot!