In-Web & App survey (micro survey)
What is it about?
Capture feedback on your website(s) and/or inside your App(s)
This documentation page will help our customers' developer to set up properly the survey(s).
Note: That it is a new feature and needs to be requested and set up via our Customer Success/Support team as a first step.
1. Parameters available
This is a list of parameters available for the survey. Those can be defined by customers and applied during implementation.
Modal (
pop-up): Positions the widget in the middle of the screen while hiding screen content.Footer banner (in-web survey only): Positions the widget at the bottom of the screen while still showing the screen content. Two options are available:
The footer can be persistent (
footer) orThe user is able to minimize the widget and click back into it at a later point (
persistent-footer).
Define how you want to design your survey:
Primary color: Change the color of the header and primary button background.
Header + Primary button text color: Change the color of the text in the header and primary button background.
Paragraph text color: Change the color of the text for messages.
Rating scale format (for NPS, CES, or CSAT questions)
button: Display the rating scale as numbers.circle: Display the rating scale as circles.star: Display the rating scale as stars.emoji: Display the rating scale as emoticons.
The frequency depends on the user’s action: Did the user close or answer the survey?
A period can be configured to show the survey once or multiple times for each action.
Numeric value e.g “1” (day) or “once” expected
Examples:
"
answered": 3, "closed": 8If answered, the survey shows up again after 3 days
If closed, the survey shows up again after 8 days
"
answered": once, "closed": 0After answering the first time, the survey doesn't show up again
After closing, the survey will show up again
"
answered": 0, "closed": onceAfter closing the first time, the survey doesn't show up again
After answering, the survey will show up again
Setting default: "answered": 1, "closed": 1
Note: Cookies are re-set each time changes are made to the SDK. It means the survey will show up again to the end-user.
The “close” frequency is not applicable on the “persistent-footer” type.
Display the survey:
After clicking a button
manualAfter the page loads
onLoadAutomatically open the questionnaire when the page is
loaded.
Delay on the page
delay:<number>Delay amount used for automatically triggered after the user has been on the page for the given time in seconds.
Scrolling amount
scroll:<number>Example: when the user scrolls to the middle of the page, the pop-up appears
When the user is about to abandon the page (in-web survey only)
onPageLeaveWhen cursor is on the top of the page
2. Web & app SDKs - Set up guide
This part is the technical set up guide to help the developers to implement the survey inside the product (website or application)
Quickstart
A questionnaire is created in the Customer Alliance platform (with a questionnaire ID).
This questionnaire ID is available on CA platform, and is needed for the setup.
It can be shared by the customer directly, or by our customer support team.
Customers developers don’t need access to the CA platform.
Recommended: Notify our customer support team and let them know the domain(s) of the websites you want to use the questionnaire on so we can restrict it’s usage
Include the questionnaire Javascript SDK into your website before the closing body tag:
<html>
...
<body>
...
<script src="https://questionnaire.customer-alliance.com/ca/embedded/sdk.js"></script>
<script>
window.customerAllianceQuestionnaireSdk.init({
// options that are explained further below
});
</script>
</body>
</html>API Reference
window.customerAllianceQuestionnaireSdk.init(params)
Please run this method before making the call to CA.open(), if you want to set-up the SDK.
Parameters
All parameters are optional.
Name | Type | Description |
|---|
Name | Type | Description |
|---|---|---|
params | object | A collection of initialization parameters that control the setup of the SDK. |
questionnaireID | string | Questionnaire ID from the CA portal. This parameter is only optional if trigger For others triggers that don’t need a call to the |
type | string | Accepted values are:
This controls the way to show the questionnaire. As a pop-up or footer overlay. |
primaryColor | string | Sets color of title bar background and buttons. e.g. #3B62B2 or black |
primaryTextColor | string | Sets text color of title bar background and buttons. e.g. white or #FFFFFF |
ratingType | string | Accepted values are circle, star or button
Rating is shown as mentioned by the type. |
frequency | string |
|
trigger | string | Accepted values are:
|
attributes | object | JSON object with string values. Custom data that will be associated to any submitted questionnaire result and is visible on our platform. |
Example code:
window.customerAllianceQuestionnaireSdk.init({
type: 'pop-up',
primaryColor: '#3B62B2',
primaryTextColor: 'white',
frequency: {
answered: 3,
closed: 8
},
trigger: 'delay:100',
ratingType: 'star',
questionnaireID: 'some_questionnaire_id',
attributes: {
key1: 'value1',
key2: 'value2'
}
});
window.customerAllianceQuestionnaireSdk.open(optionalQuestionnaireId)
Shows the questionnaire as per the configured or default init options.
Name | Type | Description |
|---|
Name | Type | Description |
|---|---|---|
questionnaireID | string | Questionnaire ID from the CA portal. Optional value only if configured in CA.init(). |
Example code:
window.customerAllianceQuestionnaireSdk.open();
// or
window.customerAllianceQuestionnaireSdk.open('some_questionnaire_id')Note: questionnaireID can be found on the CA platform in this section of the account:
Types of Questionnaire
Pop-up
Footer
Persistent-footer
Shows a button in the footer as shown below: Upon clicking on it, the footer questionnaire is shown and clicking on close within the footer questionnaire shows the footer button again