How to: Change the people directory to use a detail page - akumina/AkuminaTraining GitHub Wiki

Table of Contents

  1. Introduction
  2. Edit View
  3. Deploying

Introduction

Version: Akumina Foundation 3.3.0.0+

The Akumina People Directory widget will display user profile information in a "profile card" view by default. This functionality can be changed to go to a detail page, where additional information can be shown for the entry.

Edit View

To have a entry in the people directory go to a new page, it is necessary to edit the view for the widget.

The following must be added inside the end of the element div class="ia-profile-avatar", as shown below. Note, there are 2 locations in the view where this must be done.

The href attribute of the anchor tag needs to be changed, in the example we will send the user to the employeedetail.aspx page.

<a data-id="{{Id}}" href="/sites/Discover16/pages/employeedetail.aspx?email={{userprincipalname}}">

The following in the example in the view html file:

 {{#each People}}
   <li>
     <div class="ia-profile-avatar">
       <!--a data-id="{{Id}}" href="#user-popup" class="ia-modal-inline-trigger"><img src="{{pictureurl}}" data-user="{{userprincipalname}}" alt="User Name" /></a-->
       <a data-id="{{Id}}" href="__/sites/Discover16/pages/employeedetail.aspx?email={{userprincipalname}}__"><img src="{{pictureurl}}" data-user="{{userprincipalname}}" alt="User Name" /></a>
     </div>
     <div class="ia-profile-details">
     ...

Deploying

Follow the steps below to deploy the solution.

Edit the Widget View

  1. Download the /Style Library/DigitalWorkPlace/Content/Templates/PeopleDirectory/Default.html file.
  2. Copy the file as custom-default.html.
  3. In the Management Apps tab of Interchange, click on the View Manager. Click “Add New”. In the left pane navigate to “/DigitalWorkplace/Content/Templates/PeopleDirectory” for the folder path. Click “Choose File”, navigate to your custom template (custom-default.html). Click “Save”.

Edit the Directory widget properties

  1. In the Management Apps tab of Interchange, click on the Widget Manager app. In the Manage Widgets window, find PeopleDirectory and click its ‘Edit’ button. Add the view created in the previous section to the widget's views. Click Save & Exit button.
  2. In the Manage Widgets window, find PeopleDirectory and click its ‘View Instances’ button. Then click on ‘Edit’ for the only item there, which should be the default. In the "WidgetOptions" section, select the new view as the display and the selected view. Click Save & Exit
⚠️ **GitHub.com Fallback** ⚠️