# Example Mask Widget ### Overview For this example, we will be creating a **Locker & Badge Assignment Widget**, designed to display personalized locker and badge details for each user configured in the associated tracker. It combines HTML formatting with dynamic field variables and conditional display logic to ensure only the correct user sees their information.

This example assumes that a Tracker is already populated with Locker and Badge Assignments, as well as other user information. *** ### Filtering the Data for Logged-in Users To make sure each logged in user only sees their own details, we will configure a [**User Look Ahead**](https://guides.mangoapps.com/user-guide/trackers/tracker-column-types#user-look-ahead) column for our **Employee** column. We will now create a [**Table**](https://guides.mangoapps.com/user-guide/trackers/adding-a-new-table-view) filtering the tracker information so it only shows data for the currently logged-in user.

With this table configuration, if Stella, our example user, is the logged-in user, she will only see her own locker and badge assignment. *** ### Publishing the Widget Once configured, [**add this filtered table as a widget to the Widget Gallery**](https://guides.mangoapps.com/user-guide/trackers/trackers-and-forms-widget) so it can be easily reused or added to relevant dashboards. Add the widget to a dashboard or newsfeed and [**set the widget view to Card (HTML Base)**](https://guides.mangoapps.com/user-guide/trackers/trackers-and-forms-widget/tracker-widget-view-type#card-html-based). *** ### HTML Template with Dynamic Fields Use the following HTML snippet to structure your widget. This includes dynamic variables and the `%{decrypt}` function to securely display encrypted fields such as `badge_id` and `locker_code`. ```html

My Location

%{location}

Badge ID

%{decrypt(badge_id)}

Locker Number

%{locker_number}

Locker Code

%{decrypt(locker_code)}

``` *** The widget will now dynamically reflect the user's information upon log in, as long as they have an entry in the tracker. If there is no information for the logged in user, the widget will be blank.

--- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://guides.mangoapps.com/user-guide/trackers/mask-field/example-mask-widget.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.