Kaizen #95 How is a Widget used in a Blueprint?

Kaizen #95 How is a Widget used in a Blueprint?

Hey folks!!
Let's continue the discussion from Kaizen #23 and focus on exploring the concept of Widgets in Blueprints.

What are Widgets?

Zoho CRM's widgets are custom components that you can add to your Zoho CRM system to extend its functionality, provide additional data, or integrate with external services. These widgets can be built using Zoho's widget SDK (Software Development Kit), which allows developers to build and integrate custom applications directly into Zoho CRM.

What are Blueprints?

Blueprints in CRM help you design processes with pre-defined conditions and enable the system to follow a specific flow. A record can only move to the next state if it satisfies the given condition; otherwise, it remains in the same state. Blueprints help in converting leads into customers and developing your business. A transition button acts as an intermediary between two states, holding the condition and facilitating the flow within the system.

For instance, when a person approaches a bank for a loan, the bank needs to check the person's previous loan's status. They need to verify whether he has any existing loans or any defaults from other banks or from the same bank. The bank will provide loans based on the person's current and past borrowing behaviours. This can be achieved using widgets in blueprints.

The Flow Representation

                                              
Let's consider that a person named Shane has applied for a loan. His details will be in the "Loans" Module in the CRM. The bank employee responsible for processing the loan applications will review Shane's credibility and decide whether to approve or reject the loan.
  • If Shane has not settled any of his previous loans and has a bad repayment history, the bank will decline his new loan request, and the record will be marked as 'Rejected' state.
  • If there are few current active loans with a good repayment history, the bank will approve the loan, and the status of the newly sanctioned loan will be 'Active.'
In this use case, we cannot use any inbuilt CRM's blueprint options to show a popup of Shane's previous loan details and make a decision. Therefore, we will associate a custom widget to assist the banker in making the decision during the Blueprint transition.

How do I create a widget in the Blueprint?

  1. Go to Setup > Developer Space > Widgets.
  2. Click Create New Widget.


Note : The widget is hosted internally (Zoho) in the post. Please refer to this page to view the source code.

Sample Codes

index.html

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.   <title>User Details</title>
  5.   <link rel="stylesheet" href="index.css">
  6.   <script src="https://live.zwidgets.com/js-sdk/1.2/ZohoEmbededAppSDK.min.js"></script> 
  7. //Import this JS SDK to use SDK methods
  8.   <script src="index.js"></script>
  9. </head>
  10. <body>
  11.   <div class="container">
  12.     <h1>User Details</h1>
  13.     <div class="details">
  14.       <h2>Basic Details</h2>
  15.       <p><strong>Name:</strong> <span id="name"></span></p>
  16.       <p><strong>Email:</strong> <span id="email"></span></p>
  17.       <p><strong>PAN ID</strong> <span id="panId"></span></p>
  18.       <p><strong>Address</strong> <span id="address"></span></p>
  19.       <!-- Add more fields as needed -->
  20.     </div>
  21.     <div class="details">
  22.       <h2>Current Loan Requests</h2>
  23.       <p><strong>Loan ID:</strong> <span id="loanId"></span></p>
  24.       <p><strong>Loan Type:</strong> <span id="loanType"></span></p>
  25.       <p><strong>Amount:</strong> <span id="amount"></span></p>
  26.       <!-- Add more fields as needed -->
  27.     </div>
  28.     <div class="loan-history">
  29.       <h2>Loan History</h2>
  30.       <div class="loan-history-table">
  31.         <table>
  32.           <thead>
  33.             <tr>
  34.               <th>S. No</th>
  35.               <th>Bank Name</th>
  36.              .
  37.              .
  38.             .
  39.           </tr>
  40.           </thead>
  41.           <tbody id="loanHistoryTableBody">
  42.             <!-- Loan data will be dynamically populated here -->
  43.           </tbody> 
  44.         </table>
  45.       </div>
  46.     </div>
  47.   </div>
  48.   <div class="buttons">
  49.     <button id="button1" onclick="closePopup()">Decline</button>  //When the decline button is clicked, a method is called to close the widget pop-up
  50.     <button id="button2" onclick="moveToNextState()">Approve</button> //When the Approve button is clicked, a method is called to move the record to the next state.
  51.   </div>
  52. </body>
  53. </html>
To use the Zoho CRM APIs in the widget, you can use the API helpers provided in the JS SDK.

