Cannot select SVGs in rich text editor

Tracey Penberthy asked on May 5, 2017 17:58

I can select and display SVGs OK from web parts / widgets using the media selector to add images.

However when I try and do this from the rich text editor (using the InsertImageOrMedia button) I cannot select the svg from the media library once it has been uploaded.

Also if I use the QuickInsertImage button to upload an svg then a link to the file is displayed in the editor instead of the image.

Is there some configuration I need to do around the CK Editor in order to enable svgs to be selected and displayed appropriately.

Many Thanks Tracey

svg rich text editor

Recent Answers

Brenden Kehren answered on May 5, 2017 18:05

You need to allow svg in the settings. Go to Settings>System>Files and in the Upload extensions add svg at the end. Also in Settings>Content>Media add svg in the Media file allowed extensions list there too.

0 votesVote for this answer Mark as a Correct answer

Tracey Penberthy answered on May 5, 2017 18:13

Thanks Brenden

I have added svg to both those settings.

I don't have any trouble uploading, selecting and viewing them when using a media selector in a web control.

It is the rich text editor that I am having issues with, is there a config setting I need to set for that as well?

0 votesVote for this answer Mark as a Correct answer

Brenden Kehren answered on May 5, 2017 18:27

Did you just add those settings? If so, did you clear your cache to ensure the CKEditor was refreshed with the new settings?

0 votesVote for this answer Mark as a Correct answer

Tracey Penberthy answered on May 8, 2017 10:26

Thanks Brenden

I have cleared my cache, unfortunately I am still getting the issues...

0 votesVote for this answer Mark as a Correct answer

wade furney answered on July 19, 2017 20:16

I am having the same problem. Did you ever get this working?

0 votesVote for this answer Mark as a Correct answer

Tracey Penberthy answered on July 20, 2017 18:03

Hi Wade

The way I got it to work in the end was pretty hacky.

I created an inline widget called Image (Security "This widget can be used as inline widget").

This widget had an Image field in it (Data type: text, form control: Media selection) and outputted the selected image. I added the 'InsertWidget' button to the richtext toolbar. This way I could get images to display in richtext output (although do be aware that widgets render in the rich text editor as a cog icon button).

Note: if you do this make sure you Resolve the inline controls properly whenever you render out the richtext https://devnet.kentico.com/articles/how-to-resolving-the-inline-controls

0 votesVote for this answer Mark as a Correct answer