I've removed svg from this config setting <disallowedUploadFiles>ashx,aspx,ascx,config,cshtml,vbhtml,asmx,air,axd,swf,xml,xhtml,html,htm,php,htaccess</disallowedUploadFiles> and I can now upload SVG files to media. I can also select them using the media picker.
I can't, however, select SVG files using the 'Image' grid editor or the RTE. Is it possible to allow SVG files to be selected from these editors?
Thanks Daniel. Adding that config setting did allow me to select images from the RTE and Grid Editors. Unfortunately, I now get an error when uploading new SVG files, which is perhaps the issue you experienced previously.
I believe this is a bug. You have to treat SVG's as files, rather than images otherwise you get an error when uploading, to get them to upload and then you can't select the SVG file with the media picker from the RTE editor or using the standard image grid editor because they only select images. I was trying to select SVG files for use in the grid editor so the solution I found for my situation was to create a custom grid editor, using LeBlender package, that used a media picker to select my svg images.
I had a similar issue where I wanted an SVG with a PNG fallback image that could be chosen from the media library and inserted into a page. I built a macro with 3 parameters and with lots of testing got the following code to work:
First Parameter: svgImage (MediaPicker)
Second Parameter: pngImage (MediaPicker)
Third Parameter: altText (TextString)
@inherits Umbraco.Web.Macros.PartialViewMacroPage
@using Umbraco.Core.Models.PublishedContent
@using ContentModels = Umbraco.Web.PublishedModels;
@using Umbraco.Web
@using Umbraco.Core
@{
var svgId = Model.MacroParameters["svgImage"].ToString();
var pngId = Model.MacroParameters["pngImage"].ToString();
var altText = Model.MacroParameters["altText"].ToString();
var svgMediaItem = Umbraco.Media(@svgId) as ContentModels.File;
var pngMediaItem = Umbraco.Media(@pngId) as ContentModels.Image;
}
@* SVG Image *@
<img class="img-responsive" style="width:100%" src="@svgMediaItem.Url" onerror="[email protected]" alt="@altText" />
Adding SVG to grid editor and RTE
I've removed svg from this config setting
<disallowedUploadFiles>ashx,aspx,ascx,config,cshtml,vbhtml,asmx,air,axd,swf,xml,xhtml,html,htm,php,htaccess</disallowedUploadFiles>and I can now upload SVG files to media. I can also select them using the media picker.I can't, however, select SVG files using the 'Image' grid editor or the RTE. Is it possible to allow SVG files to be selected from these editors?
I'm using v7.7.8
You need to create imageFileTypes and add SVG to there https://our.umbraco.org/documentation/reference/config/umbracosettings/#imaging
Although, last time I did that I encountered another issue, and I can't remember what!
Thanks Daniel. Adding that config setting did allow me to select images from the RTE and Grid Editors. Unfortunately, I now get an error when uploading new SVG files, which is perhaps the issue you experienced previously.
Ah, yes, that is the one! I remember now
Sadly, I've never been able to fix this. Hopefully someone else might no more though
I believe this is a bug. You have to treat SVG's as files, rather than images otherwise you get an error when uploading, to get them to upload and then you can't select the SVG file with the media picker from the RTE editor or using the standard image grid editor because they only select images. I was trying to select SVG files for use in the grid editor so the solution I found for my situation was to create a custom grid editor, using LeBlender package, that used a media picker to select my svg images.
The bug described has been raised previously here: http://issues.umbraco.org/issue/U4-10556
Hi,
With Umbraco 8, need to add "svg[class]" under validElements tag in "config\tinyMceConfig.config" and it will allow manually copy-paste of svg files.
Thanks
I had a similar issue where I wanted an SVG with a PNG fallback image that could be chosen from the media library and inserted into a page. I built a macro with 3 parameters and with lots of testing got the following code to work:
is working on a reply...