Steps to Install your Integration
1. Load mmob javascript snippet
On your web application, add this javascript snippet in the header of the page that will include the mmob deployment.
<!DOCTYPE html>
<html lang="en">
<head>
...
<script src="https://assets.mmob.com/js/mmob-snippet.min.js"></script>
</head>
...
</html>
2.Place the container that will host the integration
HTML
First, add a target DOM element to your page. This is the containing element that the integration will be injected into. It will be loaded using an iFrame that will have width: 100%
and height: 100%
.
In the example below, we've created an empty div with the id #mmobIntegration
, this will be our target div.
<main class="your-page">
<div id="integration"></div>
</main>
CSS & Layout
You will have to control the integration size by styling your containing div
.
Let's say for example you want to have your integration at full page width and height. You could style your container like so:
width: 100%;
height: 100vh;
and if you need to accommodate a header:
width: 100%;
height: calc(100vh - 70px); // For a header that is 70px in height.
3. Load the integration into the container
After the container, call the mmob snippet to load the integration.
Here's an example on how it looks like:
mmob.init({
customerInfo: {
email: customer email,
first_name: 'Stephen',
surname: 'Hayes',
gender: 'male',
title: 'Mr',
building_number: '81',
address_1: 'Miller Street',
town_city: 'Hull',
postcode: 'HG45BU',
dob: '1968-05-30T21:12:22.275Z',
},
// integration configuration
cp_id: 'cp_XXXXXXXXXXXXXXXXXXXXX',
cp_deployment_id: 'cpd_XXXXXXXXXXXXXXXXXXXXX',
location: '#integration',
marketplace_url: 'https://integration.ef-hub.com',
});
cp_id
andcp_deployment_id
will be provided to youlocation
is the id of the DOM object that will contain your integration
Anonymous users
If you decide to not share any information about your users, you can still use the mmob integration. Make sure that the customer information is empty. mmob will then create a unique anonymous user for each user that starts a journey.
mmob.init({
customerInfo: {},
// integration configuration
cp_id: 'cp_XXXXXXXXXXXXXXXXXXXXX',
cp_deployment_id: 'cpd_XXXXXXXXXXXXXXXXXXXXX',
location: '#integration',
marketplace_url: 'https://integration.ef-hub.com',
});
Contact us
Contact us at contact@mmob
Was this page helpful?