Impact Block

Impact is a gamification dashboard that can be embedded within a customer hosted website and styled to match your brand standards. The Impact block showcases missions, leaderboards, and other program and user activity. It uses our AI driven mission recommendation engine to dynamically display missions to the user that are relevant and engaging as they journey through the program.

Nitro Impact has been designed to be embedded on a site at a fixed height. This ensures that the block looks native to a page at all viewport sizes. The block is mobile responsive and breaks down into a tabbed design on smaller screens.

Desktop	Mobile

Placement is pre-configured and cannot be changed. You can configure some settings within the block and add visual elements to a mission, point category, level, and theme.

1. Open Nitro Studio > Integrate > Blocks.

2. Click New > Impact.

3. Use the header bar to edit the block's name. The name does not need to be unique.

4. Use the Settings > Header drawer to show award account and user settings.

Field	Description
Display award account	Select to show the user's current balance for the point category tied to your award account and a redeem button to access the Global Rewards Marketplace.
Display unenrolled message	Select to show a message when the user is not enrolled in the award account. When not selected, award account information will be hidden for unenrolled users.
Display OTS Claim button	If your program includes On The Spot cards, select to display a Claim button where users can redeem their cards.
Allow users to change their profile image	Select to allow users to edit their profile image.
Allow users to change their first, last, and preferred names	Select to allow users to edit their first, last, and preferred name.

5. Use the Settings > Featured drawer to set a default image and message to show in the Featured section when no featured missions are available to the user.

Field	Description
Title	The title to display when the user has no featured missions available.
Description	The description to display when the user has no featured missions available.
Background Image	The image to display when the user has no featured missions available. You can upload an image or link to an image on a server that Nitro can access.

6. Use the Settings > Leaderboard drawer to add leaderboards to the block. Leaderboards are optional. The leaderboard section is hidden until you add a leaderboard to the block.

Field	Description
Return Count	The number of leaders to return. The return count applies to all leaderboards.
Leaderboards	Add one or more leaderboard layouts to the block. When multiple leaderboards are added, a dropdown list displays in the block so users can toggle between leaderboards. Click Add Leaderboard. Select a leaderboard layout. Click Add. Repeat steps 1-3 to add all leaderboard layouts. If necessary, drag and drop the leaderboard tiles into the order you want them to appear in the dropdown list.

7. Use the Languages drawer to customize or localize the text in the block.

Field	Description
Download	Downloads a language file containing the block's text keys and values. If no language file has been uploaded to Nitro, a file containing the default keys will be downloaded. If a language file has already been uploaded to Nitro, that file will be downloaded. If new features have been added since you uploaded a custom language file, create a new block, download the default language file, and manually merge the new keys and values into your custom file.
localization.json	The language file used to customize the text in English or localize into a supported language. To customize any text string (button, section name, tab name, etc.), download the language file, edit the values for your custom text, then upload the new file and save. Show me an example To localize the block into another language, see Localization and follow the steps outlined there. After uploading a localization file, you can preview the changes in another language by selecting a locale in the list.

8. The Experimental drawer is used to enable features for beta testing. Do not enable these features in a Production environment unless you have discussed the status with your account team and are aware of any risks.
9. Click Save ().

If you're editing an existing block, changes are pushed to any site where the block is embedded and also reflected in the preview.

Embed the Block

After you've configured your block, you can embed it on your site. Once embedded, any updates made to the block in Nitro Studio will automatically be pushed to the site with no additional code changes required.

See Embed a Block for step-by-step instructions.

See also

Blocks

Styling blocks