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

    • Zoho CRM - Writing Assistant Tone

      Hi Zoho CRM Team, Text in my emails often gets underlined in yellow because I tend to use a more informal tone with my client's, like using "I'm" instead of "I am". Is there some way for me to tell the system that this is my preferred writing tone, so

    • Hide Contact Number for Field Users & Agents

      Is it possible to hide the contact number in both the Service Appointment and Work Order modules for field users and agents? The agents are using the Zoho FSM mobile app, and we want to restrict them from viewing the contact number.

    • Zoho Flow Credits

      Hi , I would like to ask the reason why every time I added plus credit but few days later I will return back to default? (as below I add credit to 3000 but today It change back to 1000) Most important is, when the credit fully used, not any reminder to

    • Form Submission Emails

      Is there a current delay with submission emails being sent? We've had 10-20 forms completed today but only a handful of emails.

    • What is the simplest way to import PST to Yahoo Mail?

      The simplest way to import PST file into Yahoo Mail is to use a third-party tool that supports direct PST-to-Yahoo migration. Software like Aryson PST Converter lets you upload emails, contacts, attachments, and folders from a PST file straight into your

    • Subform edits don't appear in parent record timeline?

      Is it possible to have subform edits (like add row/delete row) appear in the Timeline for parent records? A user can edit a record, only edit the subform, and it doesn't appear in the timeline. Is there a workaround or way that we can show when a user

    • 【Zoho CRM for Everyone】設定画面のアップデート

      ユーザーの皆さま、こんにちは。コミュニティチームの藤澤です。 今回は「Zoho CRM アップデート情報」の中から、Zoho CRM for Everyone の設定画面のアップデート情報をご紹介します。 目次 設定ホーム画面の追加 設定画面での検索結果の表示形式の変更 設定画面でのよく使用する機能の表示 設定メニューの展開/折りたたみ状態の保持 1. 設定ホーム画面の追加 ホーム画面の設定項目は、直感的に分類できるように"カテゴリごと"で分けられています。 このような一元化された表示により、各ツールが1つの画面に集約され、必要な機能をより簡単に見つけられるようになりました。

    • What's New - November 2025 | Zoho Backstage

      A new month, a new set of updates. With a mix of new features and thoughtful improvements, you get smoother workflows and better control across registrations, exhibitors, and communications. Let's take a look at what's new and enhanced in Zoho Backstage

    • Zoho Checkout - Duplicate Customer record created for each payment received

      Hi All. We are using Zoho Checkout to capture online payments for a club membership form (in Zoho Forms). We've noticed that each new payment seems to create a new customer record, regardless of whether the customer already exists in the Zoho Finance

    • Templates for Zoho Desk - Knowledge Base

      We are looking at migrating our Knowledge base into Zoho Desk. Is there a way of creating templates for article in Knowledge base. We want to be able to set templates for certain types of content. Is this possible

    • Import KB template OR Export template for zoho desk?

      Greetings. Can you tell me if there is a way to get an EXPORT of my KB articles? OR is there a template you supply for importing KB articles into my zoho desk? I am looking for a method of understanding what fields can be imported, and what their possible

    • What KPIs Do You Use to Measure Your Support Team’s Performance in Zoho Desk?

      Hi everyone, We hope you’re all doing well. We are trying to improve how we measure the performance and effectiveness of our support department, and we would really appreciate learning from the community. We assume there are several common and widely-used

    • Backorder quantity change

      New Purchase Order × Almost there, but... Quantity of items in this purchase order is greater than the quantity that can be backordered from that sales order. Why can't I change the quantity of a backorder purchase? It looks like a normal order form and I would like to use it as one because I increased the amount and added some items. 

    • How to Associate multiple contacts with deal in Sales Inbox

      Hello, I have many deals that have multiple potential customers associated with a single deal, for example an engineer and a manager. The manager is the Deal's primary contact in CRM and the Engineer is added to the deal in the "Contact Roles" Associated

    • WorkDrive and CRM not in sync

      1/ There is a CRM file upload field with WorkDrive file set as the source: 2/ Then the file is renamed in WorkDrive (outside CRM): 3/ The File in CRM is not synced after the change in WorkDrive; the file name (reference) in CRM record is not updated (here

    • "code": "500","description": "Account not exists", mail api

      I have been through all the steps and have a functioning Oath access_token etc etc... I then GET https://mail.zoho.com/api/organization And get my zoid then GET http://mail.zoho.com/api/organization/<hidden>/accounts and get the account details, which

    • RTL Support for Webforms in Zoho CRM

      Dear Zoho CRM Support Team, We are writing to request an enhancement to the webform builder functionality within Zoho CRM. Currently, to create a webform in a right-to-left (RTL) language, the entire CRM instance must be set to RTL, which can be inconvenient

    • Imported contacts succesful but contacts do not show up in Contacts

      I imported +300 contacts. I can see them in import history. When clicking on a contact in import history I see all the imported contact details for any given contact. So import seems to be successful.   However the imported contacts do not show up in the contacts tab. Not in All contacts, and not in a filtered view where they absolutely should show up. The search function also does not find any imported contact.   Help?

    • Rich Text For Notes in Zoho CRM

      Hello everyone, As you know, notes are essential for recording information and ensuring smooth communication across your records. With our latest update, you can now use Rich Text formatting to organize and structure your notes more efficiently. By using

    • Saving sent email campaign as PDF

      I'm looking to add all campaigns sent to an archive folder in sharepoint. Is there anyway to accomplish this in Zoho Flow ? I'm falling at the first hurdle ... can I automatically save a sent campaign as a PDF to a folder location ?

    • Zoho Voice lance BYOC (Bring Your Own Carrier) : intégrez votre opérateur

      Pour accompagner sa croissance, une entreprise a besoin d’une infrastructure téléphonique flexible et évolutive. Les solutions de téléphonie s’adaptent aux exigences du centre de contact, tout en intégrant aisément les opérateurs locaux de votre choix.

    • Zoho Social API for generating draft posts from a third-party app ?

      Hello everyone, I hope you are all well. I have a question regarding Zoho Social. I am developing an application that generates social media posts, and I would like to be able to incorporate a feature that allows saving these posts as drafts in Zoho Social.

    • Digest Novembre - Un résumé de ce qui s'est passé le mois dernier sur Community

      Bonjour chers utilisateurs, Avec l'arrivée du dernier mois de l'année, il est temps de résumer les activités de novembre dans la communauté Zoho France. Ce mois-ci, Zoho Webinar se dote de deux nouvelles intégrations ! La première est avec Zapier : connectez

    • How do I create an update to the Cost Price from landed costs?

      Hi fellow Zoho Inventory battlers, I am new to Zoho inventory and was completely baffled to find that the cost price of products does not update when a new purchase order is received. The cost price is just made up numbers I start with when the product

    • E-Invoicing in Belgium with Zoho Books

      Starting January 1, 2026, Belgium is introducing mandatory electronic invoices (e-invoicing) for all B2B transactions between VAT-registered businesses. This means that invoices and credits notes must be exchanged in a prescribed digital format. How E-Invoicing

    • Lead Blueprint transition in custom list view

      Hi, Is It possible to insert the Blueprint transition label in a custom Canvas list view? I am using Lead module. I see the status, but it would be great if our users could execute the Blueprint right from the list view without having to enter the detailed

    • Announcing new features in Trident for Mac (1.30.0)

      Hello everyone! We’re excited to introduce the latest updates to Trident, bringing you a more seamless, intuitive, and secure communication experience. Let’s take a quick look at what’s new. Work with PST/EML files more efficiently. You can now do more

    • Open Form in Same window as Page from embedded Report

      I have a page that has an embedded report, as shown below. When I click the + sign to add a new record, the form shows up inside the page where the report was embedded. I know that I can add a custom action to the report grid or report detail view and

    • Weekly Sales Summary

      Is it possible to generate a weekly report in Zoho Books to show -$$ amount of estimates generated -# of estimates generated by Salesperson -$$ amount of Sales Orders created -$$ amount of Invoices generated

    • Pricing Strategies: #4 Counting on Discounts

      "Is there any chance I can get a little discount on this month's service?" Maya hears this almost every time at her fitness studio. She offers monthly subscription plans for various services, including yoga, strength training, wellness sessions, and personal

    • Introducing Query Workbench in Zoho CRM

      Hello everyone! We’re excited to announce the Query Workbench, a brand-new interface designed to improve developer experience of building Queries in Zoho CRM faster, simpler, and more intuitive. In the past, constructing queries required navigating across

    • Limitation with Dynamic Email Attachment Capture

      I've discovered a flaw in how Zoho Creator handles email attachments when using the Email-to-Form feature, and I'm hoping the Zoho team can address this in a future update. The Issue According to the official documentation, capturing email attachments

    • Add Customer in Books on Creator Form Submit Params

      Hi guys, Were integrating a creator app with books however what were doing is adding a books customer on submit of creator form.  We have some parameters but some fields aren't coping, All were seeing is the contact name in books,.  Any help of the params for this would be great. below is a sample of the script... response = zoho.books.createRecord("contacts", "XXXXXXXXX", { "contact_name" : input.Name, "address" : input.Email }); 

    • Admin asked me for Backend Details when I wanted to verify my ZeptoMail Account

      Please provide the backend details where you will be adding the SMTP/API information of ZeptoMail Who knows what this means?

    • Suggestion : link KB with Accounts

      Hi Zoho teams.  I think it could be good to link KB articles with  : accounts in order to easily  find articles dedicated to some account specificities. I tried to use tags , but tags are free text with not easy way  to retrieve it directly from ticket or list article for one tag. Tickets : It would be a good way to measure usage of KB directly from ticket when we don't need to copy/paste KB in solution. And : Great Tool , keep going ! 

    • Drag and Drop in Creator Application

      Hi, I am in the planning phase of a new application and I would like to use 'Drag and Drop' in the user interface of my new Creator application that I am sketching out, but I don't seem to be able to find any reference that this is available to developers. In my instance I have table of entries and I would like to be able to allow users to move an entry to another table (much like you do in your own interface when creating a Pivot Table report. In addition, I would like the user to be able to re-order

    • Is there any way to integrate Zoho with Zapier?

      Is there any way to integrate Zoho with Zapier? I'd like to use it to create a workflow, sharing posts from our Wordpress website to all our channels.

    • Popular Articles Report

      From data to decisions: A deep dive into ticketing system reports Content management teams can use various metrics to assess the effectiveness of knowledge base articles, improve content quality, and ensure articles are regularly updated. Predefined article

    • Invoice Ref. Field

      Hello Team, Currently, the Invoice Ref. field is set to a Number type with a maximum limit of 9 digits. However, we often receive customer invoices that contain up to 12 digits. In some cases, the invoice reference includes not only numbers but also letters

    • 60 Days Into Zoho - Tiktok Branding Startup -7 Questions?!

      Wsp Everybody I co-own a TikTok Branding / Consulting Startup & have been using Zoho for the past 60 days - Am now looking to make our overall operations & processes more Efficient & Effective! Curious to know how others are using the platform & what's

    • Next Page