Building extensions #6: Custom user interfaces with Widgets

Building extensions #6: Custom user interfaces with Widgets

Welcome to our post on Widgets for Zoho Projects!

In our last post, we explored the significance of the connections feature, showed how to use it, and provided an example use case. In this article, we'll look at the importance of widgets, another feature available in Zoho Projects.

Importance of widgets

Widgets are graphical user interface components that enable you to customize the user interface to provide users with easy data access and the flexibility to perform data operations. Zoho Projects offers widget support in multiple locations to enable users to further customize the UI in the location that most suits their needs.

When and where can widgets be used?

Widgets can be used for multiple purposes, some of which include:
➤ Collect and organize data from multiple sources before presenting it to the end user in a customized style.
➤ Display data to end users to allow them to make an input decision, then use that input data to carry out business processes.
You can also load and utilize widgets in multiple locations in Zoho Projects based on your business needs.

Configuring widgets in plugin-manifest.json

To include a widget in an extension, it must be configured in the plugin-manifest.json file. As we explained in an earlier post, the plugin-manifest.json file includes a sample widget named "Projects Extension" in the task details tab by default.

However, as part of an extension, you can add multiple widgets at various locations. In order to include a widget, you need to provide values for the below three keys:
  • name - The name of the widget.
  • location - The location in which the widget must be loaded. You may find the value to be used for each specific place in the widget locations document.
  • url - The path to the HTML file containing the widget UI that must be rendered.


Depending on the functionality of your extension, you can configure as many widgets as you want in your plugin-manifest.json in this manner.

Support for Widgets in Zoho Projects - JS SDKs

Zoho Projects offers JS SDKs that allow widget code to interact with the extension. In order for the javascript widget code to communicate with the extension, Zoho Projects provides JS SDKs support for multiple functionality. Some example functionalities include:
  • Initializing the extension
  • Fetching current user details
  • Getting details of portal, task, and much more
  • Setting details for tasks, issues, projects, and so on
  • Invoking connections inside the extension
You can refer to the JS SDK document for the available SDKs.

Prerequisite for using the JS SDKs
Note: It is important to invoke the init method in order to initialize the extension and utilize the other JS SDKs. All other JS SDK methods can be used only once the init method is invoked.

A few use case examples
  • Streamlining Zoho Projects developers' work by displaying Zoho Desk articles related to the task's subject as a tab on the task details page. This allows them to find any existing references related to the task at hand that they can refer to and get a head start on the work.

  • Managing your Zoho CRM open cases from within Zoho Projects to efficiently track and prioritize the cases based on their status.

  • Uploading and associating files with ease to a third-party file management service, such as Sharepoint or Dropbox, right from Zoho Projects. Similarly, having access to and managing third-party files within the Zoho Projects module of your choice. These synchronized data exchanges between applications help you stay organized and save time.
  • Managing your company's expenses and project budgets by collaborating with Zoho Books to allocate funds and generate invoices for each project. As a result, you can easily create estimates, invoices, and deliver the generated bills to the project client while maintaining all of your finances in one place.
These are just some of the examples of what widgets can be used for. Widgets provide you more control and flexibility over the UI design and help in simplifying the user experience.

We hope you found this information useful. Keep following this space as we will explore more such sample business solutions along with their implementation in our upcoming posts!

Sign up for a Zoho Developer account and start developing extensions for Zoho products using Sigma.

SEE ALSO:


