3

Sitecore 10 Rich Text Editor not saving the xLink:href tag while saving one SVG image from the content editor. Please find the HTML below which I want to save.

I have done all necessary configuration for SVG images. Anyone can help m to fix this-

<svg id="whatsnew-down-arrow" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="165" height="165" viewBox="0 0 165 165">
<defs>
<style>
#whatsnew-down-arrow .cls-1, #whatsnew-down-arrow .cls-2 {
fill: #d94029;
}

#whatsnew-down-arrow .cls-1 {
opacity: 0.23;
}
</style>
</defs>
<circle class="cls-1" cx="82.5" cy="82.5" r="82.5"/>
<circle id="Ellipse_1_copy" data-name="Ellipse 1 copy" class="cls-2" cx="82.5" cy="82.499" r="74.781"/>
<image x="31" y="35" width="103" height="95" xlink:href="data:img/png;base64,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"/>
</svg>
2
  • Can you put some light on your usecase? what are you trying to achieve? Are you trying to put this code in richtext field? you can update your question for these details. Mar 24 at 11:37
  • Seems like Sitecore RTE does not like ';base64' in your xlink:href. Might be that Telerik RTE removes that as part of content filters
    – Kamil C
    Mar 24 at 12:16

4 Answers 4

2

Thank you all for all the suggestions. I finally found the solution though it has some limitations-

I can save base64 images into RTE fields after disabling the HtmlEditor.RemoveScripts setting in the Sitecore.config file:

<setting name="HtmlEditor.RemoveScripts" value="false" />

But, please note that this will allow to save javascript into the RTE field too.

0

There might be some issue with the HTML that you are going to save in RTE. But you can validate it to find out what errors you are getting exactly.

  1. Open the RTE by clicking on the Edit HTML link.
  2. Paste your HTML.
  3. Click on the Validate button and you will see the errors.

enter image description here

  1. Click on the Fix button to fix your HTML.

Hope this will help you to identify your issue.

0

Seems like Sitecore does no like ;base64, in RTE. As an alternative you could upload image to media library or deploy it with code to later use it as i.e. /assets/your-image.png and update your RTE as below.

<image x="31" y="35" width="103" height="95" xlink:href="/~/media/Default Website/sc_logo.png"></image>
0

Another way you can use to add SVG in Richtext editor follow below steps. I tried your SVG file and it worked for me.

  1. Save your code in.SVG extension file and Upload SVG into the image folder.

enter image description here

  1. Go to Richtext editor filed where you want to and click on Show Editor Button.

enter image description here

  1. In Richtext editor popup window select Insert Sitecore Media icon.

enter image description here

  1. Select a newly created media item (Test SVG in above screen) and click on Insert.

enter image description here

That's all. You will have your SVG icon in Richtext editor.

enter image description here

Hope it helps!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.