Install the Messenger with Javascript
The Messenger component renders a chat bubble which, when clicked, opens up a modal from which the users can contact you.
This is what the Messenger component looks like when it's open, with customization options provided:
1. Get the API key
To get started, you need to get your API Key by going to your dashboard and navigating to your Settings > API Key page.
2. Install as a module
To import the makkuro-js package, run the following:
1
npm i @makkuro/makkuro-js
Then, in your code, you can run the makkuro.messenger() function like this, by replaching <YOUR_PUBLIC_KEY> with the public key you retrieved from the previous step.
1
2
3
4
5
import makkuro from '@makkuro/makkuro-js'
makkuro.messenger({
publicKey: '<YOUR_PUBLIC_KEY>'
})
🎉 You should now be able to see the messenger render in your app!
You can have a look at the reference for the rest of the arguments or move to the next step.
2. Or, install via <script>
You can, alternatively, include the Makkuro-js script in your HTML file like this.
1
2
3
4
5
6
7
<script type="module" async src="https://cdn.jsdelivr.net/npm/@makkuro/makkuro-js@latest/dist/index.js"></script>
<script>
makkuro.messenger({
publicKey: '<YOUR_PUBLIC_KEY>'
})
</script>
As before, you need to replace <YOUR_PUBLIC_KEY> with the public key you retrieved from the previous step.
🎉 You should now be able to see the messenger render in your app!
You can see that it looks different from the first image, so let's customize it a bit.
You can have a look at the reference for the rest of the arguments or move to the next step.