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

    • Can't change form's original name in URL

      Hi all, I have been duplicating + editing forms for jobs regarding the same department to maintain formatting + styling. The issue I've not run into is because I've duplicated it from an existing form, the URL doesn't seem to want to update with the new

    • Can't rename groups on Mac desktop app

      I'm working on an up-to-date Mac with a freshly downloaded Notebook app. I'm trying to rename a group within a notebook. Here I have, left to right, a note, a group, and a note. I select the group. On the top left, I select Action. On the dropdown, "Rename"

    • Strange behavior in CRM Number Field – Characters allowed but not "e"?

      Hi everyone, Has anyone faced this strange issue in Zoho CRM? In a Number field, it is possible to type some characters, but the character "e" cannot be entered. This was really surprising to me. Normally, a number field should restrict all characters

    • Best Way to Manage Approvals Within Blueprint Stages?

      Hi, I am working on a requirement involving Blueprint and approval logic in Zoho CRM and would appreciate some guidance. I understand that approval processes do not trigger when a record is currently within a blueprint, which makes it challenging to implement

    • Marketing Tip #25: Grow your social presence with a simple posting routine

      Consistency is one of the biggest growth drivers on social media. Regular content keeps your store visible and helps customers remember you. Even 3–4 posts a week can build momentum over time. The easiest way to stay consistent is to stop trying to create

    • How to update "Lead Status" to more than 100 records

      Hello Zoho CRM, How do I update "Lead Status" to more than 100 records at once? To give you a background, these leads were uploaded or Imported at once but the lead status record was incorrectly chosen. So since there was a way to quickly add records in the system no matter how many they are, we are also wondering if there is a quicker way to update these records to the correct "Lead Status". I hope our concern makes sense and that there will be a fix for it. All the best, Jonathan

    • Bring your own credentials (BYOC) for connections in Zoho Creator

      Hello everyone, We're excited to announce an important step forward in how integrations and authentications work in Zoho Creator. Zoho Creator is a versatile platform for integrations, enabling you to connect with thousands of third-party services using

    • Project Management Bulletin: March, 2026

      We are passionate about equipping our users with efficient solutions that help them run their businesses successfully. Our collective efforts over the past 2 years have culminated in the launch of Sprints 3.0— built with reliable features, impactful integrations,

    • Composite items inside of composite items; bill of materials needed

      Hi Zoho and Everyone, I am evaluating whether Zoho Inventory will work for my small business. I grow and harvest herbs and spices but also get from wholesalers. I use all these items to make herbal teas, but also sell them as individual items on my Shopify store and Etsy. I discovered the composite item bundling and am wondering if I could get some assistance since there is no bill of materials: Our herbal company's best selling tea is a sleepytime tea. Sleepytime Tea can be purchased in three weights

    • Automation Series: Sync Task Status with Zoho Desk Tickets

      In Zoho Projects, you can automatically close and reopen an associated Zoho Desk ticket when the status of a task is changed. This syncs the current state of the task with the support ticket without manual updates. For instance, a support team handling

    • Auto-Generate Line Numbers in Item Table Using HTML & CSS Counters (Zoho Books & Zoho Inventory Custom Templates)

      <div> <style> /* Start counter from 0 inside tbody */ tbody#lineitem { counter-reset: rowNumber; } /* Increment counter for each row */ tbody#lineitem tr { counter-increment: rowNumber; } /* Show counter value in first column */ tbody#lineitem tr td:first-child::before

    • Does zoho inventory need Enterprise or Premium subsrciption to make Widgets.

      We have Zoho One Enterprise and yet we can't create widgets on inventory.

    • Zoho CAMPAIGNS working hours

      Hi I use Campaigns Automation workflows to automate follow-ups to my Leads. I discovered this weekend that emails are being sent out on Sundays. How do I limit my Campaigns outgoing emails to business working hours? This is very important! Thanks, D

    • Depositing funds to account

      Hello, I have been using Quickbooks for many years but am considering moving to Zoho Books so I am currently running through various workflows and am working on the Invoicing aspect. In QB, the process is to create an invoice, receive payment and then

    • Create Receipt of a Donation (not a sale)

      We are a non-profit organization that receives general donations. How do I create a receipt of payment for the donor and categorize the payment as a Gift? I tried the method of creating an invoice; however that automatically created a "Sales" transaction

    • Function #2: Create a Deal in Zoho CRM when an Estimate is created in Zoho Books

      For those who use Zoho CRM integrated with Zoho Books, here's a nifty function that helps you optimize your sales process by adding a Deal in Zoho CRM whenever an estimate is created in Zoho Books. Custom Function: To create the custom function, go to

    • New Custom View -Sorting the Custom fields

      While creating a New Custom View in invoice , Customers, Bills ,expense etc , the sorting of custom fields are not available , a query function "order by / sort by  " may also be included in  Define new criteria module  which will be more beneficial to

    • Grouping Undeposited Funds to Move to other accounts

      In the bank option it would be nice to check what transactions in undeposited funds I want to move to other accounts. Then while checking this it can accumulate totals and created whats essentially a deposit slip. Once the transaction is moved it should

    • Sync your CRM Tasks with Zoho Projects

      Zoho Projects integration with Zoho CRM helps you manage your tasks more efficiently. You can create all project related activities right inside your CRM using this integration. Create new portal or associate an existing portal, add projects to the portal,

    • Zoho CRM strips whitespace in text fields

      When editing field text with multiple spaces: CRM - both UI and API trim / compress the whitespace to a single space when saving: Is this known / expected / documented behaviour?

    • Custom Button makes scroll bar go down in report

      I have a report with a Custom button called Completed. A colleague mentionned to me that when he pressed this custom button it scrolled down the page which is annoying since he want to stay at the same space on the repoort. There is no reload linked to

    • Quickbooks Integrations Stopped Working

      All of our Quickbooks integrations have stopped working. I am checking in to see if: a) this is a known issue b) if anyone else is having this issue. As usual, Zoho support is unavailable.

    • Incorrect Functioning of Time Logs API (Version 3)

      We need to fetch the list of time logs for each task for our company internal usage. We are trying to achieve it by using the next endpoint: https://projects.zoho.com/api-docs#bulk-time-logs#get-all-project-time-logs Firstly, in the documentation the

    • Dynamic image in form works in the app but not on the customer portal.

      img = frm_Fichas[ID == input.Nombre].Foto; imgno = Nophoto[ID2 = 1].Image; if(len(img) > 1) { img = img.replaceAll("/sharedBy/appLinkName/",zoho.appuri); img = img.replaceAll("viewLinkName","Fichas_de_personal_public"); img = img.replaceAll("fieldName","Foto");

    • Uplifted homepage experience

      Editions: All editions. Availability update: 17th February 2026: All editions in the CA and SA DC | JP DC (Free, Standard and Professional editions) 23 February 2026: JP (All Editions) | AU, CN (Free, Standard, Professional editions) 27 February 2026:

    • Approval Workflow for Purchase Orders Abrir

      The requirement is , that all purchase orders greater than or equal to 5000 go through an approval process from certain people, but within books I only see that the approvers can be by levels or any approver but we cannot enter a rule like these. Can

    • WeTravel + Zoho CRM Integration - Has Anyone Built a Connector or Extension?

      Hi all, I'm exploring options for integrating Zoho CRM with WeTravel (booking & payment platform for tour operators). Zapier seems to be the common method but seems limited. I'm wondering if anyone in the community has developed a more comprehensive solution,

    • Option in pipeline deal to select which hotel or branch or store if client has more than one local store

      Hi, I would like to know if there is an option in the deal pipeline to select which hotel, branch, or store a deal is related to—if the company has more than one location. For example, I have a client that owns several hotels under the same company, and

    • Undo article like/dislike

      It seems to be not possible to undo your like/dislike for an article. Would be great if you can. Kind regards, Helen

    • Nested notebooks

      Dear Sir/Madam, I would like to know if it is possible to nest notebooks. It would be very helpful when there are too many, as it would improve organization. Thank you for your response. Best regards.

    • Tax in Quote

      Each row item in a quote has a tax value. At the total numbers at the bottom, there is also a Tax entry. If you select tax in both of the (line item, and the total), the tax doubles. My assumption is that the Tax total should be totalling the tax from

    • Dynamically Fetching Lookup Field Display Value

      I have an audit trail form, Audit_Changes, that tracks old vs new values across different forms. For lookup fields, the old/new value is the ID, but I also need the display value. What's a best practice for dynamically fetching the display value of the

    • Stop Scrolling, Start Asking: Meet Zia for Your Files

      Hey everyone 👋 The era of 'scrolling and searching' is officially over. Whether it's a dense legal contract or a long meeting recording, searching for specific details is a massive time-sink. We think you should be able to interact with your files, not

    • How do I open MSG files in Microsoft Word?

      If you want to open MSG files in Microsoft Word is not natively supported, as MSG is an email file format created by Microsoft Outlook. However, there are professional approaches to access MSG content in Word. First, open the MSG file in Outlook and copy

    • Unable to charge GST on shipping/packing & Forwarding charges in INDIA

      Currently, tax rates only apply to items. It does not apply tax to any shipping or packing & forwarding charges that may be on the order as well. However, these charges are taxable under GST in India. Please add the ability to apply tax to these charges.

    • How to add packing & forwarding charge in purchase order & quotation???

      Hello Zoho Team I have just started using Zoho for my company and I wanted to make purchase order. My supplier charges fix 2% as packing & forwarding on Total amount of material and then they charge me tax. For example, Material 1 = 100 Rs Material 2

    • How to create a boxplot chart in Zoho Analytics?

      Hi, I'm looking forward to making a boxplot in Zoho Analytics, either with all my data or with a time segmentation. No documentation or YouTube video explaining that was found. I guess this is a feature gap. How feasible would it be to add this to Analytics?

    • What are the create bill API line item requiered fields

      While the following documentation says that the line items array is requiered it doesn't say what if any files are requiered in the array. Does anyone know? API documentation: https://www.zoho.com/inventory/api/v1/bills/#create-a-bill I'm trying to add

    • Budget function?

      Has there been any progress on the development of a budget function in Zoho Books / Invoice? It's impossible to grow/run a business without some kind of budgeting. If I've missed something, apologies, but there seems little point in using Zoho Books without a budgeting function. Otherwise, I'm very impressed with the Zoho apps and the support. Keep up the great work.

    • Connecting Zoho Inventory to ShipStation

      we are looking for someone to help connect via API shipStation with Zoho inventory. Any ideas? Thanks. Uri

    • Next Page