Rendrering footnotes references in the richtextblock wagtail

Question

Using wagtail-footnotes I have a problem of passing the footnote's reference number to the templates of my Richtextblock. I followed the Readme instructions. After inserting the data, the footnotes are rendered correctly in the page's 'footer'/footnotes section. The footnote's reference number in the Richtextblock (the 'page.body') displays the numbers that are attributed by the plugin on the Admin. ex: 3ec45 rather in ascending order.

To isolate the problem, I used a simple page model which has StreamField or CustomStreamFieldBlock in it.

It seems that my problem is more related to customize the Richtextblock. Based on the lines of code that render the footnotes in section (see below), I tried to loop and render the [{{ forloop.counter }}], in a customRichTextBlock... however, I rendered it as a separate block and not inside the RichTextBlock itself.

<ol>{% for footnote in page.footnotes.all %}
 <li id="footnote-{{ forloop.counter }}">
[{{ forloop.counter }}] {{ footnote.text|richtext }}
<a href="#footnote-source-{{ forloop.counter }}" aria-label="Back to content">↩</a>    </li>
{% endfor %}</ol>

I found nearly no references or repo to compare with. Any advise or reference as to how I can advance will be highly appreciated.