Calendly

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.