Umbraco媒体类型中的多个图像SVG文件

时间:2015-10-05 12:00:01

标签: svg png jpeg umbraco opacitymask

我非常擅长Razor / MVC,但对Umbraco来说却很陌生。我有一个源代码设计,其中包含一个包含在SVG中的Jpeg和一个灰度PNG,这样我就可以在比通常少得多的内存中获得透明背景图像。

想知道如何在Umbraco中设置媒体类型,将SVG文件和支持位图放在同一个文件夹中。

我尝试创建一个包含3个上传插槽的新媒体类型,并将新类型创建为文件夹类型,但是当我查看我的文件夹/ media / 1071时,它只包含SVG。

有没有办法让Umbraco将所有3个文件上传到同一个文件夹,以便SVG文件可以找到支持文件?

谢谢,

标记

1 个答案:

答案 0 :(得分:0)

我不确定这是否是Umbraco中的正确方法,但我确实设法使我的透明JPeg类型工作。

我没有制作新的媒体类型,而是制作了新的文档类型。我还为文档类型创建了一个默认模板。

通过向文档类型添加两个媒体选择器属性,并在模板中将Content-Type设置为“image / svg + xml”,我可以从模板中动态生成相应的SVG文件。 / p>

所以这是适用于我的新DocType的模板。

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage
@{
    Layout = null;

    UmbracoContext.HttpContext.Response.ContentType = "image/svg+xml";  

    var colourLayer = Umbraco.Media(Umbraco.Field("colourLayer").ToString());
    var maskLayer = Umbraco.Media(Umbraco.Field("maskLayer").ToString());
}<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 @colourLayer.umbracoWidth @colourLayer.umbracoHeight" enable-background="new 0 0 @colourLayer.umbracoWidth @colourLayer.umbracoHeight" xml:space="preserve">
  <image overflow="visible" width="@colourLayer.umbracoWidth" height="@colourLayer.umbracoHeight" mask="url(#imgmask)" xlink:href="@colourLayer.umbracoFile" />
  <mask id="imgmask">
    <image overflow="visible" width="@colourLayer.umbracoWidth" height="@colourLayer.umbracoHeight" xlink:href="@maskLayer.umbracoFile" />
  </mask>
</svg>

如果这不是Umbraco的工作方式,请告诉我。我更喜欢使用系统而不是反对它。