Extension pointers for integrating Zoho CRM with Zoho products #8: Upload and manage Zoho Workdrive folders and files from within Zoho CRM

Extension pointers for integrating Zoho CRM with Zoho products #8: Upload and manage Zoho Workdrive folders and files from within Zoho CRM

Keeping records on your customers and business prospects is essential for tracking data, conducting follow-ups, and running a business smoothly. When you use two separate applications, and store relevant data in each, checking and tracking data becomes more difficult.
 
Integrating applications that contain customer data is an effective solution for easily synchronizing and managing data across both applications. In this post, we'll look at how to integrate Zoho CRM with Zoho Workdrive in order to synchronize and manage Workdrive files and folders associated with a CRM contact across both applications.
 
Consider the following scenario: You've converted a lead to a contact in Zoho CRM. Now, you must associate files with that contact, such as legal documents or proofs. To do this, you can create a team folder where every team member can access and manage the contact's folders and files. 
 
In order to store contact-specific files, you can create a new folder (within the team folder) for each WorkDrive contact by clicking a button within their CRM record. You can even create a widget for uploading files to the contact's Workdrive folder from within CRM. 
 
Create a connector for Zoho Workdrive and add connector APIs
  • Create a new connector in your Zoho Workdrive extension using the Connectors feature under Utilities in the left-side panel of the Zoho Developer console. 
Note: Zoho Workdrive follows OAuth 2.0 protocols for authentication. You can learn how to register Zoho products and retrieve your client credentials here.
 
                                                
 
The connector details for the above example are as follows:

Request Token URL
https://accounts.zoho.com/oauth/v2/auth?scope=,WorkDrive.users.READ,WorkDrive.files.CREATE,
WorkDrive.teamfolders.CREATE&access_type=offline
Access Token URLhttps://accounts.zoho.com/oauth/v2/token
Refresh Token URLhttps://accounts.zoho.com/oauth/v2/token
Scopes
WorkDrive.users.READ,WorkDrive.files.CREATE,
WorkDrive.teamfolders.CREATE
                                                 
 
The Zoho Workdrive REST APIs we added for our example are as follows:
 
Connector API NameMethod typeURL
Get ZUIDGEThttps://www.zohoapis.com/workdrive/api/v1/users/me
Get all teams of a userGEThttps://www.zohoapis.com/workdrive/api/v1/users/${zuid}/teams
Create team folderPOSThttps://www.zohoapis.com/workdrive/api/v1/teamfolders
Create new folderPOSThttps://www.zohoapis.com/workdrive/api/v1/files
File uploadPOSThttps://www.zohoapis.com/workdrive/api/v1/upload?filename=${file_name}&parent_id=${file_parent_id}&override-name-exist=true
 
Note: You can refer to this post to see the detailed steps involved in creating a connector, adding the connector APIs, and associating them with the extension.
 
Create a settings widget to build team folder and assign them to Workdrive teams 
  • Create a settings widget to select a team to manage a contact's folders and files.
  • We'll also create a CRM variable called "Team Folder ID" to store the assigned team's ID information for future operations.


Settings widget.js code snippet
Util={};
var teamidvalue;
 
   //Subscribe to the EmbeddedApp onPageLoad event before initializing the widget 
   ZOHO.embeddedApp.on("PageLoad",function(data)
  {
var data =  {
    }
 
//Invoking the 'Get ZUID' API to retrieve the user's ZUID
ZOHO.CRM.CONNECTOR.invokeAPI("xxx.workdrive.getzuid",data)
.then(function(dataa){
    console.log(dataa);
    response = dataa.response
    responsejson=JSON.parse(response);
    zuiddata=responsejson.data;
    zuid=zuiddata.id;
 
    var data =  {
          "zuid" : zuid
    }
//Invoking the 'Get all teams of a user' API to fetch all the teams of a user
ZOHO.CRM.CONNECTOR.invokeAPI("xxx.workdrive.getallteamsofauser",data)
.then(function(dataa){
    console.log(dataa);
    response = dataa.response;
    responsejson=JSON.parse(response);
    teamdata=responsejson.data;
 
  for (i = 0; i < teamdata.length; i++) 
    {
 
      teamid=teamdata[i].id;
      attributes=teamdata[i].attributes;
      teamname=attributes.name;
      var teamlist = document.getElementById("teamlist");
      var option = document.createElement("OPTION");
      option.innerHTML = teamname;
      option.value = teamid;
      teamlist.appendChild(option);
    }
    })
})  
})
    Util.getvalues=function()
    {
//Retrieving the value chosen in the teamlist
      teamidvalue=document.getElementById("teamlist").value;
/*Constructing data and passing to 'Create team folder' API to create a team folder called "CRM Contacts test"*/
var data =  {
 
          "extension_team_folder_name" : "CRM Contacts test",
          "parent_id":teamidvalue
    }
ZOHO.CRM.CONNECTOR.invokeAPI("xxx.workdrive.createteamfolder",data)
.then(function(dataa){
    console.log(dataa);
    response = dataa.response;
    responsejson=JSON.parse(response);
    teamfolderdata=responsejson.data;
    teamfolderid=teamfolderdata.id;
 
//Set the ID of the team selected in the teamlist to the "Team Folder ID" CRM variable
          var variableMap = { "apiname": "xxx__Team_Folder_ID", "value": teamfolderid};
ZOHO.CRM.CONNECTOR.invokeAPI("crm.set", variableMap);
 
ZOHO.CRM.API.getOrgVariable("xxx__Team_Folder_ID").then(function(data){
  console.log(data);
});
});
    }

 
