Mood
The web part which encourages self-expression and provides insights into the collective mood of your team.
Last updated
Was this helpful?
The web part which encourages self-expression and provides insights into the collective mood of your team.
Last updated
Was this helpful?
Mood is a web part designed to foster a sense of community and emotional awareness within your organization. By allowing each user to select an emoticon that best represents their mood of the day, this web part encourages self-expression and provides valuable insights into the overall well-being of your team. The web part is composed of three sections:
The user's daily mood: each user can choose from a variety of emoticons to represent their mood for the day. The interface is simple and intuitive, making it easy for users to update their mood with just a few clicks.
The user's mood history: this section displays a personalized history of the user’s moods over the past week.
The team's daily mood: this section of the web part highlights the most selected emoticon by the user's colleagues on the current day.
In addition, you can create a dedicated page for administrators to view the overall history of moods across the organization. Admins can see the moods selected by all company members on any given day, allowing for the identification of broader emotional patterns and potential areas of concern.
The Mood web part encourages engagement, inviting users to express their emotions and fostering a more connected workplace community. Moreover, the Admin View functionality provides administrators with valuable data that can aid in making informed decisions to support employee well-being and enhance workplace morale.
Explore the advantages of Intranet.ai Mood by clicking here to learn more.
If your page is not already in edit mode, click Edit at the top right of the page.
Hover your mouse above or below an existing web part and you'll see a line with a circled +, like this:
Click on it and, in the web part search box, enter Mood to quickly find and select the Mood web part.
In this section, you need to specify the sources from which the web part will retrieve information.
In the first field, you need to insert the URL of the site where the list named Mood list is located.
In the Select the mood list field, you need to select Mood list from the drop-down menu. This is the list which contains the emoticons.
In the third field, you need to enter the URL of the site where the list named User mood record is located.
In the Select the list field, you need to select User mood record from the drop-down menu. This is the list where the moods selected by users are saved.
This section allows you to set display options.
Which view do you want to see?: here you can choose between two options: the User view allows users to select their daily mood, whereas the Admin view allows administrators to view the overall history of moods across the company.
You could adopt the User view on the home page of your intranet, and the Admin view in a dedicated sub-page. The specific features of the Admin view are explained below.
Do you want to hide the mood of the day section?: this option allows you to hide the section highlighting the most voted mood on the current day. The default option is No, but you can switch it to Yes to hide this section.
Hide report section?: this option allows you to hide the section displaying the history of your moods over the past week. The default option is No, but you can switch it to Yes to hide this section.
You also have three text boxes that allow you to choose a customized title for each section of the web part.
Enable scrolling?: if you activate this option, a scrollbar appears on the right-hand side of the web part. If you select Yes, you'll be able to choose the height of the web part. This way, you can set a fixed height and scroll up and down to see content. This may be useful if you have a lot of content to display and you don't want the web part to take up too much space.
As explained above, the Mood web part retrieves information from the list named Mood list. This section describes the steps to fill in the list.
First of all, click on the Settings icon on the top right of the page, then click on Site contents.
Scroll down and select Mood list.
Each item on this list is a mood. To add a new mood, click on the New button.
When you click on the New button, a panel appears with a number of fields to fill in. The fields marked with asterisks are the mandatory ones.
Title: enter the title of the mood. The title will appear under the emoticon in the first section of the web part.
For example, "Happy", "Sad", "Excited", "Angry", etc.
Description: here you can enter a short descriptive text. You will see the description when mousing over the emoticon.
Order: enter a number to choose the order in which the emoticons will be displayed.
Mood icon: to add an emoticon, you can choose an icon from the list available at this link and copy-paste the correspoding code into the Mood icon field.
Mood icon url: alternatively, you can create a custom image, upload it to a document library in your intranet (e.g., the Site Assets folder) and copy-paste the image URL into this field.
If you decide to create a custom icon, it is important that you adopt a square image. Good results are obtained with 50 x 50 images.
When you're done, click on Save.
When the configuration is complete, the web part looks like this:
The screenshot above shows the User view, which allows users to select their current mood. Continue reading to learn more about the Admin view, which is designed for administrators.
If you have a multilingual intranet, you may need to translate the data inserted in the Mood list into multiple languages. In particular, the fields to translate are Title and Description. This will allow you to configure Mood in different linguistic versions of the same page.
To carry out this translation activity, you need to create two additional fields for each language. Specifically, you need a Title field and a Description field with specific nomenclatures. The nomenclature to adopt is as follows:
IAIMTitle + language code
IAIMDescription + language code
This link offers a list of language tags. However, please use only lower case letters and no hyphen between the first and the second part of the tag.
For example, the language code for French is frfr. The complete nomeclature for the Title and Description fields would be:
IAIMTitlefrfr
IAIMDescriptionfrfr
A detailed explanation of the steps of this process is offered below:
To create an additional Title field, access the Mood list and click on +Add column. Select Text and click on Next.
In the Name field, enter the name of the column. Make sure to adopt the nomenclature described above, and save.
To create an additional Description field, click on +Add column. Select Multiple lines of text and click on Next.
In the Name field, enter the name of the column. Make sure to adopt the nomenclature described above, and save.
Now, select an item in the list, click on Edit, and add the translations by filling in the newly created fields. Then, click on Save.
Repeat these steps for all the items in the list.
It is important that you localize both columns (Title and Description).
When you create a column, it is fundamental that you adopt the correct naming convention. Then, you can edit the display name of the column to make it more user-friendly (e.g., "French Title", "French Description").
As mentioned in the introductory section, a "Mood history" page can be created for administrators to view the moods selected by all users on any given day. This is possible thanks to the Admin view, which is an alternative to the User view described above. The mood history is presented in the form of cards showing the profile picture of the user, their name, and the mood they chose on the selected day.
To build such a page, first of all you need to create a new page. To do so, take the following steps:
Click on the gear icon at the top right of the page, and then on Site contents.
Scroll down until you see the Site Pages folder and click on it.
Click on the SystemPages folder.
Click on New > Site Page to create an empty page.
Add a title to the page, and choose your preferred layout for the title area.
Add the Mood web part by following the steps described in the Add the Mood web part to a page section.
Then, configure the General settings section of the property pane as described in General settings.
Now, in the Display settings section, select the view you want to adopt. In this case, it is the Admin view.
Enable scrolling?: just like the User view, the Admin view allows you to activate a scrollbar. If you select Yes, you'll be able to choose the height of the web part. This means that you'll set a fixed height and scroll up and down to see the cards.
Do you want to choose the number of cards to show?: if you activate this option, you'll be able to choose the number of cards to display.
How many users do you want to show?: here you need to specify the number of cards to show. A Show other users button will appear, allowing you to display more cards.
The "Mood history" page looks like this:
As described above, the web part consists of cards showing the moods expressed by intranet users on a given day. By default, the web part shows the moods of the current day, but you can select a different date. You just need to click on the date box to open a calendar where you can choose any of the previous days.
The web part also features a search bar where you can search for a specific user or a specific mood.
If you type the title of a mood, you can see who chose that mood on the selected day.
If you type the name of a user, you can see what mood they expressed on the selected day.
The User mood record list requires a specific configuration so that intranet visitors can select their mood of the day. To learn how to configure this list, read the dedicated guide. In particular, please refer to the Second type of configuration section.
Click on the Edit button on the left of the web part to open the property pane, which has two sections: General settings and Display settings. See below for more information on each of these sections.
