Let's build a dashboard with Cliq Widgets!

Let's build a dashboard with Cliq Widgets!


While juggling multiple tasks and tracking real-time data, you face a strict deadline for delivering a quarterly analysis report on a blank canvas while switching between different apps. Sounds exhausting, right? What if you could streamline everything into one interactive space?

With its vibrant tile-based design and internal components like widgets packed with elements like charts, graphs, tables, and custom fields, Cliq can transform your static data into visual dashboards that deliver business value.

Business benefits  
  • Rapid decision-making: Visual data representation ( with charts and graphs ) makes it easier to spot trends instantly, track KPIs, and identify areas that require immediate action. With clear insights, decision-makers can respond proactively.
  • Enhanced collaboration: Interactive widget elements, such as tables, fields, and charts, allow teams to view, update, and share critical information without communication gaps. This ensures data consistency and fosters a more connected and agile workflow, minimizing the need to leave the chat interface. 
  • Improved efficiency: Constantly switching between apps to gather insights slows productivity. By consolidating key metrics in a centralized location, teams can reduce context-switching and make well-informed decisions faster. 
  • Proactive problem solving: Addressing potential issues before they escalate is crucial for maintaining business continuity. Automated alerts and notifications triggered via bots and schedulers in Cliq allow teams to respond quickly to emerging concerns.
Let's design a Logistics Dashboard tailored for a Fleet Manager overseeing multiple deliveries. This dashboard will provide real-time insights into fleet performance, delivery status, and potential delays, ensuring smooth logistics operations.


                                                                               

  • Utilize the image element to enhance your business brand, strengthen your identity and recognition, and create a professional dashboard that stands out.
  • Incorporate vertical bar graphs to analyze operational costs, differentiating between storage, transportation and packaging expenses.
    • These graphs support legend-based filtering. Click on a category in the legend to remove it and focus on specific cost metrics.
    • Use the navigator to zoom in or expand the X-axis, allowing for precise monitoring within a specific range.
  • Monitor speed, load, and efficiency trends over time using graphs to identify performance patterns and operational bottlenecks. Hover over data points to see tooltips displaying exact values for each category, providing quick insights.
  • Use the table element to showcase supplier statistics and a doughnut chart to illustrate orders by delivery status. Add widget buttons to the header for tasks such as filtering dashboards by date range and requesting stocks via Cliq forms.
  • Use the catalogue form input to present detailed product information and images for a rich and intuitive experience in stock requests.
