Calendly

Article author
Memberstack Team
  • Updated

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.

Was this article helpful?

Comments

0 comments

Please sign in to leave a comment.