Zoho CRM ZET Widget – Product Costing & Quote Generator

Automated quoting tool embedded directly in Zoho CRM to streamline service and item pricing.

While customizing Zoho CRM for Taylor Movers, I encountered a major challenge in their costing and quotation process.

Taylor Movers is a moving and logistics company, and unlike typical service businesses, their services depend heavily on materials, distance, labor, transport, and additional charges. This meant that every quote required multiple cost items—sometimes 5, 20, or even more—to be calculated accurately before saving a deal.

The existing process relied heavily on:

Remembering item names
Manually calculating totals
Entering prices without visibility of the final amount

This resulted in errors, slow quoting, and inconsistent pricing for the sales team.

The Problem

The sales team needed:

A single place where all costing items are listed
Predefined prices per item
A simple way to enter units
Automatic calculation of:
- Unit price
- Item total
- Grand total
The ability to review totals before saving

Why Existing Options Didn’t Work

Zoho CRM Forms
❌ Not flexible enough for dynamic calculations and grouped items
Zoho Creator HTML Snippet
❌ JavaScript cannot modify the page once it loads
❌ Limited interactivity for real-time pricing
External Web App
❌ Added hosting costs
❌ Increased maintenance
❌ Extra authentication complexity

At this point, the best solution was a Zoho CRM Embedded Widget.

The Solution: Zoho CRM ZET Widget

I built a custom Zoho CRM widget using ZET (Zoho Extension Toolkit) that runs entirely inside Zoho CRM, with no external server.

This widget acts as an interactive costing and quote builder, embedded directly inside the Deal record.

How the Widget Works

1. Deal Context Awareness

When the widget loads, it automatically fetches:

Deal Name
Contact & Account
Move Type & Category
Proposed Move Date
Phone & Email

This ensures the costing is always linked to the correct deal.

2. Item Listing & Costing Table

Fetches products from the Products module
Filters only items marked for local costing
Displays items in structured tables
Each item shows:
- Name
- Unit price
- Units input
- Total price (calculated in real time)

The sales team only needs to enter quantities—no need to remember item names or prices.

3. Schedule-Based Pricing

A Schedule dropdown acts as a pricing multiplier:

Selecting a schedule updates unit prices dynamically
VAT and Commission items remain fixed
This allows flexible pricing without editing product records

4. Additional Cost Inputs

Separate fields handle non-item costs such as:

Destination costing
Phone costing
Local costing
Transit costing

These are added automatically into the Grand Total.

5. Real-Time Calculations

As the user types:

Item totals update instantly
Grand total recalculates automatically
Errors are reduced before saving

6. Quote Creation & Deal Update

When saved:

A Quote record is created in Zoho CRM
All selected items are added as Quoted Items
The quote is linked to:
- Deal
- Contact
- Account
- Schedule
The Deal Amount is updated automatically

Technical Stack

Zoho CRM Embedded App (ZET)
JavaScript (Vanilla JS)
Zoho CRM APIs
Tailwind CSS
HTML5

Key Challenges & Growth

This project pushed me outside my comfort zone.

Before this:

I wasn’t very confident with JavaScript
I had little exposure to Node.js-based tooling like ZET

Through this project, I learned:

Zoho CRM Embedded App lifecycle
Advanced Zoho CRM API usage
Dynamic DOM manipulation
Real-time pricing logic
Building production-ready internal tools

Business Impact

✅ Faster quote creation
✅ Reduced pricing errors
✅ Improved sales confidence
✅ Consistent costing logic
✅ No external infrastructure cost

Final Thoughts

This widget transformed a manual, error-prone costing process into a guided, automated, and reliable workflow—fully inside Zoho CRM.

It’s a practical example of how custom Zoho CRM development can solve real business problems without over-engineering or unnecessary tools.