With the Calendly Smart Plug you can schedule meetings from within your Freshchat app. You should have an account with Calendly.
For instructions on how to add a smart plug, refer Working with Smart Plugs.
Sample code snippet:
<style>
#calendlyMain h3 {
margin-top: 10px;
}
.calendlyError {
text-align: center;
color: red;
padding-top: 5px;
font-weight: 700;
}
.calendly-inline-widget {
border: 1px solid black;
}
</style>
<div id="calendlyMain">
<h3>Calendly</h3>
<div class="calendly-user">
Calendly User : <input id="calendlyUserValue" type="text" name="LastName"> <button id="saveCalendlyId">Save</button>
<div class="calendlyError hide">User Name is Required</div>
</div>
<hr/>
<div class="contentDiv">
</div>
</div>
<script>
var calendlyWidget = (function($, window) {
if (window.CALENDLY_WIDGET_BETA) {
window.CALENDLY_WIDGET_BETA.setItUp(); // pass conversation / user info here
return window.CALENDLY_WIDGET_BETA;
}
var calendly = window.CALENDLY_WIDGET_BETA = {
setItUp: function() {
console.log('Set it UP');
$('#saveCalendlyId').click(function() {
console.log('Clicked');
var calendlyUser = $('#calendlyUserValue').val();
if (calendlyUser.length != 0) {
document.cookie = "calendlyUser="+calendlyUser;
$('.calendlyError').addClass('hide');
window.location.reload();
}
else {
$('.calendlyError').removeClass('hide');
}
});
var calendlyUser = this.getCookie('calendlyUser');
if (calendlyUser.length != 0) {
console.log('User Present');
$('#calendlyMain .calendly-user').addClass('hide');
$('#calendlyMain contentDiv').removeClass('hide');
this.showCalendlyWidget();
}
else {
console.log('User Not Preset');
$('#calendlyMain .calendly-user').removeClass('hide');
$('#calendlyMain contentDiv').addClass('hide');
}
},
initialize: function() {
console.log('Init');
var _self = this;
var URL = 'https://assets.calendly.com/assets/external/widget.js';
$.getScript(URL, function(response) {
console.log(response);
});
},
getCookie: function(cname) {
var name = cname + "=";
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(';');
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
},
showCalendlyWidget: function() {
console.log('Showing Calendly');
var userName = this.getCookie('calendlyUser');
var URL = "https://calendly.com/"+userName;
var html = '<div class="calendly-inline-widget" data-url="'+URL+'" style="min-width:290px;height:480px;"></div>';
$('.contentDiv').html(html);
Calendly.initInlineWidgets();
}
};
calendly.initialize();
setTimeout(function() {
calendly.setItUp();
}, 100);
return calendly;
})(jQuery, window);
</script>