How to Integrate AEM touch UI RTE with Markdown?

[satyam_bansal]

As we have seen content fragments offers RTE with Markdown.

I have a use case where I need to convert Touch UI RTE with Markdown. If anyone has implemented it, please help me in same.

[edubey]

It's not available OOTB and RTE is tightly coupled to work with HTML

AFAIK, only place where markdown can be used is Content Fragment. You can have a look and see if it works for your use case.

[satyam_bansal]

Content Fragments will not work for my use-case. Is there any library which can convert Authored Text in RTE to Markdown. I was searching on Internet I found flexmark. Does anyone have used it to convert Authored Text to Markdown. PFB the url

GitHub - vsch/flexmark-java: CommonMark/Markdown Java parser with source level AST. CommonMark 0.28,...

[edubey]

Satyam,

Think about this, RTE content is HTML and at run time as author updates it doesn't make sense to convert it to Markdown since RTE cant render markdown view.

1. You can try to leverage markdown portion from CF and hook in to a dialog box for author.

OR

2. Once author has completed RTE update, convert that to markdown.

Approach 1 is good as author can use markdown for creating content and may be complex to implement.

Approach 2 author still uses HTML to create but page renders as markdown

and another approach you could think of is use a markdown plugin editor in dialog, this should provide better experience and fairly easy to implement

https://ourcodeworld.com/articles/read/359/top-7-best-markdown-editors-javascript-and-jquery-plugins

[satyam_bansal · Accepted solution]

Thanks for your response.

Approach 1 is good but due to time constraint would not follow it for now. Hopefully can post something on it future for our community.

I got it working, by successfully converting RTE generated HTML to Markdown and sending Markdown to the PWA.

I have used below code for others reference:

Maven Dependency :

<dependency>
<groupId>org.jsoup</groupId>
<artifactId>jsoup</artifactId>
<version>1.11.3</version>
<scope>provided</scope>
</dependency>

<dependency>
<groupId>com.vladsch.flexmark</groupId>
<artifactId>flexmark-osgi</artifactId>
<version>0.34.22</version>
<scope>provided</scope>
</dependency>

Code to covert HTML to Markdown:

FlexmarkHtmlParser.parse(htmlInput)