Kaizen 231 - Embedding Zoho Desk Tickets in Zoho CRM

Kaizen 231 - Embedding Zoho Desk Tickets in Zoho CRM



Hello, CRM Wizards!

This week, let us enhance cross-team visibility between Zoho CRM and Zoho Desk.

We will use the Zoho Request Client inside a Related List widget to display open Zoho Desk tickets directly within the Contact record in Zoho CRM. This integration allows Sales and Support teams to access active support issues without switching applications.

Business Problem

At Zylker, a manufacturing company that manages high-value distributors and enterprise buyers, sales operations run in Zoho CRM while customer support manages warranty claims and service issues in Zoho Desk.

This separation creates operational friction during critical customer interactions.

1. Lack of visibility into open support tickets 

Sales representatives cannot see ongoing support tickets when interacting with customers in CRM. This results in: 
  1. Sales conversations happening without awareness of active complaints.
  2. Poor customer experience when unresolved issues surface unexpectedly.
  3. Reduced productivity due to frequent system switching between CRM and Desk.
2. No Controlled Escalation Mechanism

There is no structured way to initiate ticket escalations from within Zoho CRM.

Solution

This week we will focus on solving the visibility gap

We will embed a related list widget within Contact detail page and provide real-time visibility of open tickets

Prerequisites

1. Create Zoho CRM and Zoho Desk under the same Zoho Organization. 

2. A two-way sync between Zoho CRM and Zoho Desk is required to keep Contacts and Accounts consistent across both applications.

With this support, any change made to a Contact or Account in either application is automatically reflected in the other.

Additionally, each record in Zoho Desk stores the corresponding Zoho CRM record ID. This allows you to reference the CRM record directly and perform further customizations or integrations using that unique ID.

Follow the steps to create the two-way sync:
  1. Log into Zoho Desk.
  2. Go to Settings > Integration > Zoho
  3. Choose Zoho CRM and click Integrate
  4. On the Authentication page:
    1. Enter your email address.
    2. Choose the CRM organization you want to integrate with.
  5. Click Authorize.
  6. Once authenticated, the sync configuration page opens.
  7. Select the sync type as Two-way Sync.
  8. Map the fields of Accounts and Contacts modules between Zoho Desk and Zoho CRM.
  9. Click Start Sync to initiate the integration. 

Refer to the Integrating Zoho Desk with Zoho CRM help page for more details. 

3. Create a Zoho Desk connection in Zoho CRM with Desk.tickets.READ and Desk.contacts.READ scopes. 

Refer to the Connections help doc for more information. Store the Connection Link Name to use while making API calls. 


4. Create a local project folder for widget using Zoho CLI as mentioned in Creating your First Widget help guide. 

Step-by-Step Implementation

In the widget project directory, code the following logic in the widget.html file.

Step - 1: Get the Current CRM Contact ID

On page load, you can capture the entity ID with the help of PageLoad event listener. 

Also create a reusable ZRC instance configured with the Zoho Desk base URL and OAuth connection name. 

// Initialize the embedded app
ZOHO.embeddedApp.on("PageLoad", async function(data) {
    console.log("PageLoad data:", data);
    // Step 1: Get the entity (module) and entity ID (Contact record ID)
    if (data && data.Entity && data.EntityId) {
        entityModule = data.Entity;
        entityId = data.EntityId;
        console.log("Entity:", entityModule);
        console.log("Entity ID (CRM Contact ID):", entityId);
        // Create reusable ZRC instance for Zoho Desk API
        deskZrc = zrc.createInstance({
            baseUrl: 'https://desk.zoho.com/api/v1',
            connection: 'desk_oauth_connection'
        });
        await loadTickets();
    } else {
        showError("No contact context found");
    }
});
ZOHO.embeddedApp.init();

Step - 2: Fetch Desk Contacts and Match the CRM Contact ID

Make a GET Contacts API call to the Zoho Desk API using the ZRC instance. Loop through the returned contacts and find the one whose zohoCRMContact.id matches the current CRM Contact ID.

// Step 2: Make GET contacts API call to Desk using ZRC
const contactsResponse = await deskZrc.get('/contacts', {
    params: {
        limit: 100
    }
});
console.log("Desk Contacts Response:", contactsResponse);
if (contactsResponse && contactsResponse.data) {
    // Parse the response data 
    const contactsData = typeof contactsResponse.data === 'string' 
        ? JSON.parse(contactsResponse.data) 
        : contactsResponse.data;
    // Find the object where zohoCRMContact.id matches Contact record ID
    if (contactsData && contactsData.data && Array.isArray(contactsData.data)) {
        const matchingContact = contactsData.data.find(function(contact) {
            return contact.zohoCRMContact && 
                   contact.zohoCRMContact.id && 
                   contact.zohoCRMContact.id === entityId;
        });
        if (matchingContact) {
            // Pick the id (Desk contact record ID)
            const deskContactId = matchingContact.id;
            console.log("Desk Contact ID:", deskContactId);
            // Proceed to fetch tickets
            await fetchTickets(deskContactId);
        } else {
            showEmptyState("No Desk contact found linked to this CRM contact");
        }
    }
}

