Quickstart to Zoho Desk Extensions
At Zoho Desk, we believe in delivering good user experiences and making already good experiences better. In that vein, stepping into Zoho Marketplace is an effort towards achieving the latter goal.
Zoho Marketplace is an online store where users can find extensions that deliver business value by enhancing the core functionality of the Zoho product they use. It is similar to Google's Play Store, where you find apps for installation and use, according to your need. Until now, one could create extensions only for Zoho CRM, Creator, Connect, Cliq, Recruit, SalesIQ, Mail, and Reports. Going forward, they can create extensions for Zoho Desk too, and make a positive impact in the customer service space.
As a developer, you can create extensions that combine Zoho Desk's functionalities with those of third-party tools to make work easier and more effective for the end-users of Zoho Desk. You do not require extensive expertise or experience in programming to create extensions. Functional knowledge of HTML, CSS, and JavaScript can help you to a great extent.
After you create and submit your extension for review, we test its functionalities and provide you with feedback for improving its effectiveness, if required. When the extension is ready for use, we host it on Marketplace for end-users to discover and use.
To keep yourself updated about changes to Zoho Desk Extension development capabilities, such as APIs and SDKs, follow the Zoho Desk Extension Developers forum.
Installing the Node
As the first step to creating an extension, you must install the node.js runtime environment. You can download node.js from here (versions above 10.X are supported). After installing node.js, you can verify its version using the following command:
- $ node -v
v10.x
or
Above
Installing the ZET CLI
Next, you must install the ZET (Zoho Extension Toolkit) Command Line Interface (CLI) tool, which enables you to build, test, and package extensions for Zoho products.
If you use a Mac/Unix system for development, run the following command to install ZET:
- sudo npm install -g zoho-extension-toolkit
If you use a Microsoft Windows system, run the following command:
- npm install -g zoho-extension-toolkit
The -g command option ensures that the installation is global. With a global installation, you can call commands and work on your extensions and CLI from anywhere within your machine.
After ZET is installed, help information regarding the zet command would appear. You can then verify the version of the tool, using the following command:
- zet -v 0.23.6 or Above
Running ZET will display all the commands supported, as shown in the right panel.
- D: \zet\projects\demoproject>zet -help
-
Usage: index [options] [command]
-
Options:
-
-v, —version Show the version number
-h, —help output usage information -
Commands:
- Init, Creates a new project template directory
run Starts a local server with current directory as context
Validate Validates the current app with validation rules
Pack Packs the project to upload into marketplace
Init
This command creates a new project for the extension.
- zet init
Executing this command displays the list of Zoho Services available. Choose Zoho Desk and press the Enter key.
- D:\zet\projects>zet init
- ? Select the Zoho service for your widget and hit enter key (Use arrow keys)
- > Zoho Desk
- Zoho CRM
- ZES
After choosing Zoho Desk, provide a name for the new project.
- D:\zet\projects>zet init
- ? Select the Zoho service for your widget and hit enter key Zoho Desk
- ? Project Name demoproject
After you enter the name, a project template directory with all the necessary folders, dependency node packages, and files is created.
- D:\zet\projects>D:\zet\projects>zet init
- ? Select the Zoho service for your widget and hit enter key Zoho Desk
- ? Project Name demoproject
- Initializing project at: D:\zet\projects\demoprojects
- Installing NPM dependencies…
- Project Initialized D:\zet\projects\demoprojects
- Run the following commands:
- Cd demoproject
- Zet run
The image below shows the default folder structure of an extension project.
Run
This command runs the http server hosting the extension.
1. To start the server and test the extension, run the following command:
- D:\zet\projects>D:\zet\projects>zet run
This command makes the http server accessible through the 5000 port of your local machine. Make sure that the 5000 port is not occupied, before you start the server.
2. To verify if the server started successfully, open the following URL in your browser: http://localhost:5000/plugin-manifest.json
Validate
This command validates the extension by checking if it follows the guidelines defined in this section. To perform this validation, run the following command:
- D:\zet\projects>zet validate
After you execute this command, the result of the validation appears. Check the result and make any changes, if required. After this step, you can proceed to package the extension files for upload.
Guidelines
During validation, the details in the plugin-manifest.json file are checked to verify if the following conditions are met:
- Icon and logo URLs must be relative paths. Absolute paths are notallowed.
- All keys included by default while creating the extension must be present in the plugin-manifest file. None of the keys must be removed.
Pack
The project directory contains the source code and other node modules necessary for locally testing the extension. However, the final zip file you upload to Marketplace must contain only the files and folders essential for running the extension. ZET makes this packaging process easy through the following command:
- zet pack
After you execute this command, ZET creates a zip file containing all files in the app folder and the plugin-manifest.json file of your extension. This zip file is stored in the dist folder of the project.
Building Your First Extension
Let’s get started by creating an extension. First, open the terminal/command prompt window, and navigate to the directory under which you want to create your extension.
Then, perform the following steps:
- Run the init command.
- Under the list of services, choose Zoho Desk.
- Enter a name for the extension project.
- Press the Enter key.
- The extension project is created with the necessary directories and files.
Testing the Extension
To test your extension, perform the following steps:
- Open the terminal/command prompt and navigate to your project folder.
- Execute the zet run command.
- If you use Mozilla Firefox, open the https://127.0.0.1:5000/plugin-manifest.json url in a new tab and click Advanced ---> Accept the Risk and Continue.
- If you use Google Chrome, open the https://127.0.0.1:5000/plugin-manifest.json url in a new tab and click Advanced ---> Proceed to Unsafe. If the Proceed to Unsafe option does not appear, enable the chrome://flags/#allow-insecure-localhost Chrome flag and restart the browser.
- Log into your Zoho Desk account. If you do not have a Zoho Desk account, sign up here.
- While on the Zoho Desk page, open browser developer tools, and from the console, invoke the runDevMode() JavaScript code. This action refreshes the page and activates the development mode.
- Open a ticket and click the Marketplace icon. The extension appears.
The runDevMode() command loads Zoho Desk in developer mode. To revert to normal mode, execute the runProdMode() command in developer tools.
Validating the Extension
To validate your extension and verify if it follows the guidelines mentioned earlier, perform the following steps:
- Open the terminal/command prompt and navigate to your project folder.
- Execute the zet validate command.
The results of the validation process appear. Make changes, if required.
Packaging the Extension
To package your extension as a zip file that contains only the relevant files, perform the following steps:
- Open the terminal/command prompt and navigate to your project folder.
- Execute the zet pack command.
The zip file of your extension is created in the dist folder of your project.
Zoho CRM Training Programs
Learn how to use the best tools for sales force automation and better customer engagement from Zoho's implementation specialists.
Zoho DataPrep Personalized Demo
If you'd like a personalized walk-through of our data preparation tool, please request a demo and we'll be happy to show you how to get the best out of Zoho DataPrep.
- Zoho Workerly Home
- Forums
- Connect With Us:
- Zoho Recruit Home
- Forums
- Connect With Us:
You are currently viewing the help pages of Qntrl’s earlier version. Click here to view our latest version—Qntrl 3.0's help articles.
New to Zoho Survey?
Zoho Sheet Resources
Zoho Forms Resources
New to Zoho Sign?
Zoho Sign Resources
Sign, Paperless!
New to Zoho TeamInbox?
Zoho TeamInbox Resources
New to Zoho ZeptoMail?
Zoho DataPrep Resources
Design. Discuss. Deliver.
New to Zoho Workerly?
New to Zoho Recruit?
New to Zoho CRM?
New to Zoho Projects?
New to Zoho Sprints?
New to Zoho Assist?
New to Bigin?
Related Articles
Getting started with Zoho CRM Extensions
This guide is designed to help you get started with Zoho Developer Console and complete the basic setup required to build your own extensions. The guide will help you with the following: Accessing the Zoho Developer Console Creating and Managing ...Quickstart Guide For Extensions
Extensions—prebundled software components that can add a set of custom features to your Zoho CRM—enable developers to deliver a range of functionality not available by default on our system. This allows our partners to streamline the customization ...Building Extensions
What are extensions? Extensions are bundles of practicable code integrations, containing commands, bots, message actions, functions, schedulers and databases combined together to suit your client or user requirements. Extensions created by you ...Publishing Extensions in Zoho Marketplace
Publishing an Extension Extensions that are tested and good to go, can be published in Zoho Marketplace. First, hover over the extension name to view two options Publish and Edit. Selecting the Publish option will direct you to ...URL invoke type extensions
What are extensions in Cliq ? Extensions are a great way to connect to a third party service thereby bringing in your everyday tools and work items together in one place- Cliq. URL invoke type extensions URL invoke type extensions are as same as ...
New to Zoho LandingPage?
Zoho LandingPage Resources