Sample code :
  1. tabsList = {{"label":"Inventory Trends","id":"reports"}};
  2. if(target.containsKey("id"))
  3. {
  4. id = target.get("id");
  5. }
  6. else
  7. {
  8. id = "reports";
  9. }
  10. sections = List();
  11. if(id == "reports")
  12. {
  13. elements = list();
  14. // Cover Image for the Widget
  15. data = list();
  16. imgMap = Map();
  17. imgMap.put("url","https://www.zoho.com/sites/zweb/images/cliq/dev-helpdoc/image_31_1.jpg");
  18. data.add(imgMap);
  19. elements.add({"type":"images","data":data,"style":{"view":"carousel","size":"large"}});
  20. elements.add({"type":"text","text":"\n\n"});
  21. sections.add({"id":"coverImage","elements":elements});
  22. elements = list();
  23. elements.add({"type":"title","text":"Logistics Dashboard"});
  24. sections.add({"id":"tagline","elements":elements});
  25. dataList = list();
  26. eachData = Map();
  27. eachData.put("title","💰 733,284");
  28. eachData.put("description","Sales");
  29. dataList.add(eachData);
  30. eachData = Map();
  31. eachData.put("title","📥  6,000");
  32. eachData.put("description","Restocking Frequency | Bi-weekly");
  33. dataList.add(eachData);
  34. eachData = Map();
  35. eachData.put("title","⌛ 4.2");
  36. eachData.put("description","Average Processing Time (hrs)");
  37. dataList.add(eachData);
  38. eachData = Map();
  39. eachData.put("title","🚚 12,294");
  40. eachData.put("description","Shipment (in tons)");
  41. dataList.add(eachData);
  42. eachData = Map();
  43. eachData.put("title","📈⚙️ 83%");
  44. eachData.put("description","Utilization %");
  45. dataList.add(eachData);
  46. eachData = Map();
  47. eachData.put("title","⚠️📦 5%");
  48. eachData.put("description","Stockout Risk");
  49. dataList.add(eachData);
  50. elements = list();
  51. elements.add({"type":"cards","data":dataList,"style":{"view":"carousel","size":"small"}});
  52. elements.add({"type":"text","text":"\n\n"});
  53. sections.add({"id":"cardstats","elements":elements});
  54. // Add buttons based on your preferred usecase
  55. button1 = {"label":"Filter","type":"invoke.function","name":"LPWidgetbuttons","emotion":"positive","id":"filter"};
  56. button2 = {"label":"Stock Request","type":"invoke.function","name":"LPWidgetbuttons","emotion":"positive","id":"stockRequest"};
  57. elements2 = list();
  58. elements2.add({"type":"title","text":"Logistics & Operational Cost Analysis"});
  59. operationalCostData = {{"category":"Transportation","values":{{"label":"Jan 20","value":9},{"label":"Feb 20","value":8},{"label":"Mar 20","value":5},{"label":"Apr 20","value":2},{"label":"May 20","value":2},{"label":"Jun 20","value":2},{"label":"Jul 20","value":2},{"label":"Aug 20","value":2},{"label":"Sep 20","value":9},{"label":"Oct 20","value":8},{"label":"Nov 20","value":5},{"label":"Dec 20","value":2},{"label":"Jan 21","value":2},{"label":"Feb 21","value":2},{"label":"Mar 21","value":2},{"label":"Apr 21","value":2},{"label":"May 21","value":9},{"label":"Jun 21","value":8},{"label":"Jul 21","value":5},{"label":"Aug 21","value":2},{"label":"Sep 21","value":2},{"label":"Oct 21","value":2},{"label":"Nov 21","value":2},{"label":"Dec 21","value":2}}},{"category":"Storage","values":{{"label":"Jan 20","value":6},{"label":"Feb 20","value":12},{"label":"Mar 20","value":3},{"label":"Apr 20","value":7},{"label":"May 20","value":3},{"label":"Jun 20","value":13},{"label":"Jul 20","value":5},{"label":"Aug 20","value":8},{"label":"Sep 20","value":9},{"label":"Oct 20","value":8},{"label":"Nov 20","value":5},{"label":"Dec 20","value":2},{"label":"Jan 21","value":2},{"label":"Feb 21","value":2},{"label":"Mar 21","value":2},{"label":"Apr 21","value":12},{"label":"May 21","value":3},{"label":"Jun 21","value":8},{"label":"Jul 21","value":5},{"label":"Aug 21","value":2},{"label":"Sep 21","value":8},{"label":"Oct 21","value":2},{"label":"Nov 21","value":2},{"label":"Dec 21","value":2}}},{"category":"Packaging","values":{{"label":"Jan 20","value":6},{"label":"Feb 20","value":11},{"label":"Mar 20","value":2},{"label":"Apr 20","value":5},{"label":"May 20","value":2},{"label":"Jun 20","value":6},{"label":"Jul 20","value":3},{"label":"Aug 20","value":5},{"label":"Sep 20","value":6},{"label":"Oct 20","value":11},{"label":"Nov 20","value":5},{"label":"Dec 20","value":3},{"label":"Jan 21","value":5},{"label":"Feb 21","value":7},{"label":"Mar 21","value":4},{"label":"Apr 21","value":6},{"label":"May 21","value":9},{"label":"Jun 21","value":8},{"label":"Jul 21","value":5},{"label":"Aug 21","value":2},{"label":"Sep 21","value":4},{"label":"Oct 21","value":6},{"label":"Nov 21","value":2},{"label":"Dec 21","value":3}}}};
  60. elements2.add({"type":"graph","styles":{"preview":"vertical_bar"},"data":operationalCostData});
  61. elements2.add({"type":"divider"});
  62. sections.add({"id":2,"elements":elements2});
  63. trendGraphData = {{"category":"Loading Time ⏳","values":{{"label":"Jan","value":9},{"label":"Feb","value":6},{"label":"Mar","value":3},{"label":"Apr","value":12},{"label":"May","value":15},{"label":"Jun","value":18},{"label":"Jul","value":24},{"label":"Aug","value":27}}},{"category":"Weight ⚖️","values":{{"label":"Jan","value":12},{"label":"Feb","value":18},{"label":"Mar","value":14},{"label":"Apr","value":6},{"label":"May","value":8},{"label":"Jun","value":4},{"label":"Jul","value":2},{"label":"Aug","value":10}}},{"category":"Processing Time ⏲️","values":{{"label":"Jan","value":4},{"label":"Feb","value":3},{"label":"Mar","value":7},{"label":"Apr","value":3},{"label":"May","value":4},{"label":"Jun","value":2},{"label":"Jul","value":6},{"label":"Aug","value":5}}}};
  64. elements3 = list();
  65. elements3.add({"type":"title","text":"Performance Trends: Speed, Load & Efficiency"});
  66. elements3.add({"type":"graph","styles":{"preview":"trend"},"data":trendGraphData});
  67. sections.add({"id":3,"elements":elements3});
  68. elements4 = list();
  69. elements4.add({"type":"table","headers":{"Supplier Name","Product Category","Avg. Delivery Time (Days)","Fulfillment Rate (%)","Contract Expiry Date","Price Variability (%)"},"rows":{{"Supplier Name":"GlobalTech","Product Category":"Laptops","Avg. Delivery Time (Days)":"6.5","Fulfillment Rate (%)":"92 %","Contract Expiry Date":"2025-12-31","Price Variability (%)":"1.5 %"},{"Supplier Name":"MedSupply","Product Category":"Medical Devices","Avg. Delivery Time (Days)":"4.2","Fulfillment Rate (%)":"96 %","Contract Expiry Date":"2026-06-30","Price Variability (%)":"2.8 %"},{"Supplier Name":"FreshAgri","Product Category":"Perishables","Avg. Delivery Time (Days)":"5","Fulfillment Rate (%)":"93 %","Contract Expiry Date":"2025-09-15","Price Variability (%)":"5.4 %"},{"Supplier Name":"AutoPartsCo","Product Category":"Auto Components","Avg. Delivery Time (Days)":"3","Fulfillment Rate (%)":"95 %","Contract Expiry Date":"2025-11-20","Price Variability (%)":"3.2 %"}},"style":{"text_align":{"center","center","center","center","center","center"}}});
  70. sections.add({"id":4,"elements":elements4});
  71. deliveryInfo = {{"label":"Delivered","value":1050},{"label":"In Progress","value":493},{"label":"Not Delivered","value":440}};
  72. elements5 = list();
  73. elements5.add({"type":"title","text":"Orders by Delivery Status"});
  74. elements5.add({"type":"percentage_chart","styles":{"preview":"doughnut"},"data":deliveryInfo});
  75. sections.add({"id":5,"elements":elements5});
  76. header = {"title":"","navigation":"new","buttons":{button1,button2}};
  77. }
  78. return {"type":"applet","tabs":tabsList,"active_tab":id,"sections":sections,"header":header};


