DFS 11.1 - 3 Render DAM for Sitecore Field Types

Owned by Martin Ulisse
May 07, 2024
4 min read

DAM for Sitecore extends Sitecore's field controls for Web Forms and Sitecore's field helper for Sitecore MVC to render the three field types in a Sitecore page. The key information for rendering most asset types is the AssetItemId and the quality. This information is stored in the field data.

 

 

3.1 Register control tag

For Sitecore MVC:

@using DFS.Data.Fields

For Web Forms:

<%@ Register assembly="DFS" Namespace="DFS.Web.UI.WebControls" TagPrefix="dfs" %>

3.2 How to render an asset

The field render is used to render an asset as a visual output if possible. It supports some optional attributes that can be used to control which quality is outputted.

For Sitecore MVC:

@Html.Sitecore().Field("MyAssetMediaField") @Html.Sitecore().Field("MyAssetMediaField", new {quality="QualityId"})

For Web Forms:

This will render any asset type. Depending on the asset of type, the appropriate HTML is rendered.

These are the parameters that can be used for the field type Asset.

NOTE: all another not known parameters will be added to the html without any validation.

Attributes

Description

Field

Is the name of the Sitecore field. Is mandatory.

quality

If this attribute is set, the default quality is changed at runtime, to the specified Quality. Qualities are given either by the Digizuite™ quality ID (an integer) or by the quality name.

Changing the Quality may change how the asset is rendered. E.g. if an asset is a PDF, and you change the Quality to the thumbnail, the PDF will be rendered as an image.

Note that some qualities might not have a rendering output. It depends on the configuration, both in Digizuite™ and in DAM for Sitecore.

Note: DAM for Sitecore can be configured to ignore this attribute, as a part of the customization of the HtmlOutput.

width, height

Resize the asset to specific width and height.





keepAspectRatio

Force image resize and keep aspect ratio.





upscaleAllowed







style (CssStyle)

Set the inline CSS style for the Asset element.





class (CssClass)

Set the HTML class for the Asset element.





3.3 How to render an asset link

The syntax to render a link of an asset.

For Sitecore MVC:

For Web Forms:


There are a number of parameters that can be used.
NOTE: all another not known parameters will be added to the html without any validation.

Attributes

Description

CssStyle

Works the same ways as other ASP.NET implementations of CssStyle.

CssClass

Works the same ways as other ASP.NET implementations of CssClass.

Field

Is the name of the Sitecore field. It is mandatory.

Quality

If this attribute is set, the default or selected quality is overridden at runtime to the specified Quality. Qualities are integers from Digizuite™ quality ID (an integer).

Note: DAM for Sitecore can be configured to ignore this attribute, as a part of the customization of the HtmlOutput.

3.4 How to render a list of assets

DAM for Sitecore extends Sitecore with a field type, allowing to register multiple assets in one list. The assets in the list can be of any asset type.

To render a AssetList:

For Sitecore MVC:

For Web Forms:

This will render the assets in a list of this type:



Attributes

Description

Field

Is the name of the Sitecore field of the type AssetList.

ListClass

If set is the class name of the <ul> tag. Optional.

ItemClass

If set is the class name of each <li> tag. Optional.

Experience Editor

In order to make the assetlist editable in Experience Editor, use Sitecores EditFrame.

For Web Forms:

For Sitecore MVC:

Add your button to Core under Edit Frame Buttons – /sitecore/content/Applications/WebEdit/Edit Frame Buttons/ and remember to update the field Fields - pipe-separated list of field names to be edited by the Field Editor on the button item.  

3.4.1 Iterating an Asset List

While the field render extension for the AssetList field will be useful for many general cases, there will also be a need for more specific handling of individual items. You can get the assets as a list, and iterate over each asset.

You can also pass an AssetListItemAtt object to RenderAsset. This will allow you to set the attributes of each AssetListItem 



3.5 Rendering html templates

The rendering html for each asset type is located at: Sitecore → System → Modules → Digizuite → Render Templates. In the section HTML, there are these fields:

  • Rich Text Editor Media

  • Rich Text Editor Link

  • Asset Field Type

  • Assetlink Field Type

  • Content Editor Asset

  • Url

  • DownloadUrl

Each field correspond to different context. In these fields you can use known tags (stampvalue), which will be replaced in a pipeline called DFS.GetAssetFieldValue  


stampvalue-asset

See this table for possible values, that can be used.



stampvalue-selected

Property name

Stampvalue

Type

Description

Quality

{stampvalue-selected:quality}

String

The selected quality id, which correspond to a media format id in Digizuite DAM.

AssetItemId

{stampvalue-selected:assetitemid}

String

The Sitecore item id.

Language

{stampvalue-selected:language}

Int

The context language name.



stampvalue-config

Property name

Stampvalue

Type

Description

Baseaddress

{stampvalue-config:baseaddress}

String

The base url for the Digizuite DAM.

Defaultthumb

{stampvalue-config:defaultthumb}

String

The media url.

Defaultlargethumb

{stampvalue-config:defaultlargethumb}

String

The media url.

Defaultvideo

{stampvalue-config:defaultvideo}

String

The media url.

Defaultaudio

{stampvalue-config:defaultaudio}

String

The media url.

Cdn

{stampvalue-config:cdn}

String

The config settings: DFS.MediaPipeline.CDN.Prefix

Mediapipeline

{stampvalue-config:mediapipeline}

String

The config settings: DFS.MediaPipeline.

Qualityname

{stampvalue-config:qualityname}

String

The quality name.