dcm.LogosWidget
The
<dcm.LogosWidget>
tag provides a way to easily and repeatably display small images. As the name implies, this can be used to display logos of brands, but also awards, partnered sites, etc.
It also uses the
files
directory, versus the
galleries
directory that other image widgets typically use, to allow for greater image formats that smaller logo type images might use.
Attributes
-
Path: specifies where the banner images are. The
/filesis assumed, so/is the root gallery folder. -
Size: specifies the width in terms of the standard supported sizes. The default is
1-3. See a list of the supported and custom sizes . -
PropertyEditor: this is an optional attribute that references another file that allows you to 'mix-in' other parameters in the template. For example, you could have some text or a url associated with each alias. TODO: Link to info on PropertyEditor?
Usage Notes
Current maximum amount of images that can be used per LogoWidget is 24.
Template
In the simplest usage a template contains an
img
pointing to the path contained in
$_Image.Path
and wrapped in a
div
that links to the image alias (folder name) from
$_Image.Alias
.
<Template>
<div data-dcm-alias="{$_Image.Alias}">
<img src="{$_Image.Path}" class="pure-img" />
</div>
</Template>
The template is cloned for each image in the file path and the variables are replaced with the current
$_Image
values.
Learn more about templates and variables can be used when building a gallery.
Examples
<dcm.LogosWidget id="logos1" Path="/logos" Size="1-4" class="logo-list">
<Template>
<div data-dcm-alias="{$_Image.Alias}" class="paired-brand-section">
<img src="{$_Image.Path}" class="pure-img brand-logo-img" />
</div>
</Template>
<Image Alias="logo1.jpeg" />
<Image Alias="logo2.jpeg" />
<Image Alias="logo3.jpeg" />
<Image Alias="logo4.jpeg" />
</dcm.LogosWidget>
Output:
