<!-- Mount point -->
<div id="not-root"></div>
<script src="/lib/main.js"></script>
<script>
Webform.mount({
parentElement: 'body', // Mounting selector
triggerSelector: '[href="#open-contact-form"]', // selector to trigger opening of modal window
searchOptions: {
accountId: 'SHELF_ACCOUNT_ID',
shelfDomain: 'api.shelf.io',
intentGroupId: 'pure-cloud-demo', // Shelf intentGroupId
searchIntentGroupId: 'pure-cloud-demo' // Shelf intentGroupId for free input
},
categories: [
{
//What user see on dropdown
label: 'What is the Difference Between a Loan and a Lease?',
//Possible terms for shelf search
intent: 'What is the Difference Between a Loan and a Lease?'
}
]
});
</script>
- install dependencies
yarn run-widget
ornpm run run-widget
- open browser in
http://localhost:8080/widget-test.html
Check src
folder with widget code, change and run yarn build-widget
src # Exports + components
├── api # API calls for Shelf
├── i18n # Localization
└── types # TS types for every component
You don't need intent setup, just libraryIds(you can specify multiple) and labels in dropdown
<!-- Mount point -->
<div id="not-root"></div>
<script src="/lib/main.js"></script>
<script>
Webform.mount({
parentElement: 'body', // Mounting selector
triggerSelector: '[href="#open-contact-form"]', // selector to trigger opening of modal window
searchOptions: {
accountId: 'SHELF_ACCOUNT_ID',
libraryIds: ['LIBRARY_1', 'LIBRARY_2']
},
categories: [
{
//What user see on dropdown
label: 'What is the Difference Between a Loan and a Lease?',
//Possible terms for shelf search
intent: 'What is the Difference Between a Loan and a Lease?'
}
]
});
</script>