Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.
SOLVED

How do i remove space getting added when using sourceedit in text component

Avatar

Level 3

In Text component I have added sourceedit plugin using the below structure
/apps/foundation/components/text/dialog/items/tab1/items/text/rtePlugins/misctools

Now every time i had a tag say 
<footer class="row" > <img src="images/svg/logo-colour.svg" class="logo"><ul class="links"></footer>


It introduces the below spaces
<p> </p>
<p> </p>
<p> </p>
<p> </p>


My question:-

How can this avoided that is adding the below spaces on every time source edit is opened and saved

<p> </p>
<p> </p>
<p> </p>
<p> </p>

1 Accepted Solution

Avatar

Correct answer by
Level 10

Currently HTML5 tags like <section>,<header>.. tag in RTE plug-in is not supported. The non working html starting with <P> with html5 blocked elements. So an empty space will be added automatically. Also the html is not well formed and you might see additional issue. Because html preprocessor validates the source and added additional missing tags to meet with rte requirements.

If your authors are well versed with html syntax and need to provide flexible along with html5 syntax then OOB rte might not suit. Below are recommended options to implement at project level[1].

Optionally try with Configure removeSingleParagraphContainer as described at [A]. Attaching snapshot for a quick reference also. [img]Snapshot.png[/img]. Might work for your html trying to implement.

[A]

<htmlRules jcr:primaryType="nt:unstructured">
<blockHandling jcr:primaryType="nt:unstructured" removeSingleParagraphContainer="{Boolean}true"/>

</htmlRules>

[1]

* Build an simple component to insert the html content directly from dialog text input and render it.
* Build a custom WYSIWYG.
* Overlay OOB rte and tweak the htmlProcessor/DomCleanup as per your need.

View solution in original post

1 Reply

Avatar

Correct answer by
Level 10

Currently HTML5 tags like <section>,<header>.. tag in RTE plug-in is not supported. The non working html starting with <P> with html5 blocked elements. So an empty space will be added automatically. Also the html is not well formed and you might see additional issue. Because html preprocessor validates the source and added additional missing tags to meet with rte requirements.

If your authors are well versed with html syntax and need to provide flexible along with html5 syntax then OOB rte might not suit. Below are recommended options to implement at project level[1].

Optionally try with Configure removeSingleParagraphContainer as described at [A]. Attaching snapshot for a quick reference also. [img]Snapshot.png[/img]. Might work for your html trying to implement.

[A]

<htmlRules jcr:primaryType="nt:unstructured">
<blockHandling jcr:primaryType="nt:unstructured" removeSingleParagraphContainer="{Boolean}true"/>

</htmlRules>

[1]

* Build an simple component to insert the html content directly from dialog text input and render it.
* Build a custom WYSIWYG.
* Overlay OOB rte and tweak the htmlProcessor/DomCleanup as per your need.