You've created your brand-new GTC/UGC widget and can't wait to show it off to the world?
So are we! 🎉
We'll show you how it's done here and in the video below 🌈
First, we need to integrate our little script in the classic way.
See you (not in a strange land) but 👉 here 👈
A powerful, easy-to-integrate API
Integrating the consent widget requires just one line of code. You'll see how simple it is, even if you don't know anything about it.
Our JavaScript API allows you to easily integrate various interactions on your site's pages: display the contract, check whether the user has already consented, force revalidation, etc.
On the API side, from server to server, we enable you to query our proof-of-consent registry in real time to retrieve the consent information attached to an identifier on your site.
Getting started 🚦
Make sure the user token corresponds to the logged-in user.
<script type="text/javascript">
window.axeptioSettings = {
clientId: '<your client id>',
token: '<?php echo $user->uid ?>' };
(function(d, s) {
var t = d.getElementsByTagName(s)[0], e = d.createElement(s);
e.async = true; e.src = "//static.axept.io/sdk.js";
t.parentNode.insertBefore(e, t);
})(document, "script");
</script>
Then register a handler to access the Axeptio SDK once it's loaded.
<script type="text/javascript">
window._axcb = window._axcb || [];
window._axcb.push(sdk => {
// Inside this function you will be able to access
//Axeptio SDK's public methods
});
</script>
There are several possible uses 🧮
1. Open a single contract
sdk.openContract('terms_of_sale').then(function(consent){
// we will enter this promise resolve function once the consent proof
// has been saved inside the Axeptio DB. Both the widget and overlay
// will be gone at this time.
})
Note that by default, this method will open the latest version of the contract. The latest version is the version that was published by the administrator when the project was last published. For test purposes, for example, you may want to pass a specific version. To do this, you can pass an additional parameter and pass the version tag like this:
sdk.openContract({name: 'terms_of_sale', tag: '2.4.0'})
openContract will always ask for consent, even if the user has already consented to the current version.
2. Ouvrir plusieurs contrats
Afin de vérifier plusieurs contrats à la fois, vous devez passer un tableau contenant les noms ou les identifiants des contrats sous forme de chaîne ou d'objets ContractSignature
/**
* @typedef ContractSignature
* @property {String} name
* @property {String} [tag]
* @property {String} [consentFor]
*/
sdk.checkContracts(
['terms_of_sale', {name: 'privacy_policy', tag: '1.2.1'}]
).then(function(contracts){
// we will enter this
});
checkContracts will ask for consent if necessary.
3. Consent for a third party (mandate)
To request another person's consent from the logged-in user, simply pass the person's identifier as a consentFor property in the checkContracts, openContracts or openContract methods.
const someoneElseIdentifier = '<?php echo $consentingUser->subUser->id; ?>'
sdk.checkContracts([
{ name: 'terms_of_sale', consentFor: someonElseIdentifier }
]).then(function( contracts ){ ... });
4. Open contract in “read-only” mode
If you want to let the end user read a contract (for example, one he has already accepted), simply use the openContract function with the {readOnly : true} option.
5. Contract opening via URL
You can add the opening of a contract from the url by passing axeptio_contract as the query string key, with the value being either the id or the name of the contract.
You can also open the widget directly on a specific section by passing #{sectionId} in the url.
For example : https://www.axeptio.eu/fr?axeptio_contract=terms_of_use_fr#91aaef13-12a5-49c8-8518-47e56f801be6
Use case
Additional function 🌟
Use custom variables in section titles and texts and in the diff screen.
In the contract signature, you can add custom variables that will be available for display in the diff screen (used to display differences with the previous version of the contract).
sdk.checkContracts([
{name: 'product_1', variables: { contractNo: '123456', customerName: 'John Doe' }}
])
With checkContracts:
Use the following syntax to call any variable previously sent, in a section content area or in diff screen.
Mme / M. {{ customerName }}
N° contrat : {{ contractNo }}