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.     })

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

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

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








                      Zoho Campaigns Resources




                            Zoho Developer Community



                                Bootcamp
                                Community
                                Pricing
                                Webinars
                                What's New
                                Integrations
                                Contact Support
                                Contact Sales
                                  Zoho Survey Resources
                                    Features
                                    Survey Templates
                                    Integrations
                                    Community
                                    iOS Mobile Surveys
                                    Pricing
                                    Android Mobile Surveys
                                    Insurvey Blogs
                                    Insight Blogs
                                    Tips & Tricks






                                                Latest Feature Updates

                                                  • Desk Community Learning Series


                                                  • Digest


                                                  • Functions


                                                  • Meetups


                                                  • Kbase


                                                  • Resources


                                                  • Glossary


                                                  • Desk Marketplace


                                                  • MVP Corner


                                                  • Word of the Day


                                                  • Ask the Experts




                                                      Zoho SalesIQ Resources


                                                            Manage your brands on social media
                                                            Access Zoho Social

                                                              Zoho Pagesense Resources


                                                                  Zoho TeamInbox Resources

                                                                    Zoho DataPrep 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 Writer

                                                                                              Get Started. Write Away!

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

                                                                                                Zoho CRM コンテンツ




                                                                                                  Nederlandse Hulpbronnen


                                                                                                      ご検討中の方




                                                                                                            • Recent Topics

                                                                                                            • Rotate an Image in Workdrive Image Editor

                                                                                                              I don't know if I'm just missing something, but my team needs a way to rotate images in Workdrive and save them at that new orientation. For example one of our ground crew members will take photos of job sites vertically (9:16) on his phone and upload

                                                                                                            • Introducing Zoho Creator's 2025 Release Projection 2

                                                                                                              Hello Creators! I'm Prakash, from the Creator product management team, and today I'm delighted to unveil our next set of features as part of Release Projection 2 for 2025. With thoughtful analysis and planning, we've curated powerful new capabilities

                                                                                                            • Create custom rollup summary fields in Zoho CRM

                                                                                                              Hello everyone, In Zoho CRM, rollup summary fields have been essential tools for summarizing data across related records and enabling users to gain quick insights without having to jump across modules. Previously, only predefined summary functions were

                                                                                                            • Help with Filtering Records, HTML Pages, and Automatic File Uploads in Zoho Creator

                                                                                                              Hi Zoho Creator Community, I’m building a Zoho Creator application and need guidance on a few features I’ve been struggling with. I want to implement them safely and efficiently, and I’d appreciate any examples, tips, or best practices. I want users to

                                                                                                            • Creator Change History: Ways to improve

                                                                                                              Hi Everyone, Recently been working in developing this change history(an idea from Zoho Forms) - unlike forms that you can this with a click but using Creator, we can use "old" keyword. The concept I come up with is to put the result in a table however,

                                                                                                            • How to Send Email from within a custom module (with or without an email template)

                                                                                                              It is possible to send an email from the Deals module. However, I can't find a way to send an email from any of our custom modules. I have tried adding an email field to the modules (even though we don't really want one or need it there). That doesn't

                                                                                                            • Convert invoice from zoho to xml with all details

                                                                                                              How to convert an Invoice to XML format with all details

                                                                                                            • In arattai received message can't be deleted

                                                                                                              The issue has been noticed in following: arattai app (Android) arattai app (Window) arattai web While the message posted by me may be deleted, the ones received from others can't be. The item <Delete> change to <Report> when the message is a received

                                                                                                            • Zoho Inventory - Composite Items - Assembly - Single Line Item Quantity of One

                                                                                                              Hi Zoho Inventory Team, Please consider relaxing the system rules which prevent an assembly items from consisting of a single line item and outputting a quantity of 1. A client I'm currently working with sells cosmetics and offers testers of their products

                                                                                                            • Format a "return" message

                                                                                                              Good day, Is there a way to format the message of the "return" function in CRM deluge script?

                                                                                                            • CRM x WorkDrive: File storage for new CRM signups is now powered by WorkDrive

                                                                                                              Availability Editions: All DCs: All Release plan: Released for new signups in all DCs. It will be enabled for existing users in a phased manner in the upcoming months. Help documentation: Documents in Zoho CRM Manage folders in Documents tab Manage files

                                                                                                            • Is there a way to automatically add Secondary Contacts (CCs) when creating a new ticket for specific customers?

                                                                                                              Some of our customers want multiple contacts to receive all notifications from our support team. Is there a way to automatically add secondary contacts to a ticket when our support team opens a new ticket and associates it with an account? This would

                                                                                                            • Does Zoho Learn integrate with Zoho Connect,People,Workdrive,Project,Desk?

                                                                                                              Can we propose Zoho LEarn as a centralised Knowledge Portal tool that can get synched with the other Zoho products and serve as a central Knowledge repository?

                                                                                                            • Shopify Extension no longer working in CRM

                                                                                                              Zoho CRM and Extension are no longer working properly. We have used Shopify Basic for years. All of the sudden it stopped working, then started working again, and now no longer working again. There are several ways for Personal Information to sync from

                                                                                                            • Add Comprehensive Accessibility Features to Zoho Writer

                                                                                                              Hello Zoho Writer Team, We hope you are doing well. We would like to submit a feature request to enhance Zoho Writer with a full set of accessibility tools, similar to the accessibility options already available in the Zoho Desk agent interface. 🚧 Current

                                                                                                            • If there’s a batch at the end, the ‘mark as inactive’ function doesn’t work.

                                                                                                              when my batch has a date to batch end and I "mark as inactive" he batch does not obey the status and reactivates the batch.

                                                                                                            • Changing an agents email address

                                                                                                              How do you change an agent's email address? I keep getting a red circle even though I am an admin. And on one of my agents he has two email addresses? How is that possible?

                                                                                                            • Having Trouble Opening The Candidate Portal

                                                                                                              Recently am having trouble opening the Candidate Portal. It keeps loading but cannot display any widgets. Tried Safari, Chrome and Edge. Non of them work. Please solve the problem ASAP.

                                                                                                            • Signature issue

                                                                                                              Problem: The signature does not appear when replying or forwarding an email. solve issue: settintgs/Signature Check option place a signature above the content with quotation marks

                                                                                                            • Feature Suggestion for Zoho Websites – Inspired by Squarespace Systems

                                                                                                              Dear Zoho Team, I’m a Zoho user and also a Squarespace Platinum Circle member, and I recently noticed the launch of Zoho Websites in India. I wanted to share some ideas for features that could enhance the platform for professional users and agencies.

                                                                                                            • Customer happiness customisation

                                                                                                              Hi, I was wondering if it's possible to somehow customise to whom and when customer happiness request is sent? Can you enable it only for selected tickets for example based on workflow or any other criteria (customer name, tag or anything else)? Also

                                                                                                            • Custom View - Sort by Custom Field

                                                                                                              I created a custom field for our Engineering team to know which tickets to work first by numbering them.  I created a custom view to general data which includes the Engineering Priority.  However, I cannot sort the Engineering Priority column ascending

                                                                                                            • Advanced Deluge help needed with custom function and COQL limits

                                                                                                              I have a scheduled function that takes a snapshot of specific metrics and saves them to a custom module. However I'm struggling with the limits of COQL. I attach my full code, but an example of the issues I'm having is that it's erroring with a 'Limit

                                                                                                            • 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

                                                                                                            • Default Sorting on Related Lists

                                                                                                              Is it possible to set the default sorting options on the related lists. For example on the Contact Details view I have related lists for activities, emails, products cases, notes etc... currently: Activities 'created date' newest first Emails - 'created

                                                                                                            • Microsoft Teams now available as an online meeting provider

                                                                                                              Hello everyone, We're pleased to announce that Zoho CRM now supports Microsoft Teams as an online meeting provider—alongside the other providers already available. Admins can enable Microsoft Teams directly from the Preferences tab under the Meetings

                                                                                                            • Mass (Pull back) (Close WOs) (Close APs)

                                                                                                              Hi develop team. Just idea because Zoho FSM is great but its too manual. we have a lot of task to do every day and the system needs to have more features to automatic our tasks. I need to close several WOs, APs and Pull Back per day. Please we need mass

                                                                                                            • Outdated state in mexico

                                                                                                              Hello Zoho team, the drop down to add the state for customers, when they introduce their state in mexico has a city named “Distrito Federal” that name changed many years ago to “ciudad de mexico”. could you please update this so my clients can find the

                                                                                                            • Zoho Indeed Intergation not pulling candidate details

                                                                                                              We have recently integrated zoho with indeed. Prior to this our candidates came into the candidates tab via the zoho.resumes email address from indeed and it pulled through the candidates mobile number, and majority of the time a postcode. However since

                                                                                                            • Custom View of tickets created today

                                                                                                              How can I create a custom view that list all my ticked created in the current date? Currently, if I select the "Created Time" criteria, the "Current Time" option does not work as today. Actually, I don't know how it works this "Current Time".

                                                                                                            • Lifecycle Reports

                                                                                                              From data to decisions: A deep dive into ticketing system reports A lifecycle report captures and visualises the sequential states that a ticket undergoes across its lifespan. For instance, when a customer submits a support ticket for a faulty product,

                                                                                                            • Zoho Forms - Print Button on Forms

                                                                                                              Hi Forms team, I'm replicating a form for a client which is currently based on JotForm. I noticed that at the end of the form there is a button to print the completed form. I thought this would be something worth sharing and a nice to have in Zoho Forms.

                                                                                                            • Putting Watermark on Zoho Sheet

                                                                                                              Can this be done?

                                                                                                            • Validation function not preventing candidates under 18 or over 30 from submitting the web form

                                                                                                              Hello everyone, I’m trying to create a validation rule for the Candidate Webform in Zoho Recruit. I added a custom field called “Date of Birth”, and I want to make sure that candidates cannot submit the form unless their age is between 18 and 30 years.

                                                                                                            • Report to know the history of certain Tickets on Desk

                                                                                                              Hi there guys, As the title implies we're wondering if there's any way to get some kind of Report that allows us to check the History of various Tickets at the same time since as of today if we want to know that we have to check them 1 by 1 which is not

                                                                                                            • Shared Mailboxes Disappeared

                                                                                                              Zoho Mail users in our company haven't been able to see their Shared Mailboxes for the past few hours. I've checked with App and Web Access, but they can't access them. When I send emails to their addresses, I get no error messages. They're still visible

                                                                                                            • IMAP Migration from Gmail

                                                                                                              I have been trying to import my email from a Gmail server and keep receiving the following error. I have reduced the security, activated imap and no improvement. The link to the Google support item has not helped. Unable to connect to your account. Please

                                                                                                            • Advanced Usage Billing: Prepaid with Drawdown

                                                                                                              Picture yourself at your favourite coffee shop, Bean & Brew. You come by every morning for your usual cappuccino, and occasionally you get an extra cold brew and a muffin or two in the afternoon. Interestingly, Bean & Brew has a new idea of offering a

                                                                                                            • Experience effortless record management in CRM For Everyone with the all-new Grid View!

                                                                                                              Hello Everyone, Hope you are well! As part of our ongoing series of feature announcements for Zoho CRM For Everyone, we’re excited to bring you another type of module view : Grid View. In addition to Kanban view, List view, Canvas view, Chart view and

                                                                                                            • Zoho CRM - Potentials Tab

                                                                                                              Hi! When I create a Deal (Potentials tab) the header looks like this: After a refresh on the page it looks like this: What should I do so that it is displayed like in the second pic without refresh? Also I have a user that as of recently, cannot see this

                                                                                                            • Next Page