Footnote (Citation) component in AEM

[#1]

What is the best way to create a Footnote component that works similar to citation in Wikipedia.

When you click on superscript it will go to references.

The author can remove a superscript number and the rest of the content should auto-number by itself.

[#2 · Accepted solution]

I would overlay the RTE in a way, that such footnotes are embedded inline into the text as JSON; and when displaying the content, some Javascript runs through it, extracts the JSON and displays it at the bottom of the page. Renumbering is then done completely dynamic and you also don't need to care about it at all.

Jörg

[#3]

Can you open a ticket with Adobe support and ask for help for this specific problem? Detail your requirement, your approach and ask how you can solve it.

Thanks,

Jörg

[#4]

This is precisely what we are doing. The problem is that the RTE overlay is not working.  The fields appear and allow text to be entered, but the results are not saved.  This is only an issue with [sling:resourceType="cq/gui/components/authoring/dialog/richtext" - All other resourceTypes will work.

Just to be clear, extracting the JSON is not an issue. It's simply the fact that the standard implementation of RTE does not work under the structured content 'modal' page implementation (see item #2 under the Solution here: Experiencing Adobe Experience Manager - Day CQ: AEM 65 - Touch UI RTE (Rich Text Editor) Plugin for ...

The example uses a textfield and textarea.  These resource types work fine, but the richtext does not.

[#5]

As a clarification, the issue is not related to the HEADER or FOOTER of the site (the top and bottom site components).  The issue is with footnotes or citations as described in the original question posted.

[#6]

You can review WKND tutorial for header & footer creation: 7 - Header and Footer

[#7]

We had a solution to this in Classic UI (AEM 6.2), however, as we are upgrading to 6.5 and the Touch UI the conversion is held up for us due to an issue with the Richtext resource type.

If you do not need rich text for the footnote, this post might help: Experiencing Adobe Experience Manager - Day CQ: AEM 65 - Touch UI RTE (Rich Text Editor) Plugin for ...

I implemented that and it worked until I tried to use richtext in the structured content modal/dialog.