Create a button in the Contacts module to make a new Workdrive folder for a contact
  • Create a button called "Create a new workdrive Folder" using the Links & Buttons feature available in the Components section of the Zoho Developer console. Then, write a function to perform the desired action.
  • For our use case, since we're creating a new folder specific to a contact inside a WorkDrive team folder, we'll create the folder with the Full Name of the Zoho CRM contact.
  • We'll also create a custom field in the Contacts module called "Folder ID" to store the ID of the new Workdrive folder to perform future operations.
Create a new Workdrive folder: Function code snippet

//Fetching the current contact details and retrieving the Full Name and custom field folder ID of the contact
response = zoho.crm.getRecordById("Contacts",contact.get("Contacts.ID").toLong());
Fullname = response.get("Full_Name");
contactfolderid = response.get("xxx__Folder_ID");
if(contactfolderid == null)
{
/*Invoking the 'Create new folder' API to get create a folder in Workdrive for the Zoho CRM contact with the name as their Full Name*/
parentfolderid = zoho.crm.getOrgVariable("xxx__Team_Folder_ID");
dynamic_map = Map();
dynamic_map.put("name",Fullname);
dynamic_map.put("folder_parent_id",parentfolderid);
 
newfolderresp = zoho.crm.invokeConnector("xxx.workdrive.createnewfolder",dynamic_map);
newfolderresponse = newfolderresp.get("response");
newfolderdata = newfolderresponse.get("data");
newfolderid = newfolderdata.get("id");
contactinfo = {"xxx__Folder_ID":newfolderid};
/* Updating the 'Folder ID' custom field in contact's record with the new folder ID obtained from the response*/
folderresponse=zoho.crm.updateRecord("Contacts",contact.get("Contacts.ID").toLong(),contactinfo);
 
return "A new workdrive folder has been created with the ID - " + newfolderid;
}
else
{
return "Folder already present for contact in Workdrive";
}
  • The above code snippet fetches the record details for the current contact to retrieve the customer's Full Name. 
  • The Workdrive parent folder ID (set using the settings widget), where the new folder for the contact will be created, is then retrieved using the getOrgVariable deluge task . 
  • The parent folder ID and the contact's Full Name are delivered to the Create new workdrive folder API to create a new folder for the contact in Workdrive.
  • The ID of the new folder is then updated in the "Folder ID" custom field using updateRecord task. 
Create a button in the Contacts module to upload files to a contact's Workdrive folder and associate it with a widget
  • Create a button called "Upload file to Workdrive" using the Links & Buttons feature available in the Components section of the Zoho Developer console, then associate a widget to perform the desired action.
Upload file to workdrive - widget.html - Please find the attachment for the widget html code.
  • The code snippet fetches the record details of the current contact, from which the custom field 'Folder ID' value is retrieved. 
  • The input file selected is also checked for its file type and name.
  • The Folder ID and the file name are then constructed and passed as parameters to invoke the 'Upload File to Workdrive' API.
Sample output
  • After installing the extension, authorize the Zoho Workdrive connector.
  • Go to Settings on the extension configuration page.
  • Choose a team to manage the contact's folders and files. Click Save.
                                    
  • A new team folder, CRM Contacts test, is created in Zoho Workdrive for the chosen team.                                    
  • Go to the Contacts module. Click on the Create a new workdrive folder button on the record's view page.                                     
  • A new folder is created in workdrive with the name of your contact.                          
  • Once the folder is created, the custom field, Folder ID is also automatically updated with the new folder ID value.                         
  • Now, click on the Upload file to Workdrive button on the record's view page.                    
 
  • The widget appears. Choose a file and click the Upload file to Workdrive button. The file will be uploaded to Workdrive.
                                     
Using this method, you can integrate Zoho CRM with Zoho Workdrive through an extension to perform necessaryfunctionalities for your business. We hope you find this information helpful! 
 
In our next post, we will show you how to track, view, and access these Workdrive files within Zoho CRM. Keep following this space for more advice!


SEE ALSO


    Access your files securely from anywhere

        Zoho Developer Community




                                  Zoho Desk Resources

                                  • Desk Community Learning Series


                                  • Digest


                                  • Functions


                                  • Meetups


                                  • Kbase


                                  • Resources


                                  • Glossary


                                  • Desk Marketplace


                                  • MVP Corner


                                  • Word of the Day



                                      Zoho Marketing Automation


                                              Manage your brands on social media



                                                    Zoho TeamInbox Resources

                                                      Zoho DataPrep Resources



                                                        Zoho CRM Plus Resources

                                                          Zoho Books Resources


                                                            Zoho Subscriptions Resources

                                                              Zoho Projects Resources


                                                                Zoho Sprints Resources


                                                                  Qntrl Resources


                                                                    Zoho Creator Resources



                                                                        Zoho Campaigns Resources


                                                                          Zoho CRM Resources

                                                                          • CRM Community Learning Series

                                                                            CRM Community Learning Series


                                                                          • Kaizen

                                                                            Kaizen

                                                                          • Functions

                                                                            Functions

                                                                          • Meetups

                                                                            Meetups

                                                                          • Kbase

                                                                            Kbase

                                                                          • Resources

                                                                            Resources

                                                                          • Digest

                                                                            Digest

                                                                          • CRM Marketplace

                                                                            CRM Marketplace

                                                                          • MVP Corner

                                                                            MVP Corner





                                                                              Design. Discuss. Deliver.

                                                                              Create visually engaging stories with Zoho Show.

                                                                              Get Started Now