无法使用 umbraco inline 添加背景图像

Question

我正在尝试将媒体选择器中的图片添加到我的网站。它需要作为背景图像作为内联放置在我的 header 中。但是它不会出现在我的网页上。

Header代码：

<header style="width: 100%; height: 100%; background-image: url('@Umbraco.TypedMedia(Model.Content.GetPropertyValue("backgroundimage"))')"></header>

是的，别名是：backgroundimage

如何让它在网站上可视化？

Answer 1

Umbraco.TypedMedia(Model.Content.GetPropertyValue("backgroundimage")) 将 return 一个 IPublishedContent 对象。您需要在内联代码中渲染出它的 Url 属性。

试试这个：

@{
    var backgroundImage = Umbraco.TypedMedia(Model.Content.GetPropertyValue("backgroundimage"))
}
<header style="width: 100%; height: 100%; background-image: url('@backgroundImage.Url')">
</header>

如果你想验证你是否有一个有效的图像（即用户指定了一个）你可以更进一步，这样做：

<header 
 style="width: 100%; height: 100%; @(backgroundImage == null ? null : "background-image: url('" + backgroundImage.Url + "')"
>
</header>

Answer 2

我已经尝试了我能找到的所有参考方法，唯一对我有用的是将整个 url 字符串及其引号放入一个字符串变量中，然后将该变量放在后台-单独的图像声明。其他任何东西都剥夺了我的 url 编码。

string BkgImage = '"' + mediaItem.Url + '"';
 <a href="@post.Url" class="post-news__thumb-bkg" style="background-image: url(@BkgImage)">
  <img class="post-news__spacer" src="~/Images/spacer.gif" alt="@alt" />
 </a>

无法使用 umbraco inline 添加背景图像

Can't add a background image with umbraco inline

umbraco

umbraco7