index.js

  1. ZOHO.embeddedApp.on("PageLoad", async function (data)
  2. //This event is used to get the page load data
  3.  {
  4.     console.log(data);
  5.     const loanRec = await ZOHO.CRM.API.getRecord({
  6.         Entity: data.Entity, // Here, 'Entity' is 'Loans Module'
  7.         RecordID: data.EntityId //The 'ID' of the record
  8.     });
  9.     console.log(loanRec.data[0].Recipient.id);
  10.     const contactRec = await ZOHO.CRM.API.getRecord
  11. //gettind contact details
  12. ({
  13.         Entity: "Contacts",
  14.         RecordID: loanRec.data[0].Recipient.id
  15.     });
  16.     const loanHistory = await ZOHO.CRM.API.getRelatedRecords
  17. //getting related records of the contact
  18. ({
  19.         Entity: "Contacts",
  20.         RecordID: loanRec.data[0].Recipient.id,
  21.         RelatedList: "Loan_History",
  22.         page: 1,
  23.         per_page: 200
  24.     })

  25. ZOHO.embeddedApp.init(); 
  26. //used to initialize widget
  27. function moveToNextState()
  28. {
  29.     ZOHO.CRM.BLUEPRINT.proceed(); 
  30. //ZOHO.CRM.BLUEPRINT.proceed() function from JS SDK, which helps in making the blueprint transition
  31. }
  32. //method used to move a record to the next state

  33. function closePopup(){
  34.     ZOHO.CRM.UI.Popup.close();
  35. }
  36. //method used to close the widget
  37. function displayBasicDetails(data) {
  38.     console.log(data);
  39.     document.getElementById('name').textContent = data.Full_Name;
  40.     .
  41.     .
  42. }
  43. }

Associating a Widget to the Blueprint

Add the hosted 'Check Profile' widget in the 'During' transition in the blueprint.
                  
Click Add > Widgets - The list of available widgets in your CRM will be displayed. 
States in this Blueprint:
  • Approval Pending : It is the default status of a newly created record in the loan module.
  • Active: If a person has a good loan repayment history, then the loan application will be sanctioned as per the banker's decision, and the status for the newly created loan will be 'Active'.
  • Closed : When a current loan is closed by the bank, the record's status will be 'Closed.'
  • Default : When any previous loans remain unsettled and the person is unavailable when a bank approaches for repayment on or after the payment due date, it is considered a fraudulent act. Such loans will be marked as "default". In such cases, the bank will decline the current loan request, and mark it as 'Rejected'.
  • Rejected : If a person has a bad repayment loan history or defaults, the bank will decline the loan, and the record's status will be 'Rejected'.
The below GIF represents a set of records waiting for approval from the bank under the Approval Pending custom view.

When the banker accesses the individual loan request, he/she will see the 'Check Profile' transition button. Using this transition, the banker can view the custom widget that displays the loan history and other details required to make a decision.
Here, the banking personnel can approve the loan by verifying the details. If the user has a goo   score and repayment history, the record will move to the Active state (newly requested loan).

If the applicant possesses any existing outstanding loans, lacks sufficient collateral, fails to provide verifiable income proof, or exhibits a history of defaults, the bank will decline the request, and the record will be moved to 'Rejected' state. This will help a bank to avoid fraudulent acts.


How will the CRM fetch a person's loan history from a third-party website?
To retrieve a person's current and previous loan status from a third-party website, banks employ different processes in different countries. 
The credit score will be tracked based on different Unique IDs issued by each country to their citizens. These details can be fetched from their respective websites using widgets.
For example :
  • USA - Social Security Number.
  • UK - The National Insurance Number.
  • Ireland - The Personal Public Service Number.
  • India - Permanent Account Number, etc.
We hope you found this post useful. Let us know your thoughts in the comment section or reach out to us at support@zohocrm.com
Cheers!!!
Further Reading

    Access your files securely from anywhere

        All-in-one knowledge management and training platform for your employees and customers.






                              Zoho Developer Community




                                                    • Desk Community Learning Series


                                                    • Digest


                                                    • Functions


                                                    • Meetups


                                                    • Kbase


                                                    • Resources


                                                    • Glossary


                                                    • Desk Marketplace


                                                    • MVP Corner


                                                    • Word of the Day


                                                    • Ask the Experts



                                                              • Sticky Posts

                                                              • Kaizen #198: Using Client Script for Custom Validation in Blueprint

                                                                Nearing 200th Kaizen Post – 1 More to the Big Two-Oh-Oh! Do you have any questions, suggestions, or topics you would like us to cover in future posts? Your insights and suggestions help us shape future content and make this series better for everyone.
                                                              • Kaizen #226: Using ZRC in Client Script

                                                                Hello everyone! Welcome to another week of Kaizen. In today's post, lets see what is ZRC (Zoho Request Client) and how we can use ZRC methods in Client Script to get inputs from a Salesperson and update the Lead status with a single button click. In this
                                                              • Kaizen #222 - Client Script Support for Notes Related List

                                                                Hello everyone! Welcome to another week of Kaizen. The final Kaizen post of the year 2025 is here! With the new Client Script support for the Notes Related List, you can validate, enrich, and manage notes across modules. In this post, we’ll explore how
                                                              • Kaizen #217 - Actions APIs : Tasks

                                                                Welcome to another week of Kaizen! In last week's post we discussed Email Notifications APIs which act as the link between your Workflow automations and you. We have discussed how Zylker Cloud Services uses Email Notifications API in their custom dashboard.
                                                              • Kaizen #216 - Actions APIs : Email Notifications

                                                                Welcome to another week of Kaizen! For the last three weeks, we have been discussing Zylker's workflows. We successfully updated a dormant workflow, built a new one from the ground up and more. But our work is not finished—these automated processes are


                                                              Manage your brands on social media



                                                                    Zoho TeamInbox Resources



                                                                        Zoho CRM Plus Resources

                                                                          Zoho Books Resources


                                                                            Zoho Subscriptions Resources

                                                                              Zoho Projects Resources


                                                                                Zoho Sprints Resources


                                                                                  Qntrl Resources


                                                                                    Zoho Creator Resources



                                                                                        Zoho CRM Resources

                                                                                        • CRM Community Learning Series

                                                                                          CRM Community Learning Series


                                                                                        • Kaizen

                                                                                          Kaizen

                                                                                        • Functions

                                                                                          Functions

                                                                                        • Meetups

                                                                                          Meetups

                                                                                        • Kbase

                                                                                          Kbase

                                                                                        • Resources

                                                                                          Resources

                                                                                        • Digest

                                                                                          Digest

                                                                                        • CRM Marketplace

                                                                                          CRM Marketplace

                                                                                        • MVP Corner

                                                                                          MVP Corner







                                                                                            Design. Discuss. Deliver.

                                                                                            Create visually engaging stories with Zoho Show.

                                                                                            Get Started Now


                                                                                              Zoho Show Resources

                                                                                                Zoho Writer

                                                                                                Get Started. Write Away!

                                                                                                Writer is a powerful online word processor, designed for collaborative work.

                                                                                                  Zoho CRM コンテンツ




                                                                                                    Nederlandse Hulpbronnen


                                                                                                        ご検討中の方




                                                                                                                • Recent Topics

                                                                                                                • Do not use isnull()

                                                                                                                  Does not always return booleans. Can also return null. Never use this function. Just use var==null instead.
                                                                                                                • Trying to access records in a custom module in Zoho Desk and not having luck

                                                                                                                  I've built a custom module in Zoho Desk and am using a custom function to query the records in the module and I'm not having any luck. The only way I have found to retreive a record is by getting it by its recordID (the long zoho assigned one). The function
                                                                                                                • Organization wide Account and Contacts Visibility/Sharing Capabilities?

                                                                                                                  Has anyone figured out a way to make visibility or sharing of Accounts and Contacts to be available across the entire organization without having to have every individual user edit their Sharing permissions? For our sales folks they need to be able to
                                                                                                                • Is there a way to configure dark mode for Campaigns emails that go out to customers?

                                                                                                                  I've found a lot of information on how to configure dark mode for my (The user) personal Zoho workspace and email, but is there any way to edit dark mode settings on emails that we send out to customers via campaigns?  We sent out a test email the other
                                                                                                                • When Does WorkDrive integrate with Books?

                                                                                                                  When Does WorkDrive integrate with Books?
                                                                                                                • How do I import Connected Records for a Deal?

                                                                                                                  Can you point me to an example of the CSV file that would add related records to an existing CRM Deal? I imported a Deal, then tried importing a connected record using a unique ID that references the Deal ID, but it doesn't attach it to the Deal rec
                                                                                                                • FSM integration with Books

                                                                                                                  Hi, I have spent a few months working with FSM and have come across a critical gap in the functionality, which I find almost shocking....either that, or I am an idiot. The lack of bi-directional sync between Books and FSM on Sales Orders/ Work Orders
                                                                                                                • How to close an estimate ?

                                                                                                                  Hello, I have created estimates, and converted them to invoices to get 50% payment. Now I have 2 cases where the estimate stills shows status partially invoiced, however: 1. for one of them, project stopped half way, so the remaining part will never be
                                                                                                                • Power up your Kiosk Studio with Real-Time Data Capture, Client Scripts & More!

                                                                                                                  Hello Everyone, We’re thrilled to announce a powerful set of enhancements to Kiosk Studio in Zoho CRM. These new updates give you more flexibility, faster record handling, and real-time data capture, making your Kiosk flows smarter and more efficient
                                                                                                                • Sharing Tickets to a team within a department

                                                                                                                  Hi there, We have a need for one department to be able to share tickets to a specific team within a department, I'm wondering if this is possible? All the shared tickets are going into the 'Shared Tickets' view for the whole department but is there a
                                                                                                                • How do you print out the invoices comments

                                                                                                                  I have some invoices where i need to print out the comments that show when reminders and etc were sent how do we print those out in Zoho Books.
                                                                                                                • Unable to load a specific image

                                                                                                                  Hi I am trying to upload an svg file, which reports that there is "a problem with the file", but does not say what sort of problem. I can't find anything which says which files are supported, so it may be it does not support svg. (which would be a real shame) The file itself will open in either Firefox or Chrome without problem. For the moment I am using a png file, which does not zoom well of course. David
                                                                                                                • Why does the Address field show the wrong map location even with a correct Pincode?

                                                                                                                  I am noticing an issue with the Address field map in Zoho Creator. When I enter a city name that exists in multiple locations within the same state, the map sometimes points to the wrong area even if I have entered the correct Pincode. Currently, it seems
                                                                                                                • Uploaded files are not included when using "Include user submitted data" in Email Notification

                                                                                                                  In Send Email notification workflow in Zoho Creator, there is an option called "Include user submitted data" which allows the email to contain all the form submission details. However, when this option is enabled, files or images uploaded through File
                                                                                                                • Books <-> CRM synchronisation with custom Fields

                                                                                                                  Hello, We are synchronising Books Customers with CRM Accounts. In CRM Accounts I set up last year a "segments" multiselect field shown below In Books, I set up a custom multi-select field with the same value as in the CRM And set up the synchronisation inside Books. Want to synchronise the Books Segments with the CRM Segments, but the later doesn't exist, and another non-existing is there ?! First, I don't understand where the field Segmentation is coming from. Second, I set CRM Segmentation to sync
                                                                                                                • CRM x WorkDrive: We're rolling out the WorkDrive-powered file storage experience for existing users

                                                                                                                  Release plan: Gradual rollout to customers without file storage add-ons, in this order: 1. Standalone CRM 2. CRM Plus and Zoho One DCs: All | Editions: All Available now for: - Standalone CRM accounts in Free and Standard editions without file storage
                                                                                                                • Archive Option in Conversation View

                                                                                                                  Hello, I have a suggestion\request to add an "Archive Thread" button in conversation view of Zoho Mail. The best suggestion I have is to put an "Archive Thread" button next to the "Label Entire Thread" button in conversation view. Most users don't just
                                                                                                                • Outlook/Hotmail Blocking Zoho SMTP IPs (S3150)

                                                                                                                  We are currently facing a serious deliverability issue with Zoho SMTP while sending transactional OTP emails for our production application. Emails sent to Outlook / Hotmail addresses are being rejected with the following error: 550 - 5.7.1 Unfortunately,
                                                                                                                • Outlook is blocking incoming mail

                                                                                                                  Outlook is blocking all emails sent from the Zoho server. ERROR CODE :550 - 5.7.1 Unfortunately, messages from [136.143.169.51] weren't sent. Please contact your Internet service provider since part of their network is on our block list (S3150). It looks
                                                                                                                • Track Marketing Automation Campaigns in Zoho CRM

                                                                                                                  Hello, I've been searching but haven't found the exact answer to this question. I am looking to track Marketing Automation email campaigns and activities inside of Zoho CRM. Use Case: Action: Prospect Submits A Lead Form Outcomes: Prospect created in
                                                                                                                • 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.
                                                                                                                • Temporarily rate limited due to IP reputation.

                                                                                                                  We have suddenly started receiving the following Mail Delivery Status Notification: Diagnostic-Code: 4.7.650 The mail server [136.143.184.12] has been temporarily rate limited due to IP reputation. For e-mail delivery information, see https://aka.ms/postmaster
                                                                                                                • 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
                                                                                                                • IMPORTANT: It doesn´t search for letters with portuguese characters.

                                                                                                                  Some of my articles have for example the word "vídeo". But if I search for "vídeo" it doesn´t find them. If I search for "video" it does find them. Idealy, it should find the articles either way. But if I have to choose, it would be better to find the
                                                                                                                • IMPORTANT: It doens´t show full article name on search - Should add line break

                                                                                                                  When we search for articles, it doesn´t show the full name. There should be a line break so the user can see the full article name, otherwise the user can´t know if that´s the article he/she is looking for. This is very important, otherwise the user has
                                                                                                                • Zoho Books - Payment Gateway - Revolut

                                                                                                                  Hi Books Team, My feature request if to include the popular platform Revolut as a payment collection option on invoices in Zoho Books. Please upvote if you are also looking for this option.
                                                                                                                • Zoho Books | Product updates | January 2026

                                                                                                                  Hello users, We’ve rolled out new features and enhancements in Zoho Books. From e-filing Form 1099 directly with the IRS to corporation tax support, explore the updates designed to enhance your bookkeeping experience. E-File Form 1099 Directly With the
                                                                                                                • Kaizen #233 - Generating AI-powered Follow-up Emails Using CRM Functions and Widgets

                                                                                                                  Hey everyone! Welcome back to another interesting post in the Kaizen series! Sales teams regularly capture interaction notes in CRM after speaking with prospects. However, drafting a follow-up email that reflects the conversation context can be repetitive
                                                                                                                • Connect Bank in Zoho Books

                                                                                                                  Can I connect UOB or Ariwallex in Zoho Books?
                                                                                                                • Using MPN across multiple SKUs and inventory tracking

                                                                                                                  I have several different SKU's that share a common MPN and would like to track inventory by MPN. SKU1 has MPN1 assigned SKU2 has MPN1 assigned Here is an example If I start with 5 of MPN 1 in stock I want each SKU1 and SKU2 to show as 5 in stock, If I
                                                                                                                • Extend Zoho Canvas Customization to Zoho Creator Forms and Reports

                                                                                                                  Currently, Zoho Canvas allows users to design and customize the UI of Zoho CRM modules with a much better visual experience. This helps organizations create cleaner layouts, improve usability, and design interfaces that match their workflows. However,
                                                                                                                • Marketing Tip #1: Optimize item titles for SEO

                                                                                                                  Your item title is the first thing both Google and shoppers notice. Instead of a generic “Leather Bag,” go for something detailed like “Handcrafted Leather Laptop Bag – Durable & Stylish.” This helps your items rank better in search results and instantly
                                                                                                                • Feature Enhancement Request – Text Formatting Options in Item Description (Zoho Books/Quotes Module)

                                                                                                                  Dear Zoho Development Team, Greetings from Radiant360 Integrated Technical Services LLC. We would like to bring to your attention a functional limitation we've encountered within the Item Table / Quote Description section of Zoho Books (and Zoho CRM Quotes).
                                                                                                                • ZOHO Books Query

                                                                                                                  Good day, Can someone please advise. I recently migrated from ZOHO Invoice to ZOHO Books. No that I want to use the inventory on Books I cant as all my items have transaction history. The person I spoke to at ZOHO said I need to create a new Company profile
                                                                                                                • Best way to schedule bill payments to vendors

                                                                                                                  I've integrated Forte so that I can convert POs to bills and make payments to my vendors all through Books. Is there a way to schedule the bill payments as some of my vendors are net 30, net 60 and even net 90 days. If I can't get this to work, I'll have
                                                                                                                • ZOHO.CRM.UI.Record.open not working properly

                                                                                                                  I have a Zoho CRM Widget and in it I have a block where it will open the blocks Meeting like below block.addEventListener("click", () => { ZOHO.CRM.UI.Record.open({ Entity: "Events", RecordID: meeting.id }).catch(err => { console.error("Open record failed:",
                                                                                                                • 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
                                                                                                                • inventory removal at packing list or shipment.

                                                                                                                  currently our system is set to remove inventory at invoice. This is creating an inventory nightmare? Is it possible to change the settings to remove the item from inventory at either the packing slip stage or shipping the item.
                                                                                                                • How to add employee and not invite them to log in?

                                                                                                                  I want to add 50 employees, but invite them only when everything will be configured and ready. Is it possible? Should we create employee profiles and then convert them later? Thank you,
                                                                                                                • How is Your eCommerce Experience w/Zoho Inventory?

                                                                                                                  First off, I'm SUPER grateful for the advent of Zoho Inventory and now the Zoho Commerce Suite. Overall, Inventory is a great product, especially for customers without an eCommerce presence. For eCommerce companies (especially those shipping more than ~10 packages/day), however, there are certain drawbacks that keep my clients from moving over to Zoho Inventory: Cons: 1. Invoice + Package Creation from Shopify/Other eCommerce Integrations: Zoho Inventory makes the somewhat perplexing decision to
                                                                                                                • Next Page