Web
You can install the SDK using a small snippet of code that you paste on your site to asynchronously load the SDK. Setting up Blitzllama involves,
- Integrating the SDK: installing and initialising the SDK
- Managing users: creating users and adding user attributes
- Creating triggers: setting up code/no-code triggers on the dashboard
Paste the below code snippet just before the
</head> tag, replacing api_key with the API Key of your workspace. <!-- Start of Blitz client code snippet -->
<script type="text/javascript">
var exports = { __esModule: true };
window._blitzQueue = window._blitzQueue || [];
function blitz() {
_blitzQueue.push(arguments);
}
(function () {
var a = document.createElement('script');
a.type = 'text/javascript';
a.async = !0;
a.src = 'https://cdn.blitzllama.com/js/blitz.js';
var b = document.getElementsByTagName('script')[0];
b.parentNode.insertBefore(a, b);
})();
blitz('init', "api_key");
</script>
<!-- End of Blitz client code snippet -->
NPM
Yarn
npm i blitzllama-js
yarn add blitzllama-js
Then, in your application, initialize Blitzllama
import blitz from 'blitzllama-js';
//initialize blitzllama SDK. Place this as higher in your app as possible
blitz.init(api_key);
It is mandatory to create users using unique user ids. Not only does it provide a consistent experience across platforms, but also prevents users from being surveyed multiple times. user_id has to be a string.
Create a user with a unique user_id to prevent any inconsistencies.
HTML Script
NPM
blitz('createUser', 'user_id');
blitz.createUser('user_id');
Attributes are additional data points about users, that are used for creating targeted user cohorts on the Blitzllama dashboard. Attributes are optional and not required to launch a micro-survey.
Allowed data_type values are "string", "number", "date", "boolean".
HTML Script
NPM
blitz('setUserAttribute','attribute_name','attribute_value', 'data_type');
blitz.setUserAttribute('attribute_name','attribute_value', 'data_type');
You can update multiple user attributes which are in key-value pairs (javascript object). It is suggested if user attributes have to be updated too frequently or all at once.
HTML Script
NPM
blitz('setUserProperties', {'property_name': 'value', age: 25, place: 'chennai'});
blitz.setUserProperties({'property_name': 'value', age: 25, place: 'chennai'});
You can provide Blitzllama with the user's email address. Email address is not mandatory for web micro-surveys.
HTML Script
NPM
blitz('setUserEmail', 'user_email');
blitz.setUserEmail('user_email');
You can also provide Blitzllama with the user's name. It can be used to make the questions more personalised. The User name is, again, not mandatory to launch surveys.
HTML Script
NPM
blitz('setUserName', 'user_name');
blitz.setUserName('user_name');
You can provide Blitzllama with the language you wish to survey your user. It is not mandatory to launch surveys.
HTML Script
NPM
blitz('setSurveyLanguage','language_code');
blitz.setSurveyLanguage('language_code');
You can call this function, if you wish to stop tracking the user & their events.
Html Script
NPM
blitz('logout');
blitz.logout();
Triggers, when initiated, display the micro-survey to the users. You can add triggers to all components - button press, screen open, or screen close - that are critical in a user's journey.
There are two methods to create a trigger on the dashboard: no-code and code triggers.
- Page URLs: Add the URL of the specific page. These are useful for launching micro surveys on page opens.
- CSS Selector: Add the classname of the CSS component. Useful for triggering micro surveys after user actions such as button clicks.
You can provide Blitzllama with the code triggers to setup more use case specific ways to launch surveys.
HTML Script
NPM
blitz('triggerEvent', 'trigger_name');
blitz.triggerEvent('trigger_name');
You can also use backend events to launch in-app surveys. Check out https://documentation.blitzllama.com/connections/backend-trigger for more details.
Blitzllama provides a survey complete event that you might find useful to trigger certain actions in your application.
HTML Script
NPM
blitz('subscribeEvent', 'survey_completed',
(data) => { console.log(data.detail); });
blitz.subscribeEvent('survey_completed',(data) => { console.log(data.detail); }));
[{
question_order: 1,
question_text: "How well do you expect Blitz Demo to meet your needs?",
question_type: "single_select_feedback",
response: ['One'] //array value for select questions & string for other question types
}, ...]
Before every release, we extensively test our SDK in multiple websites and browsers for crashes and performance issues. Blitzllama's SDK has negligible performance impact and below are the stats for the latest SDK version.
- Speed The script is loaded asynchronously, so it does not impact website load times or scroll performance. We load our SDK in two separate files (i) controller.js (10KB) loads for all users, and (ii) microsurveys.js (250KB) downloads only in sessions which have micro surveys active that particular user.
- Availability and Load time The Blitzllama client-side script is hosted on a global CDN. This allows for the fastest load times by hosting the script as close to the users as possible.
- CPU usage A negligible increase of < 0.4% CPU usage only when the micro survey is on-screen.
Last modified 1mo ago