UI Templates

On pages like "Content Types" and "Search", each list item has some detailed information displayed. You can customize the information you hope to appear via UI Templates.

Create a UI Template

Fill in the title and a unique key to create a new UI template. You can also write down some description for the template.

Nodes with qname n:ui_template have two properties: key, which is a unique identifier of the template, and type, which is the type of targets the template is applied to. Currently the default hidden type is set to "listItem" whenever a new UI template is created.

Settings of UI Templates

There are three configurable pages at the moment: Search page, Documents page, and Content Types page. If there's no UI template configured for the page yet, you can add a new template by clicking "Add New Item".

For pages that have been customized before, you can see a list of templates configured for different types. To change the template for a type, select a different template in its drop down menu. Click the minus button to remove a configuration. Click any add button to add a new UI template configuration.

Note: Each type can only be configured once on the same page. Meaning that you can't configure type "Book" to use template1 and use template2 at the same time on the same page.

The Default Template

All list items on the above three pages are using the following UI template by default. Once you get your page customized with a new template, it will overwrite the default template.

<h2 class='list-row-info title'>
    <a href='{{linkUri data}}'>{{title data}}</a>
</h2>

<div class='list-row-info-summary-block primary'>
    <span class='list-row-info-summary-body'>
        <p class='list-row-info modified'>Modified {{dateModified data}} by 
            {{#if (enableModifierUri data)}}
            <a href='{{modifierUri data project}}'>
            {{/if}}
                {{modifiedBy data}}
            {{#if (enableModifierUri data)}}
            </a>
            {{/if}}
        </p>
        <p class='list-row-info created'>Created {{dateCreated data}} by 
            {{#if (enableCreatorUri data)}}
            <a href='{{creatorUri data project}}'>
            {{/if}}
                {{createdBy data}}
            {{#if (enableCreatorUri data)}}
            </a>
            {{/if}}
        </p>
        <p class='list-row-info'>Type: {{type data}}</p>

        {{#if (hasDefaultAttachment data)}}
        <p class='list-row-info'>
            File Typea: {{attachmentType data}} 
            <a href='{{attachmentDownloadUri data}}' target='_blank'>(download attachment)</a>
        </p>
        <p class='list-row-info'>
            Size: {{attachmentSize data}}
        </p>
        {{/if}}

        {{#if (hasTranslation data)}}
        <p class='list-row-info'>
            Translation of 
            <a href='{{translationUri data project}}'>
            {{translationMasterNodeId data}}
            </a>
                for locale 
            {{translationLocale data}}
        </p>
        {{/if}}

        {{#if (hasPerson data)}}
        <p class='list-row-info'>
            Email: {{personEmail data}}
        </p>
        {{/if}}

        {{#if (isLocked data)}}
        <p class='list-row-info summary'>
        <i class='fa fa-lock'></i> Locked By: <a href='{{lockedByHref data project}}'>{{lockedByName data}}</a>
        </p>
        {{/if}}

        {{#if (isTaggable data)}}
        <p class='list-row-info'>Tags: 
        {{#each (allTags data)}}
            <span class='list-row-info-tag'>{{this}}</span>
        {{/each}}
        </p>
        {{/if}}

    </span>
</div>