Expand my Community achievements bar.

Remove Span element from RTE component while dragging text

Avatar

Level 2

Hi Members,

 

We are facing an issue where <span> element is getting added to text with its own styling while dragging text within Rich Text (RTE) component. 

 

In the below example, when I drag "world" to the end of line, span element got added.

 

BEFORE:

<p>world&nbsp;world&nbsp;&nbsp;
<a data-popemb="Pop-up" class="content-popup" href="/content/we-retail.html" target="_self" style="font-size: 0.955555em; background-color: rgb(255,255,255);">hello</a>
</p>

 

 

 

 

AFTER:

<p>world&nbsp;&nbsp;
<a data-popemb="Pop-up" class="content-popup" href="/content/we-retail.html" target="_self" style="font-size: 0.955555em; background-color: rgb(255,255,255);">hello</a>
<span style="font-size: 12.4222px;">world&nbsp;</span></p>

 

Could you please help in finding the root cause of the issue ?

3 Replies

Avatar

Community Advisor

Hi @yashaswidotiya ,

 

If I have understood your requirement correctly then you can use context='html' to output markup. Like below-

 

${properties.title @context='html'}

 

Reference-

https://experienceleague.adobe.com/docs/experience-manager-htl/using/htl/expression-language.html?la...

Avatar

Level 2

Hi Ritesh,

 

I think you have misunderstood my question. 

The issue here is not with markup but during authoring itself. While you drag the data inside rich text component from 1 place to another, span element get added surrounding the dragged content. you can have a look at the code snippet in question, where i dragged "world" to end of the string, span got added to it.

Avatar

Level 3

@yashaswidotiya , @Ritesh_Mittal I'm also facing the same issue while using custom styles inside RTE, style classes are getting wrapped up with the additional span tag so unable to target html elements directly with their respective classes.