If you're using Vue.js for your website or application, you can easily integrate the Akece live chat widget to talk to your visitors in real time. To do so, simply add the widget script directly into your project’s index.html
file.
1. Get the Widget Script
You can find the widget script in the settings of your Website inbox.
To access it:
-
Go to Settings → Inboxes
-
Click the Configure link for the Website inbox
-
Open the Configuration tab
If you haven't created a Website inbox yet, follow this guide to learn how to set one up.
2. Copy the Generated Script
Copy the script shown in the configuration tab. It should look similar to this:
<script>
(function(d, t) {
var BASE_URL = "https://dash.akece.com";
var g = d.createElement(t),
s = d.getElementsByTagName(t)[0];
g.src = BASE_URL + "/packs/js/sdk.js";
g.defer = true;
g.async = true;
s.parentNode.insertBefore(g, s);
g.onload = function () {
window.akeceSDK.run({
websiteToken: "YOUR_TOKEN_HERE",
baseUrl: BASE_URL
});
};
})(document, "script");
</script>
Make sure to replace "YOUR_TOKEN_HERE"
with the actual token from your Website inbox.
3. Paste the Script into index.html
Open your Vue project and edit the file located at:
/public/index.html
Paste the script just before the closing </body>
tag, like this:
<body>
<noscript>
<strong>Please enable JavaScript to view this site properly.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<!-- Akece Widget Script -->
<script>
(function(d, t) {
var BASE_URL = "https://dash.akece.com";
var g = d.createElement(t),
s = d.getElementsByTagName(t)[0];
g.src = BASE_URL + "/packs/js/sdk.js";
g.defer = true;
g.async = true;
s.parentNode.insertBefore(g, s);
g.onload = function () {
window.akeceSDK.run({
websiteToken: "YOUR_TOKEN_HERE",
baseUrl: BASE_URL
});
};
})(document, "script");
</script>
</body>
Again, replace "YOUR_TOKEN_HERE"
with your actual token.
4. Confirm the Installation
After saving your changes, publish your project or reload your site locally. The Akece widget should now appear automatically on every page.
Need help configuring the widget in your Vue.js project?
We’re here to help:
📩 [email protected]
📱 @akece.ai