Umbraco 官方技术文档翻译十、插入媒体和使用样式表和javascript

最新推荐文章于 2024-06-17 10:43:21 发布

forcefly

最新推荐文章于 2024-06-17 10:43:21 发布

阅读量578

点赞数 1

分类专栏： umbraco 文章标签： CMS umbraco 文档

umbraco 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

Rendering media

呈现媒体

Templates can access items in the Media library, to assist in displaying rich content like galleries
模板可以访问媒体库中的项目,来显示丰富的内容，比如画廊

Rendering a single media item

呈现单一媒体项目

A media node is not just a file, but a collection of fields, such width, height and the path to the stored file.

A standard image in the media library is based on the Mediatype image which provides a number of standard values - if you want to add more, simply edit the media type under settings.

一个媒体节点不仅仅是一个文件, 而是字段的集合, 比如宽度、高度和存储文件的路径。

媒体库中的标准图像是基于Mediatype——image, 提供了许多标准的值——如果你想添加更多,只需编辑设置下的媒体类型。

@{
    var mediaItem = Umbraco.Media(1234);
    var height = mediaItem.UmbracoHeight;
    var file = mediaItem.UmbracoFile;
}

<img src="@file" height="@height" />

Rendering media item with Image Cropper

呈现图像切割的媒体项目

If the Image Cropper is used as the upload field (umbracoFile) on a media type you can get the cropped image by calling the GetCropUrl function and referencing a crop alias.
如果图像收割被用作媒体类型中的上传字段(如umbracoFile)，你可以通过调用GetCropUrl函数，传入需要切割的图像的别名，来获取裁剪后的图像。

@{
    var mediaItem = Umbraco.Media(1234);
    var croppedUrl = mediaItem.GetCropUrl("cropAlias");
}

<img src="@croppedUrl" />

If you want the original, uncropped image.
如果你想要原始的，未切割的图像：

@{
  var mediaItem = Umbraco.Media(1234);
  var file = mediaItem.umbracoFile.src;
}

<img src="@file" />

Working with stylesheets and javascript

使用样式表和javascript

Bundling & Minification for JavaScript and CSS

引用&压缩JavaScript和CSS

You can of course use whatever tools you are comfortable with for bundling & minification but it’s worth noting that Umbraco ships with the ClientDependency Framework which offers simple runtime bundling & minification.

You can bundle and minify as follows in a view template file.
你当然可以使用任何工具你轻松地引用和压缩，但值得注意的是,Umbraco附带ClientDependency框架提供了一个简单的运行时的绑定和压缩。

你可以在视图模板文件中进行引用和压缩，如下：

@using ClientDependency.Core.Mvc
@using ClientDependency.Core
@{
    Html.RequiresJs("~/scripts/Script1.js", 1);
    Html.RequiresJs("~/scripts/Script2.js", 2);

    Html.RequiresCss("~/css/style.css");
}
<html>
<head>
    @Html.RenderCssHere()
    @Html.RenderJsHere()
</head>

Full details of the ClientDependency Framework can be found here: http://github.com/Shandem/ClientDependency

forcefly

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
Umbraco 官方技术文档翻译十、插入媒体和使用样式表和javascript

Rendering media呈现媒体Templates can access items in the Media library, to assist in displaying rich content like galleries模板可以访问媒体库中的项目,来显示丰富的内容，比如画廊Rendering a single media item呈
复制链接

扫一扫