You can use the new Memberstack 2.0 front-end API and the following code to pass member data into Calendly.
Launch Calendly from a Button (simple)
Place the following snippet on any page where you want to launch Calendly's external scheduling URL from a button:
<script>
window.$memberstackDom.getCurrentMember()
.then(({ data: member }) => {
if(member) {
let email = member.auth.email
let name = member.customFields["name"]
let baseURL = "https://calendly.com/nicolas-memberstack/15min"
let caledlyBtn = document.getElementById("calendly-button")
caledlyBtn.href = `${baseURL}?email=${email}&name=${name}`;
}
})
</script>
Prefilling Custom Questions w/ Member Data (advanced)
<script>
window.$memberstackDom.getCurrentMember()
.then(({ data: member }) => {
if(member) {
let email = member.auth.email
let name = member.customFields["name"]
let baseURL = "https://calendly.com/nicolas-memberstack/15min"
let caledlyBtn = document.getElementById("calendly-button")
caledlyBtn.href = `${baseURL}?email=${email}&name=${name}&a2=${memberid}`;
}
})
</script>
Embedded Inline Calendly Widget
Place the following snippet on any page where you want to render the inline Calendly embedded widget.
<script>
window?.$memberstackDom.getCurrentMember().then(({ data: member }) => {
let memberEmail = member.auth.email
let memberName = member.customFields["name"]
Calendly.initInlineWidget({
url: 'https://calendly.com/YOUR_LINK/30min',
prefill: {
name: memberName,
email: memberEmail,
customAnswers: {
...
}
}
});
}).catch(err => console.log(err)) // catch errors and log them to console
</script>
Note: Console logging the error will show an error in the browser’s developer console. This is helpful for debugging issues.
Comments
0 comments
Please sign in to leave a comment.