Closed developergaurav closed 1 year ago
Add the "setag" class to the top-level element.
<section class="__se__tag">
@JiHong88 If you notice, We already have this class on the top of the element as per the documentation. The funny thing is if we have one image in HTML it works fine but if we have multiple images, it behaves oddly. It removes parent HTML tags (in this case tag has been removed and image wrapper put outside of parent brand-items
). There are some other things we noticed when using this version. It works well in 2.15.0 (with these classes __se__tag
or se-component
and so on) which we have downgraded for now. But this version has other compatibility problems.
Dude! you are doing things wrong. See Here
@PRO-BROS What's wrong?
@JiHong88 If you notice, We already have this class on the top of the element as per the documentation. The funny thing is if we have one image in HTML it works fine but if we have multiple images, it behaves oddly. It removes parent HTML tags (in this case tag has been removed and the image wrapper put outside of the parent
brand-items
). There are some other things we noticed when using this version. It works well in 2.15.0 (with these classes__se__tag
orse-component
and so on) which we have downgraded for now. But this version has other compatibility problems.
@JiHong88 Is there something you find at your end?
@developergaurav Can you show me the "HTML" string you are testing right now?
@developergaurav "HTML" code is missing.
@developergaurav "HTML" code is missing.
@JiHong88 Actually, it is there but somehow GitHub makes it invisible. Attached again:
<section class="content-pages page-brands">
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="brand-outer">
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo1.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo2.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo3.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo4.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo5.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo6.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo7.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo8.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo9.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo10.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo11.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo12.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo13.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo14.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo1.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo15.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo16.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo17.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo18.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo19.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo20.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo21.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo22.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo23.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo24.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo25.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo26.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo27.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo28.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo29.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo30.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo31.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo32.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo33.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo34.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo35.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo36.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo37.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo38.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo39.png" alt="" />
</a>
</div>
<div class="brand-items">
<a href="javascript:void()" target="_blank">
<img src="https://example.com/uploads/images/logo40.png" alt="" />
</a>
</div>
</div>
</div>
</div>
</div>
</section>
The 2.44.4 version has been updated. Thank you.
@JiHong88 Thanks to you! I will update it.
Describe the bug I am using sun-editor v3.4.1 in react. but it is not working right with image tags. I have whitelisted multiple tags and even tried to use se-component and setag as suggested in the document. It is replacing the tags and removes the parent tag automatically.
To Reproduce Steps to reproduce the behavior:
Expected behavior It should remain to its own parent somehow and shouldn't remove parent tags.
Screenshots
Additional context
<section class="content-pages page-brands se-component"> <div class="container __se__tag"> <div class="row"> <div class="col-lg-12"> <div class="brand-outer"> <div class="brand-items"> <a href="javascript:void()" target="_blank"> <img src="https://example.com/uploads/images/logo1.png" alt="" /> </a> </div> <div class="brand-items"> <a href="javascript:void()" target="_blank"> <img src="https://example.com/uploads/images/logo2.png" alt="" /> </a> </div> </div> </div> </div> </div> </section>