Next>>

    • Recent Topics

    • How to list WorkDrive folder contents using API

      I'm trying to read folder contents using a Deluge script. The code below returns {"errors":[{"id":"F6016","title":"URL Rule is not configured"}]}". I've tried using the search API and seen similar errors. I have proved that the connection works by creating

    • Speed (again!)

      Same old story again: impossible to work at this "speed". Category NOTES!

    • Need to set workflow or journey wait time (time delay) in minutes, not hours

      Minimum wait time for both Campaigns workflows and Marketing Automation journeys is one hour. I need one or the other to be set to several minutes (fraction of the hour). I tried to solve this by entering a fraction but the wait time data type is an integer

    • sending email with another account

      Hello there, i write there for an our costumer request. They want to send email from CRM with a different email (confirmed and added to zoho profile). For example they use account@zilium.com but with this account they want to send (not only with email

    • All new Address Field in Zoho CRM: maintain structured and accurate address inputs

      Availability Update: 29 September 2025: It's currently available for all new sign-ups and for existing Zoho CRM orgs which are in the Professional edition exclusively for IN DC users. 2 March 2026: Available to users in all DCs except US and EU DC. 24

    • Comments aren't visible in shared spreadsheet

      I would like to send a spreadsheet to people who can use it to help solve a problem as a one off use unique to them. They will have to enter data in the sheet. I have comments attached to some of the cells to explain the purpose of the data being collected.

    • Custom button for list page

      Having problems creating a script to iterate selected rows in the list page for packages to ship them, any help would be appreciated - something simple will do like producing a count of selected rows. This snippet I found doesn't work - idList = requestParams.get("ids").toList(",");

    • Ask the Experts - Live Q&A webinar

      Hello Community, We’re excited to host our very first Ask the Experts session! Join us on 7 April 2026 from 11 a.m. to 12 p.m. (IST) for this live webinar Q&A session, where you will have an opportunity to connect directly with our product experts, gain

    • Designing Multi-Step Workflow System in Zoho Creator + Deluge (Startup Build – Exploring Advanced Architecture + Partnerships)

      Hi everyone, I’m currently building a Zoho-based system as part of an early-stage startup, and I’m looking to connect with others who have experience designing more advanced workflows in Creator + Deluge. This started as a standard application, but it’s

    • Bin Tracking with eBay integration

      When trying to setup bin tracking on items that are linked to eBay listings using the built-in Zoho eBay integration, I keep getting this error: "Storage Tracking cannot be enabled for items that are manually fulfiled or for serial/batch items tracked

    • Removing To or CC Addresses from Desk Ticket

      I was hoping i could find a way to remove unnecessary email addresses from tickets submitted via email. For example, a customer may email the support address AND others who are in the helpdesk notification group, in either the TO or CC address. This results

    • Update to CRM Custom Buttons: Collect Users' Location

      Hello everyone! Buttons in Zoho CRM allow you to extend the default CRM capabilities for your bespoke business needs. It provides the flexibility to connect to any third-party application to perform necessary actions. Wouldn't it be better, if those buttons

    • Is it possible to make tags "required"

      We would like to be able to make the tag field a requirement for agents before they can close a ticket. This would help with monthly reporting, where a lot of tickets end up with no tag, causing manual work to go back and add the correct tag for each

    • Prevent Automatic Milestone Inheritance for Newly Created Task Lists

      Hello Zoho Projects Team, We hope you are doing well. We would like to request an enhancement regarding how new task lists inherit Milestone association in Zoho Projects. Current Behavior: At the moment, when a new task list is created below an existing

    • I would like to know wich person viewed the file

      I have a franchise and my Operative Manual is in WorkdriveI, the user can´t download but despite I know How many views the file had, I would like to know wich person viewed the file Is it possible? thank you

    • Can I write a check in Zoho Books with no associated bill?

      This currently does not seem possible, and I have a client that desperately needs this function if I am able to convert them with Quickbooks. Thank you in advance for your reply. 

    • Cloning Module Customizations in Zoho FSM

      Hello Latha, I have two Zoho FSM accounts, each in a different data center. I would like to know if it is possible to clone the module customizations I have already completed in one account to my new account in the UAE from the backend. In other words,

    • Ordering of Teams

      Hi there, Currently, we cannot order Teams in Zoho Desk. Teams are ordered as they were created. It would be really helpful if we could customise the order of Teams. For example: We have the following Teams: Shipping Customer Service Sales Compliance

    • Estimate Module - Contact Field.

      Hello Latha and Team, Is it possible to make the Contact field optional in the Estimate module? Best regards, Chethiya.

    • Item with name in different languate

      Hello, is there a way to have an item with its name in different languages? For example: I sell an item in different markets and I'd like to have a Proposal and the Invoice with the Item Name in a specific language. Rino Bertolotto Zoho Specialist, STESA srl

    • How to keep track of bags, cans, drums of inventory?

      We buy and sell products that are packaged in bags 🛍️, cans🥫, drums🛢️, etc. with batch numbers. When we get a shipment of one of the products, how do we track we received (say) 10 cans each of 5L of a product and maybe we received 10 cans of another

    • This version of app doesn't support this notecard type Error

      So this problem is happening for any notes created within the last week, as well as any note recently edited on Android. I can open them on my phone fine, but they don't open on the website version. They DO work on the desktop app version. It's just web

    • PDF's Give Unsupported Type Error Message

      Many of the pdf files I add to Notebook work fine but in some cases when I try to open them on the Android App I get a message saying "Unsupported Type. Psst! You are using an older version of the app which does not support this note format. Please update

    • Cliq iOS can't see shared screen

      Hello, I had this morning a video call with a colleague. She is using Cliq Desktop MacOS and wanted to share her screen with me. I'm on iPad. I noticed, while she shared her screen, I could only see her video, but not the shared screen... Does Cliq iOS is able to display shared screen, or is it somewhere else to be found ? Regards

    • I am not able to check in and checkout in zoho people even location access allowed

      This issue i am facing in mackbook air m1, I allowed location in chrome browser and i also tried in safari but getting similar issue. Please have a look ASAP.

    • Is multiple invoice e-mailing possible?

      I wonder if following is possible: When you are in the invoice view, assume you have five invoices to five different customers that are pending (you have just created them, but not sent them away yet by email.) To the left of every invoice in the overview

    • Multiple packages in one shipment

      Guys we have been asking for this for years. we want to be able to ship multiple packages for one customer in the same shipment, so as to avoid entering shipping info repeatedly, and avoid customer getting multiple tracking emails. When does this arise?

    • I can't add a new customer in Zoho invoice? Anyone had this issue before?

      Ive been using Zoho invoice for over 6 years. Today I wanted to add a new customer to send an invoice to but it doesn't save when I try to access it from the pulldown menu when you go to send a new invoice.

    • set up an opportunity progress bar in canva

      Hi, set up an opportunity progress bar in canva I need help to set to reproduce the progress bar or equivalent of the opportunity steps in canva as in standard view (see capture ) Thank you in advance Amadou

    • Which Tool Is Best to Import MSG Files to HostGator?

      The best tool to import MSG files to HostGator is the MacGater Mac MSG Converter. This professional utility is specifically designed to simplify the migration of Outlook MSG files into web-based email services, including HostGator. It supports direct

    • Recurring event sync via Microsoft 365 Meetings

      I believe syncing Recurring through the Microsoft 365 Meetings integration is already in the works but I couldn't find a reference in the community to track the progress of this work.

    • What's New in Zoho Invoice | April - June 2025

      Hello everyone! We're excited to share the latest feature updates and enhancements we've made to Zoho Invoice from April to June 2025. In this, you will learn more about the following features: New Integrations via Zoho Marketplace Add Images to Email

    • Client Script | Update - Client Script Support For Custom Buttons

      Hello everyone! We are excited to announce one of the most requested features - Client Script support for Custom Buttons. This enhancement lets you run custom logic on button actions, giving you greater flexibility and control over your user interactions.

    • import customers

      Is there a way to bulk import customers? I'm moving from Acuity and would rather not have to enter everyone manually.

    • What's New in Zoho POS - February 2026

      Hello everyone, Welcome to Zoho POS’s monthly updates, where we share our latest feature updates, enhancements, events, and more. Let’s take a look at how February went. Purchase and sell items on different units We have introduced a unit conversion functionality

    • Batch Tracking custom function

      Hi fellow zoho users, We have our ecommerce site setup to shopify. I have some products I want to add batch tracking too, my only issue is that it breaks our shopify workflow (create sales order, invoice, payment, package) because it requires us to manually

    • Kaizen #236 - Using Client Script Support in Quick Create to Automate Manual Data Entry

      Welcome to another post in the Kaizen Series! In this post, we explore how Client Script support in the Quick Create form can be used to automate data entry. This solution addresses a common business scenario where Zylker Furniture sells sofas, wardrobes,

    • Serial Numbers.

      I generated serial numbers for items and there is no way to generate more serial numbers that the number of items being "sold" or created. This is annoying as how does one know what serial number they left off with when they go to receive or sell this

    • Ensure every user starts right with Welcome Email Templates

      Adding a new user to your organization extends beyond account creation–it requires delivering the right information at the right time to ensure a productive start. New users typically require key details upon joining, such as login instructions, security

    • How to change the format for phone numbers?

      Mobile phone numbers are currently formatted (###) ###-####.  How can I change this to a more appropriate forms for Australia being either #### ### ### or (#)### ### ###?

    • Next Page