Users List with Title-Departments Template | Communifire Documentation

The Users List with Title-Departments template displays a list of people with departments and job titles.

The template is a built-in template and comes with your Communifire site. To use the template:

1. Go to Control Panel > System > Page Builder and add or edit a page.
2. Click Widgets.
3. Drag a People widget onto the page.
4. On the People widget, click the gear icon > Edit Properties.
5. Set the Widget Type to People List.
6. Click Templates.
7. Select the Users List with Title-Departments template.
8. Save the widget and page.

Template HTML

Below is the HTML of this template, for your reference.

<div class="axero-widget {{CustomCSSClass}} {{#if HideContainerBorder}}axero-widget-no-border{{/if}}">
    {{#if ShowWidgetHeader}}
    <div class="axero-widget-header">
        <h3>{{{WidgetTitle}}}</h3>
    </div>
    {{/if}}
    <div class="axero-widget-content">
        <div class="list">
        <ul>
        {{#each Contents}}
        <li>   
            <div class="axero-section-list-avatar">
                <a href="{{ProfileURL}}" title="{{{trim UserInfoDisplayName ../TitleCharacterLength}}}"><img alt="{{{trim UserInfoDisplayName ../TitleCharacterLength}}}" src="{{AvatarImageURL}}" /></a>
            </div>
            <div class="axero-section-list-content">
                <div class="axero-section-list-content-title">
                <a class="axero-user-card-link" data-user="{{UserID}}" href="{{ProfileURL}}" title="{{{trim UserInfoDisplayName ../TitleCharacterLength}}}">{{{trim UserInfoDisplayName ../TitleCharacterLength}}}</a>
                </div>
                <div class="axero-section-list-content-date">
                {{{field:Occupation}}}{{#if ||field:Occupation||}}{{#if ||field:Department||}} - {{/if}}{{/if}}{{{field:Department}}}
                </div>                
            </div>
        </li>                                                     
        {{/each}}
        </ul>
        </div>
    </div>
    {{#if ShowWidgetFooter}}
    <div class="axero-widget-footer">
		{{{FooterHTML}}}
        
    </div>
    {{/if}}
</div>