Time to build your own dashboard!  

Cliq Widgets is not just for logistics. Do you want to track sales performance, monitor system health, or analyze customer support tickets? You can craft a dashboard that drives your unique business needs, turning static data into an interactive and actionable experience.

We're here to help, so don't hesitate to reach out to support@zohocliq.com with any questions or if you need assistance in crafting even more tailored workflows.

    • Sticky Posts

    • Customer payment alerts in Zoho Cliq

      For businesses that depend on cash flow, payment updates are essential for operational decision-making and go beyond simple accounting entries. The sales team needs to be notified when invoices are cleared so that upcoming orders can be released. In contrast,

    • Automating Employee Birthday Notifications in Zoho Cliq

      Have you ever missed a birthday and felt like the office Grinch? Fear not, the Cliq Developer Platform has got your back! With Zoho Cliq's Schedulers, you can be the office party-cipant who never forgets a single cake, balloon, or awkward rendition of

    • Accelerate Github code reviews with Zoho Cliq Platform's link handlers

      Code reviews are critical, and they can get buried in conversations or lost when using multiple tools. With the Cliq Platform's link handlers, let's transform shared Github pull request links into interactive, real-time code reviews on channels. Share

    • App Spotlight : PagerDuty for Zoho Cliq

      App Spotlight brings you hand-picked apps to enhance the power of your Zoho apps and tools. Visit the Zoho Marketplace to explore all of our apps, integrations, and extensions. In today's fast-paced world, seizing every moment is essential for operational

    • Automate your status with Cliq Schedulers

      Imagine enjoying your favorite homemade meal during a peaceful lunch break, when suddenly there's a PING! A notification pops up and ruins your moment of zen. Even worse, you might be in a vital product development sprint, only to be derailed by a "quick

    • Recent Topics

    • Add a Way to Duplicate Cards in the Same Canvas (Retain All Settings)

      Dear Zoho SalesIQ Team, We would like to request a new feature in Zoho SalesIQ: the ability to duplicate an existing card within the same canvas while retaining all of its information and settings, including conditions, configurations, and display preferences.

    • Zoho Mail CC and BCC not working

      Zoho Mail CC and BCC not working. I have tried multiple combinations amongst my domain aliases but emails sent as CC or BCC never arrive, not even to Spam. I have checked that the DNS is set up correctly in Cloudflare and have even received a DMARC report

    • Zoho Autoplay Issue

      Currently, we run our graphics on a playlist with youtube videos interspersed in our office -- however, when we go to update the playlist (since last Thursday at around 8-9am EST) it no longer saves the autoplay function.  We have tried making a new account, manually saving with cntrl+s, making a new show, etc but nothing seems to work.  Even with our old program, we can't change it off of autoplay for ones that were created in the past. Another issue is that if we change a slide transition to anything

    • Critical Issue: Tickets Opened for Zoho Support via the Zoho Help Portal Were Not Processed

      Hi everyone, We want to bring to your attention a serious issue we’ve experienced with the Zoho support Help Portal. For more than a week, tickets submitted directly via the Help Portal were not being handled at all. At the same time no alert was posted

    • Adding hyperlinks in CRM emails time automatically

      It may just be me, but when I am writing an email to a lead, I find inserting a hyperlink very time consuming. Granted, I can use templates but there are a ton of scenarios where I might want to put a link in to an website that wouldnt require me to go though the effort of creating a template.  Ideally, the crm would identify that I that a string of text is a URL and insert the hyperlink automatically, just like microsoft outlook or gmail. Has anyone else had this same experience and found a way

    • Enhance "Applications Usage" with Date Filters, Historical Analytics & App-Level Breakdown

      Hello Zoho Creator Team, We are writing to request a critical enhancement to the Applications Usage section to improve our ability to monitor, analyze, and manage our platform consumption over time. While the current view of today’s usage is helpful for

    • External File Share - Allow delete

      Hi Team, when I share an external link and give it edit rights the external user can add but not delete files and folders. what am i doing wrong?

    • Where is the Global Search field?

      I am looking for an alternative to SF.com. Zoho CRM seems to be work fine, and be customizable in terms of the fields and reports. But there's one big thing missing and it's going to prevent us from using it: there's no global search box at the top of

    • How to notify all members on any updates to zoho crm?

      Hi, I am using the free version of zoho CRM and currently seeing this will work for our company. We are a small company and wanted to be more informed about all the changes in zoho. 1. How do I s et notifications that go to the team for any and all changes

    • How to change the format for phone numbers?

      Mobile phone numbers are currently formatted (###) ###-####.  How can I change this to a more appropriate forms for Australia being either #### ### ### or (#)### ### ###?

    • Unattended Access on Android without Play Store

      I'm testing Zoho Assist for remote config and maintenance of our IoT devices. The devices are running Android 8.1 and do NOT have Google Play Store installed, nor can it be installed. I've been able to install Zoho Assist on the devices and load the enrollment

    • Open Sans Font in Zoho Books is not Open Sans.

      Font choice in customising PDF Templates is very limited, we cannot upload custom fonts, and to make things worse, the font names are not accurate. I selected Open Sans, and thought the system was bugging, but no, Open Sans is not Open Sans. The real

    • Is it possible to embed Zoho Bookmarks in the Cliq sidebar?

      Is there any way that each Zoho user can access their bookmarks (that live in https://bookmarks.zoho.eu/ which is technically a part of Zoho Mail) directly within Cliq? As a widget, or an item in the sidebar? My team does not use Mail, it uses Cliq all

    • Show Attachments in the customer portal

      Hi, is it possible to show the Attachments list in the portal for the particular module? Bests.

    • Kaizen #142: How to Navigate to Another Page in Zoho CRM using Client Script

      Hello everyone! Welcome back to another exciting Kaizen post. In this post, let us see how you can you navigate to different Pages using Client Script. In this Kaizen post, Need to Navigate to different Pages Client Script ZDKs related to navigation A.

    • Navigate with Ease: Announcing Improvements to Your Zoho CRM for Everyone's Setup Experience

      Hello Everyone, We’re thrilled to announce new enhancements to the Setup Menu in our Zoho CRM for Everyone system, designed to simplify your workday and streamline your overall experience. What's New? Addition of a Setup Homepage Faster Search in Setup

    • Zoho Projects Webhook fails with HTTP Error 0

      Hello Zoho Community, I am pulling my hair out over this one. I have setup a very basic http(s) server that always responds "ok" and code 200 to incoming GET requests. It will accept any parameters, and any path. Really, all it does is say "ok," and log

    • API 500 Error

      Hello amazing ZOHO Projects Community, I get this message. How can we solve this? { "error": { "status_code": "500", "method": "GET", "instance": "/api/v3/portal/2010147XXXX/projects/2679160000003XXXX/timesheet", "title": "INTERNAL_SERVER_ERROR", "error_type":

    • ZOHO Campaignで表のカラムの幅を調整したい。

      表を作成した際、個々のカラムの幅を調整したいのですが、方法が分かりません。 どなたかご存じの方ご教示ください。

    • Auto-upload Creator Files to WorkDrive

      Hi everyone, I’m working on a workflow that uploads files from Zoho Creator to specific subfolders in Zoho WorkDrive, as illustrated in the attached diagram. My Creator application form has two multi-file upload fields, and I want—on successful form submission—to

    • Exciting Updates to the Kiosk Studio Feature in Zoho CRM!

      Hello Everyone, We are here again with a series of new enhancements to Kiosk Studio, designed to elevate your experience and bring even greater efficiency to your business processes. These updates build upon our ongoing commitment to making Kiosk a powerful

    • Kaizen #129 : Client Script Support for Blueprints

      Hello everyone! Welcome to another week of Kaizen. Today, let us discuss about how you can use Client Script during a Blueprint transtion to meet your requirements. This Kaizen post will provide solution for the post - Need non-mandatory fields in blueprint

    • Search Bar Improvement for Zoho Commerce

      Hey everyone, I've been using Zoho Commerce for a bit now, and I think the search bar could really use an upgrade. Right now, it doesn't show products in a dropdown as you type, which would make finding items a lot faster. On Shopify, for example, you

    • Making digital signatures accessible to all: Introducing accessibility controls in Zoho Sign

      Hi there! At Zoho Sign, we are committed to building an inclusive digital experience for all our users. As part of our ongoing efforts to align with Web Content Accessibility Guidelines (WCAG), we’re updating the application with support that will go

    • Account Owner Field From Accounts Module to be Displayed in Contacts module

      I have a field in the Accounts Module in the CRM called "Account Owner" i want that field to be also mapped into the Contacts Module custom single line field called "Account Manager".

    • Update a field in the ZOHO Form, basis numeric value in another field in the same form

      I am trying to create a questionnaire in ZOHO, where clients need to answer 10 questions, and basis response, values are assigned. I have created a total score field where the sum of the values is stored. But i am unable to create a rule whereby another

    • 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

    • Meet up de Zoho en Bilbao

      Buenos días comunidad! Estamos estudiando hacer un Meet up en Bilbao desde zoho y varios Partners. Para que la experiencia sea excelente, queremos saber cuantas pesonas se vendrían a Bilbao al evento. Y para que sea lo mas útil posible, que temas dentro

    • Picklist reference value in REST

      picklist options can be configured to have a different reference value than the displayed one, should be helpful in things like multilanguage: https://help.zoho.com/portal/en/kb/crm/customize-crm-account/translations/articles/translations is there a way

    • In Zoho inventory Converting sales return to cerdit note from using Api from Creator Error details: {"code":-1,"message":"Invalid Sales Return ID."}

      In Zoho inventory Converting sales return to cerdit note from using Api from Creator Error details: {"code":-1,"message":"Invalid Sales Return ID."} this is button Function used in the Creator map Inventory.Create_Credit_note(int CRE_ID) { return_value

    • Marketing Tip #2: Recover lost sales with abandoned cart emails

      Did you know most online shoppers don’t complete checkout? Automated cart recovery emails are an easy way to bring them back. A simple reminder can recover sales you’d otherwise lose. Try this today: Enable abandoned cart emails in Zoho Commerce and set

    • Billing Management: #9 Usage Billing in IoTs

      We live in a world where connectivity has become a lifestyle rather than a luxury. From smart thermostats that adjust your home's temperature to GPS trackers monitoring end-to-end fleets and sensors that optimize energy grids, the Internet of Things has

    • {"code":1038,"message":"JSON is not well formed"}

      Today this began failing: sales_order_data = zoho.books.createRecord("salesorders",books_organization_ID,order_data); with this error message. {"code":1038,"message":"JSON is not well formed"} This code has been running for two years. Here is the input

    • How can I migrate Shared Mailbox from Zoho Mail to Team Inbox?

      I am unable to migrate mails from my shared mailbox in Zoho Mail to Team Inbox. I am the super admin of my Zoho One plan and yet I am getting an error saying only admins can do this? I don't understand the issue.

    • Remember all the ways we've posted?

      The world celebrates World Postal Day in 2025 with the theme “#PostForPeople: Local Service. Global Reach". The story of the “post” is a story of human connection itself, evolving from simple handwritten notes carried over long distances to instant digital

    • Add Support for Authenticator App MFA in Zoho Desk Help Center

      Hello Zoho Desk Team, We hope you are doing well. We would like to request an enhancement related to security for the Zoho Desk Help Center (customer portal). Currently, the Help Center supports MFA for portal users via SAML, JWT, SMS authentication,

    • Can no longer upload my own Notebook cover

      I've had Notebook for over a year and have been able to create my own notebook covers, but when I tried to upload my own cover for a new notebook today, the upload feature has suddenly been starred, requiring me to upgrade my account. When did this

    • Zoho Desk - Cannot Invite or Register New User

      Hi who may concern, we encountered a problem that we cannot invite user or the visitor cannot register for a user at all through our help center portal, with the snapshot shown as below and the attachement. It always pops up that "Sorry, Unable to process

    • Custom domain issue

      I recently changed records for my support area custom domain for a few months, I then wanted to come back to Zoho, but now I can't connect it and I can't login as it's having an SSL issue. I cannot get a good response from support, as I've been notified

    • How do you generate personalized certificates and save them in dynamic folders using Writer's mail merge?

      Zoho Writer's mail merge feature can help you enhance the certificate management process. It's a great way to save time and effort! Merge certificates and maintain a well-organised repository with personalised certificates stored in separate folders for

    • Next Page