Setup
This reference document will allow you to customize and launch a Whisbi widget for your company.
Name | Description | Required |
---|---|---|
config whisbi.WhisbiConfig | The configuration of your Whisbi widget | Mandatory |
whisbi.js
var conf = {
version: '1.32.0',
api: {
apiKey: 'Your API key',
primarySeed: 'Your primary seed',
secondarySeed: 'Your secondary seed, or false if not applicable',
mediaGalleryId: 'Your Media Gallery ID',
legalReference: 'Reference to get a unique pack of legal agreements'
simplyBook: { company: '', apiKey: '' },
playerText: '',
chatbotId: '',
enableAbr: false
},
general: {
language: 'en',
languageVariation: 'fm',
textsURL: '',
texts: {
companyName: '',
privacyPolicy: ''
},
privacyPolicyURL: '',
googleAnalytics: true,
googleAnalyticsClientId: '',
enableWhisbiLink: true,
styles: {
direction: 'ltr',
theme: '',
fonts: [
{
name: 'family=Nunito+Sans', googleFont: true
}
],
fontFamily: 'Nunito Sans',
textColor: '',
linkColor: '',
primaryColor: '',
primaryTextColor: '',
secondaryColor: '',
secondaryTextColor: '',
buttonRadius: '',
header: {
fontFamily: '',
fontSize: '',
fontWeight: '',
backgroundColor: '',
textTransform: '',
textColor: ''
},
floatingButton: {
borderColor: '',
collapseType: 'button',
onDesktop: {
marginY: '12px',
marginX: '12px'
},
onMobile: {
marginY: '12px',
marginX: '12px'
}
},
titles: { fontFamily: '', fontWeight: '', fontSize: '' },
inputs: {
fontFamily:
'\'Open Sans\', \'Helvetica Neue\', \'Helvetica Light\', \'Helvetica\', Arial, sans-serif',
}
}
},
oneToMany: {
firstHLC: false,
visibilityType: 1,
oneToOneDisplay: false,
autoOpen: {
onDesktop: { enabled: false, closeable: true },
onMobile: { enabled: false, closeable: true }
},
disableLike: false,
maxInputLength: 140,
chatbot: {
minimumTime: 10,
minimumChats: 0,
externalURL: 'https://www.mycompany.com/',
pictureURL: '',
closeOnClick: true
},
texts: {
header: 'LIVE VIDEO CHAT',
liveHelpRibbon: '',
floatingButton: {
default: {
body: 'Do you have questions? Ask me now and get answers within few seconds!',
yesCTA: 'Yes',
noCTA: 'Not now'
},
returning: {
body: 'Can\'t find what you need? Ask me your questions now, I\'m here to help!',
yesCTA: 'Ask now',
noCTA: 'Maybe later'
}
},
chatbot: {
firstMessage: {
body: '',
bodyNoName: '',
yesCTA: '',
noCTA: ''
},
secondMessage: {
body: '',
bodyNoName: '',
yesCTA: ''
}
}
},
styles: {
body: {
backgroundColor: ''
},
floatingButton: {
blinkLabel: {
backgroundColor: '',
textColor: '',
}
},
liveHelpRibbon: {
backgroundColor: '',
textColor: '',
}
videoOverlay: '20%'
}
activeViewerForm: {
name: {
maxLength: 20,
maxWords: 2
}
}
},
oneToOne: {
pin: false,
cmb: false,
onDesktop: {
connectForm: true,
inbound: true
},
onMobile: {
connectForm: false,
inbound: true
},
phoneType: ''
visibilityType: 1,
ratingType: 'nps-emoji',
defaultUserPictures: [],
fullSizeWebcam: false,
callCenters: [],
autoOpen: {
onDesktop: {
enabled: false,
closeable: true,
},
onMobile: {
enabled: false,
closeable: true,
}
},
texts: {
header: '',
formTitle: '',
liveHelpRibbon: '',
floatingButton: {
default: {
body: 'Do you have questions? Ask me now and get answers within few seconds!',
yesCTA: 'Yes',
noCTA: 'Not now'
},
returning: {
body: 'Can\'t find what you need? Ask me your questions now, I\'m here to help!',
yesCTA: 'Ask now',
noCTA: 'Maybe later'
}
},
outOfHours: {
mainTitle: '',
subTitle: '',
},
thankYou: {
mainTitle: '',
subTitle: '',
}
},
styles: {
body: {
backgroundColor: '',
backgroundImage: {
url: '',
repeat: 'repeat',
size: 'auto',
position: 'center'
}
},
liveHelpRibbon: {
backgroundColor: '',
textColor: '',
},
floatingButton: {
onMobile: {
maxUserPictures: 1
}
}
},
form: {
description: {
imgUrl: '',
text: ''
},
name: {
visible: true,
mandatory: false,
},
email: {
visible: true,
mandatory: false,
},
phone: {
visible: true,
mandatory: false,
},
conversationalMode: true,
availableCountryCodes: [],
defaultCountryCode: '',
preferredCountryCodes: []
},
chatbot: {
configURL: '',
outOfHoursConfigURL: ''
},
schedule: {
name: {
visible: true,
mandatory: false,
},
email: {
visible: true,
mandatory: false,
},
availableHours: [
[['10:00','17:00']], //Monday
[['10:00','17:00']],
[['10:00','17:00']],
[['10:00','17:00']],
[['10:00','17:00']],
[], //In this case Saturdays are non-working days
[['10:00','13:00'], ['14:00','16:00']] //Sunday
],
timeInterval: 30,
maxBookingRange: 60,
exceptions: {
'01-04-2017': [
['12:00','14:00'],
['16:00','18:00']
],
'25-12-2017': [] //This day will be a non-working day
},
dateFormat: 'dd-mm-yy',
timeFormat: 'HH:mm',
firstDayOfWeek: 1
emailTo: ''
}
},
events: {...}
};
whisbi.setup(conf);