Installing the Mento Social Plugin
This guide provides detailed instructions on how to install the Mento Social Plugin on your website. Below you will find comprehensive explanations for each configuration variable involved in the setup process.
Certain variables are provided by us when you sign up for the Mento Social Plugin:
Each configuration variable plays a specific role in the functionality of the Mento Social Plugin:
This is the identifier for a panel which categorizes questions. A single customer can have multiple panels if they have different sites or different types of content. This value will initially be provided by us and can be configured in the customer portal at mento.social later.
Your unique identifier for the logged-in user. This can be e.g. the logged in users subscription number and has to be unique. This ID helps the plugin to manage user sessions and interactions uniquely across sessions and make sure that e.g. one user only can answer a question one time.
Your customer name as registered with us. This is used to personalize the plugin experience to match your brand identity.
An MD5 hash generated from your user ID, customer name, and a secret provided by us. This hash is used for security purposes to ensure that interactions with the plugin are authenticated and originate from your site.
An optional URL to your subscribe page. If no user ID is provided and anonymous voting is disabled, the plugin will display a call to action encouraging users to subscribe to your service. This helps convert anonymous site visitors into registered users.
The Mento Social Plugin provides a personalized experience for both logged-in and anonymous users on your website. Here's how it works:
window.mentoUserId. This ID should be generated on the backend and be unique to each user (we recommend a UUID). Additionally, the MD5 hash must be calculated on the backend using this ID and the provided secret. The hash ensures secure communication between the plugin and your site and verifies user actions, allowing logged-in users to respond to questions.window.mentoUserId. Instead, the plugin will display a Call-to-Action (CTA) using the link provided in window.mentoCustomCtaUrl, prompting users to subscribe or log in to participate in the questionnaires. This is an effective way to encourage user engagement and convert visitors into registered users.It's not necessary to include window.mentoUserId. We will generate a new unique ID for each anonymous user, and store it in the browser's local storage.
Generate an MD5 hash using your user ID, customer name, and your unique Mento secret. This can be done with the following script in a Node.js environment:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import { MD5 } from "crypto-js";
// If you have logged in user
export function generateMD5Hash(userId, organizationName, mentoSecret) {
const combinedString = `${userId}${organizationName}${mentoSecret}`;
const secretHash = MD5(combinedString).toString();
return secretHash;
}
// If user is not logged in
export function generateMD5Hash(organizationName, mentoSecret) {
const combinedString = `${organizationName}${mentoSecret}`;
const secretHash = MD5(combinedString).toString();
return secretHash;
}1
2
3
4
5
6
7
import { MD5 } from "crypto-js";
export function generateMD5Hash(organizationName, mentoSecret) {
const combinedString = `${organizationName}${mentoSecret}`;
const secretHash = MD5(combinedString).toString();
return secretHash;
}Unsure which script to use? If you have login capabilities on your site, then we should have configured your customer account to use the first script. If you don't have any login capabilities, then you should use the second script.
If you're unsure, please contact us at info@mento.social.
Add the script tags to your HTML as shown below, replacing placeholders with your data:
1
2
3
4
5
6
7
8
9
<script>
window.mentoPanelId="your_panel_id"; // This ID categorizes questions into panels. Configurable later.
window.mentoUserId="your_user_id"; // We recommend using a UUID for this.
window.mentoOrganizationName="your_organization_name"; // Provided by us.
window.mentoSecretHash="your_generated_md5_hash"; // Generate as instructed above.
window.mentoCustomCtaUrl="your_custom_cta_url"; // Optional. Links to your subscribe page if user is not logged in.
</script>
<script src="https://www.mento.social/static/js/main.mento.js"></script>
1
2
3
4
5
6
7
8
<script>
window.mentoPanelId="your_panel_id"; // This ID categorizes questions into panels. Configurable later.
window.mentoOrganizationName="your_organization_name"; // Provided by us.
window.mentoSecretHash="not_logged_in"; // Add any hardcoded value here
window.mentoCustomCtaUrl="your_custom_cta_url"; // Links to your subscribe page.
</script>
<script src="https://www.mento.social/static/js/main.mento.js"></script>
1
2
3
4
5
6
7
8
<script>
window.mentoPanelId="your_panel_id"; // This ID categorizes questions into panels. Configurable later.
window.mentoOrganizationName="your_organization_name"; // Provided by us.
window.mentoSecretHash="your_generated_md5_hash"; // Generate as instructed above.
window.mentoCustomCtaUrl="your_custom_cta_url"; // Optional. Links to your subscribe page if user is not logged in.
</script>
<script src="https://www.mento.social/static/js/main.mento.js"></script>
If you're unsure, please contact us at info@mento.social.
After installing, open your site and check the browser console for any errors. Ensure the plugin is functioning correctly.
Contact our support team for assistance if you encounter issues.