Step - 3: Fetch Open Tickets and Filter by Desk Contact ID

Make a GET Tickets API call to Zoho Desk with the following parameters:
  1. Specify status with Open value to retrieve only open tickets. 
  2. Specify include with value set to contacts fetch each ticket details with its associated contact details. 
Filter the API response with the matched Desk Contact ID and render the results. 

async function fetchTickets(deskContactId) {
    try {
        // Step 3: Make GET Tickets API call using ZRC 
        const ticketsResponse = await deskZrc.get('/tickets', {
            params: {
                include: 'contacts',
                status: 'Open',
                limit: 100
            }
        });
        console.log("Tickets Response:", ticketsResponse);
        if (ticketsResponse && ticketsResponse.data) {
            const ticketsData = typeof ticketsResponse.data === 'string' 
                ? JSON.parse(ticketsResponse.data) 
                : ticketsResponse.data;
            // Filter tickets where contact matches deskContactId
            if (ticketsData && ticketsData.data && ticketsData.data.length > 0) {
                const matchingTickets = ticketsData.data.filter(function(ticket) {
                    return ticket.contact && ticket.contact.id === deskContactId;
                });
                if (matchingTickets.length > 0) {
                    renderTickets(matchingTickets);
                } else {
                    showEmptyState("No open tickets found for this contact");
                }
            } else {
                showEmptyState("No open tickets found");
            }
        }
    } catch (error) {
        console.error("Error fetching tickets:", error);
        showError("Failed to fetch tickets: " + (error.message || error.toString()));
    }
}

Step - 4: Validate and Pack the Widget

Follow the steps given in the Widget help page to validate and package the widget. A complete working code sample is provided as attachment at the end of this post.

Creating a Related List Widget

1. Go to Zoho CRM > Setup > Developer Hub > Widgets and click Create New Widget.

2. Fill in the required details such as:
  1. Name: Zoho WorkDrive
  2. Type: Related List 
  3. Hosting: Zoho 
  4. File Upload: Upload the ZIP created in the dist folder within the widget project directory after packaging in the Step 4. 
  5. Index page: /widget.html

3. Go to Customization > Modules and Fields > Contacts > Standard > Detail View. Then, create and associate the related list widget. 

Refer to the Customize Related Lists help page for more information on creating a related list.

Try it Out! 

Let us look at the output from the Contacts detail page in Zoho CRM. 


Info
Key Points to Remember
  1. Two-way sync is mandatory to link Desk contacts with CRM contacts. 
  2. Connection setup in Zoho CRM for Desk is mandatory with Desk.tickets.READ and Desk.contacts.READ scopes. Ensure to replace the connection name in line 21.
  3. If the account has a large number of contacts or tickets, implement pagination using from and limit parameters to ensure all records are evaluated. 
  4. Ensure to replace the Desk URL to ticket in line 181 with your portal name and company name.
We hope this Kaizen helps your sales team to see active issues instantly. Next week, we will look at how to establish a ticket escalation mechanism from Zoho CRM

Have questions or suggestions? Drop them in the comments or write to us at  support@zohocrm.com

On to Better Building!

-----------------------------------------------------------------------------------------------------------

Related Reading 

2. Connections - An Overview
3. CRM Customizations - Related Lists
4. Desk APIs -  GET Tickets API and GET Contacts API
5. Desk Customizations - Integrate Zoho Desk with Zoho CRM
-----------------------------------------------------------------------------------------------------------
    • Sticky Posts

    • Kaizen #198: Using Client Script for Custom Validation in Blueprint

      Nearing 200th Kaizen Post – 1 More to the Big Two-Oh-Oh! Do you have any questions, suggestions, or topics you would like us to cover in future posts? Your insights and suggestions help us shape future content and make this series better for everyone.
    • Kaizen #226: Using ZRC in Client Script

      Hello everyone! Welcome to another week of Kaizen. In today's post, lets see what is ZRC (Zoho Request Client) and how we can use ZRC methods in Client Script to get inputs from a Salesperson and update the Lead status with a single button click. In this
    • Kaizen #222 - Client Script Support for Notes Related List

      Hello everyone! Welcome to another week of Kaizen. The final Kaizen post of the year 2025 is here! With the new Client Script support for the Notes Related List, you can validate, enrich, and manage notes across modules. In this post, we’ll explore how
    • Kaizen #217 - Actions APIs : Tasks

      Welcome to another week of Kaizen! In last week's post we discussed Email Notifications APIs which act as the link between your Workflow automations and you. We have discussed how Zylker Cloud Services uses Email Notifications API in their custom dashboard.
    • Kaizen #216 - Actions APIs : Email Notifications

      Welcome to another week of Kaizen! For the last three weeks, we have been discussing Zylker's workflows. We successfully updated a dormant workflow, built a new one from the ground up and more. But our work is not finished—these automated processes are