You can use the 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
No comments yet. Start the conversation below.
Please sign in to leave a comment.