Umbraco - 如何在 IMG 标签的 src 中显示来自媒体选择器的图像?

Umbraco - How to display an image from a media picker in the src of an IMG tag?

如何获取在 umbraco 中使用媒体选择器选择的图像的 url - 我找到了 umbraco 文档,其中突出显示媒体选择器的 return 值是选择的项目。但这肯定是您用来向模板添加图像的方式吗?

我想做...

<div class="title" style="background-image:url(@Umbraco.Field("mediaPicker"))">
   <h1>...@Umbraco.Field("pageTitle")</p>
</div>

谢谢

根据 Umbraco Documentation 你有两个选择,我的建议是第一个,因为我相信在未来的版本中将不再支持动态。

1。打字

@if (Model.Content.HasValue("caseStudyImages"))
{
    var caseStudyImagesList = Model.Content.GetPropertyValue<string>("caseStudyImages").Split(new string[] { "," }, StringSplitOptions.RemoveEmptyEntries).Select(int.Parse);
    var caseStudyImagesCollection = Umbraco.TypedMedia(caseStudyImagesList).Where(x => x != null);

    foreach (var caseStudyImage in caseStudyImagesCollection)
    {      
        <img src="@caseStudyImage.Url" style="width:300px;height:300px" />      
    }                                                               
}

2。动态

@if (CurrentPage.HasValue("caseStudyImages"))
{
    var caseStudyImagesList = CurrentPage.CaseStudyImages.Split(new string[] { "," }, StringSplitOptions.RemoveEmptyEntries);
    var caseStudyImagesCollection = Umbraco.Media(caseStudyImagesList);

    foreach (var caseStudyImage in caseStudyImagesCollection)
    {
        <img src="@caseStudyImage.Url" style="width:300px;height:300px" />
    }
}

ID 用于将媒体对象作为 TypedMedia 对象取回,从那里您可以访问图像 url。

您可以使用 Umbraco.Media(),它是动态的,就像 Umbraco.Content()

<div class="title" style="background-image:url(@Umbraco.Media(CurrentPage.MediaPicker).Url)">
   <h1>...@CurrentPage.PageTitle</p>
</div>

显示图像的简单方法:

//Get the ID of the Field
var mediaId = Umbraco.Field("NameOfYourField");
//Get the MediaType to Write the URL
var media   = Umbraco.Media(mediaId.ToString());
//Salve the Path into the Image
var image   = media.Url;

<img src="@image">

简单易行。