We have recently refreshed our branding across our offerings and changed the names of our pricing plans. If you have signed up before Aug 9, 2021, please click Previous plans to view your applicable plans.
We assure you that this change will not impact your product experience, and no action is required on your part.


You can convert a conversation in Freshchat into a Zendesk ticket by adding and enabling the following code snippet as a smart plug.


For instructions on how to add a smart plug, refer Working with Smart Plugs.


Note:

You need to replace the domain, emailAddress and apiKey values in the below code with your Zendesk credentials.


Sample code snippet:


<script>

  var accountDetails = {
    //The only variables to be changed are below.
    //Freshdesk Domain. Always the original domain here, please do not enter the CNAME.
    domain: 'domain.zendesk.com',
    emailAddress: 'admin@company.com',
    //Admin User API key.
    apiKey: 'Admin-API-Key'
  };

  var fcResolveCreateTicket = (function($, window, name, email) {
    if (window.FRESHCHAT_CREATE_TICKET_WIDGET) {
        window.FRESHCHAT_CREATE_TICKET_WIDGET.setItUp(name, email); // pass conversation / user info here
        return window.FRESHCHAT_CREATE_TICKET_WIDGET;
    }
    var resolveButton = window.FRESHCHAT_CREATE_TICKET_WIDGET = {

      reopenTimeStamp: '',

      createdTimeStamp: '',

      name: '',

      email: '',

      fcEvent: window.fcAgent.events,

      conversationId: window.location.href.split('/conversation/')[1],

      reqHeader: {
        "Authorization": "Basic " + btoa(accountDetails.emailAddress + "/token:" + accountDetails.apiKey),
        "Content-Type" : "application/json"
      },

      setItUp: function(name, email) {
          var _self = this;
          this.name = name;
          this.email = email;
      },

      initialize: function() {
        var _self = this;
        console.log('Init');
        this.fcEvent.unsubscribe("resolved_message",_self.resolveMessage);
        this.fcEvent.subscribe("resolved_message",_self.resolveMessage,this);
      },

      resolveMessage: function(data) {
        console.log('Clicked Resolve');
        this.assignedagentEmail = data.agent != undefined ? data.agent.email : null;
        this.assignedgroupName = data.group != undefined ? data.group.name : null;
        this.getConversationInfo();
      },

      getConversationInfo: function() {
        var _self = this;
        jQuery.ajax(
          {
            url: 'https://web.freshchat.com/app/conversation/message?rand='+jQuery.now()+'&convid='+window.location.href.split('/conversation/')[1]+'&excludeCampaign=true',
            type: 'GET',
            contentType: 'application/json',
            success:function(data) {
            _self.getRequiredData(data.conversation);

          }
          })
      },

      getRequiredData: function(data) {
        var _self = this,
            index = [],
            reopened = false;

        jQuery.each(data.messages,function(key,value) {
          if (data.messages[key].messageType == '2003') {
            reopened = true;
            index.push(key);
          }
        });

        if (reopened != true) {
          _self.createdTimeStamp = moment(data.messages[data.messages.length-1].createdMillis).format('DD-MM-YYYY hh:mm:ss A');
          console.log('Created Time = '+_self.createdTimeStamp);
          _self.renderTicketData(data.messages,false);
        }
        else {
          var conversation = data.messages,
              ticketData = '';
          if (data.messages[index[0]].messageFragments[0].content == 'Conversation reopened due to new incoming message') {
            console.log('auto reopen');
            _self.reopenTimeStamp = moment(data.messages[index[0]].createdMillis).format('DD-MM-YYYY hh:mm:ss A');
            ticketData = conversation.slice(0,index[0]+2);
          }
          else {
            console.log('manual reopen');
            _self.reopenTimeStamp = moment(data.messages[index[0]].createdMillis).format('DD-MM-YYYY hh:mm:ss A');
            ticketData = conversation.slice(0,index[0]);
          }
          console.log('Reopened Time = '+_self.reopenTimeStamp);
          _self.renderTicketData(ticketData,true);
        }
      },

      renderTicketData: function(data,reopenFlag) {
        var messageContentArray = [],
            userMessages = [],
            _self = this;
        jQuery.each(data,function(i,ele) {
          if (data[i].messageType == 1) {
            console.log('userMessages');
            messageContentArray.push(data[i]);
          }
          else {
            console.log('ignore');
          }
        });

        jQuery.each(messageContentArray, function(i,ele) {
          if (messageContentArray[i].messageFragments.length < 1) {
            console.log(messageContentArray[i].messageFragments[0].content);
            userMessages.push(messageContentArray[i].messageUserName+'|'+messageContentArray[i].messageFragments[0].content);
          }
        else {
          jQuery.each(messageContentArray[i].messageFragments, function(j,ele) {
            console.log(messageContentArray[i].messageFragments[j].content);
            userMessages.push(messageContentArray[i].messageUserName+'|'+messageContentArray[i].messageFragments[j].content);
          });
          }
        });

        var startTime = (reopenFlag == true) ? _self.reopenTimeStamp : _self.createdTimeStamp;

        var endTime = moment(data[0].createdMillis).format('DD-MM-YYYY hh:mm:ss A');

        var original = userMessages.reverse();

        var html = '<div class="HotlinetimeStamp" style="padding-bottom: 10px; font-weight: 500; color: #000000;">Initialized at '+startTime+'</div>';
        jQuery.each(original,function(i,ele) {
          html+= '<div class="userName" style="display: inline-block; width: 150px; vertical-align: top; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;"><strong>'+original[i].split('|')[0]+'</strong> : </div><div class="userContent" style="display: inline-block; word-break: break-word; padding-left: 5px; vertical-align: top;">'+original[i].split('|')[1]+'</div><br/>';
        });
        html+= '<div class="HotlinetimeStamp" style="padding-top: 10px; font-weight: 500; color: #000000;">Resolved at '+endTime+'</div><br/><a href="'+window.location.href+'" target="_blank">'+window.location.href+'</a>';
        _self.setTicketData(startTime,html);
      },

      setTicketData: function(startTime,html) {
        var _self = this;
        var cleanEmail = _self.email;
        var ticketEmail = cleanEmail.length > 3 ? cleanEmail : _self.name.replace(' ','-')+'@app.freshchat.com';
        var ticket = {
          "ticket": {
            "subject": "Conversation with "+_self.name,
            "comment":   { "html_body": html },
            "requester": { "name": _self.name, "email": ticketEmail }
          }
        };
        console.log(ticket);
        this.newTicketCreate(ticket);
      },

      newTicketCreate: function(ticketData) {
        var _self = this;
        jQuery.ajax({
        method: "POST",
        url: "/app/extension_proxy",
        processData: false,
        data: JSON.stringify({
          url: 'https://'+accountDetails.domain+'/api/v2/tickets.json',
          method : "POST",
          dataType: "json",
          headers: this.reqHeader,
          formParameters: {},
          rawBody: JSON.stringify(ticketData)
        }),
        success: function(data) {
          var returnTicketId = data.ticket.id;
          console.log('success');
          _self.successMessage(returnTicketId);
        },
        error : function(data){
          console.log('error');
        }
      });
    },

      successMessage: function(ticket) {
        console.log(ticket);
        var responseTicketID = ticket;
            TicketURL = "https://"+accountDetails.domain+"/agent/tickets/"+responseTicketID;
        this.fcEvent.publish('send_private_message', { message: 'Ticket #'+responseTicketID+' Created, Please go <a href="'+TicketURL+'" target="_blank">here</a> to view the ticket.' });
      }
    };
    resolveButton.initialize();
    setTimeout(function() {
        resolveButton.setItUp(name, email);
    }, 100);
    return resolveButton;
    })(jQuery, window, "{{user.name}}", "{{user.email}}");