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

    • Episode III : Powering Automation: Custom Functions in Action

      Hello Everyone, In our previous episodes, we explored custom functions and the Deluge programming language. If you’ve been wondering why the Episode series have been quiet, here’s the reveal! On our community, we've been showcasing custom functions integrated
    • Narrative 2 - Understanding Organizational Departments

      Behind the scenes of a successful ticketing system - BTS Series Narrative 2 - Understanding Organizational Departments A ticketing system's departments are essential because they provide an organized and practical framework for handling and addressing
    • Zoho Projects Plus for the healthcare industry

      The global healthcare industry is complex and diverse; from patient record maintenance, healthcare supply chain, to manufacturing complex medical equipment, the industry functions on many layers. Managing all these layers requires tested out techniques
    • Missing Outlook calendar option in Calendar

      Hi all I don't have an Outlook Calendar option in the Settings > Synchronise settings of Calendar. Any ideas why not?
    • Whats App Automation

      It would be nice to be able to send out an automated whats app message template on moving stages or creation of a ticket (same as you can do for automated emails). Currently only automated emails can be sent. Also, if whats app could be used more effectively
    • Zoho Projects Android app update: Enhanced Documents module within the projects.

      Hello everyone! In the latest Android version(v3.9.35) of the Zoho Projects app update, we have enhanced the documents module within the projects. Now, you can view all the attachments that you have added across the project in tasks, bugs, comments, etc,
    • Lead Source Disappears

      When adding a new lead and saving the page, the page refreshes itself and the lead source field becomes blank. We set the "Lead source" as a required field to see if it would help, but the problem persists and we always have to re-enter the lead sou
    • Inquiry Regarding Monitoring ZOHO CRM API Credit Usage

      Hello ZOHO Community, I hope this message finds you well. I have a question regarding monitoring the usage and remaining credits of the ZOHO CRM API. I recently discovered that within ZOHO CRM, by navigating to Settings ⇒ Developer Hub ⇒ APIs & SDKs,
    • Payment Gateways - A unified hub to manage all your payment integrations in Zoho Creator

      Hello everyone, We're thrilled to announce that we've completely reimagined the way payment gateways are handled in Creator. The result is a centralized Payment Gateways section that provides a clean, user-friendly interface to configure and manage all
    • Community Digest Julio 2025 - Todas las novedades en Español Zoho Community

      ¡Hola, Español Zoho Community! Ha pasado un tiempo desde el último Digest pero, ¡ya estamos de vuelta con las novedades más relevantes en las aplicaciones de Zoho y su universo! Si no te quieres perder ninguna de las novedades que vamos publicando, te
    • Tip #35- How to use Notifications in Zoho Assist to stay on top of session activities- 'Insider Insights'

      Hello Zoho Assist Community! This week, we’re exploring Zoho Assist’s built-in notification system for improved visibility and accountability. Keeping track of session activity is crucial, especially when you're managing multiple remote devices and technicians.
    • Assistance with Exporting Specific Data from Zoho CRM

      Hi, Could you please guide me on how to export specific information, such as the model number and serial number, from the Accounts module in Zoho CRM? Thank you in advance for your assistance.
    • Coming Soon in Zoho Invoice: Send Invoices Instantly via WhatsApp

      We're working on bringing a new level of convenience to your invoicing experience. Introducing a much-requested feature in Zoho Invoice: You can now share invoices directly to your customers via WhatsApp! With this new option, you can: Share invoices
    • field update from the value of another field

      Hello, I need to do a field update from the value of another field, but i don´t know how can i do it. In the mass update option it is not possible... I need to put the last name value form the leads module to other custom field that i have created. thanks for your help
    • What is a realistic turnaround time for account review for ZeptoMail?

      On signing up it said 2-3 business days. I am on business-day 6 and have had zero contact of any kind. No follow-up questions, no approval or decline. Attempts to "leave a message" or use the "Contact Us" form have just vanished without a trace. It still
    • Is there any way to prevent the row cloning feature(on edit page)

      My initial requirement is to prevent some users from adding new rows in the subform. For that, I have implemented the client script, and the script is working fine. But users are able to clone the row and make changes. For that, I was unable to find any
    • Using Another Field Value for Workflow Field Update

      I'm trying to setup a Workflow with a "Field Update" action on the Lead module, but I would like the new value to actually be taken from a DIFFERENT Field's on the Lead record (vs just defining some static value..) Is this possible? Could I simply use
    • How Do I Change Business Location

      Ive just shifted my business to a new country and would like to update my address and Business location in the "Organisation Profile" page but it is locked in the previous country. How do I unlock it / change it? Thanks
    • Verify details pop-up windows

      Hi, Is it possible to turn-off the anoying "Verify details" window that ask for closing date, "Reason for Lost" or other concepts. If I would like the user to enter such data, I will implement a rule .... How can I turn-off such pop-up? it's not necessary
    • Monthly overtime wrong after adding/changing attendance time for past month

      Hi there, as I understand it, the montly overtime overview under attendance is calculated at the end of each month. If someone was not able to enter his attendance in time but entered it in the new month, this time will not be considered in the overview.
    • As a security measure, you need to link your phone number with this account and verify it to proceed further.

      I want to disable this feature as my one staff travels with different phone numbers so it is hard to verify by phone. How do I do that?
    • Asset Tracking

      I am looking to create custom modules to track customer assets. We install serialized and non-serialized equipment into customers vehicles. So we will have vehicles belonging to the customer then equipment that will belong to a vehicle (if installed)
    • 【参加無料】8月8日(金) 福岡 ユーザ交流会 参加登録 受付開始!

      ユーザーの皆さま、こんにちは。コミュニティチームの藤澤です。 8月8日(金)に1年ぶりに、福岡でZoho ユーザー交流会を開催します! ユーザー事例セッションでは、CreativeStudio樂合同会社の前田 美知太郎さまが、労働時間を削減したZoho活用のリアルな工夫を語ります。 Zoho社員セッションでは、データ収集から自動処理まで一気に効率化できるZoho Formsの最新活用アイディアをお届けします。 ▷▷詳細はこちら:https://www.zohomeetups.com/Fukuoka2025#/?affl=fuk2508forumpost
    • Unusable due to "server" issues but there's nothing on Zoho or Down Detector saying there's an outage

      I just started the Zoho trial and I cannot do anything because no apps or even the "contact support" will actually load. I tried to create a project but it keeps giving me the error "server is unable to process your request at this time". I tried to load
    • Issue After Updating to Zoho Desk Android SDK v4.5.0 – Authentication Fails (Status Code 204)

      Hi Zoho Support Team, I was previously using the Zoho Desk Android SDK with the following dependency: implementation 'com.zoho.desk:asapsdk:3.0_BETA_17' Everything was working as expected — including user authentication, the tickets section, and the
    • add another department to helpcenter

      After activating multi-brand, how to add another department to help center? For example department A has associated with help center 1. We have another department B and would like user to be able to submit ticket to department B via help center 1, how
    • Task and Milestones - Dependency feature needed

      I'm sure we're not the first to bring this up. We've been using zoho project for a while. Every project manager knows that to manage a successful project you need option to stack tasks and milestones and be able to create dependencies between tasks and milestones. I think you get the idea... Can you let us know if this feature is in the making or not? any chance we'll see this in future releases? If you need customer feedback about this feature or other enhancements, we'll be happy to test new products
    • How to update task start date when project start date changes?

      Hi there, When the start date of a project changes, it's important to update the start dates of the tasks associated with that project to reflect the new timeline. Is there a way to shift the start date of all project tasks when the start date of a project
    • ZOHO DESK | SET PERMISSION NOT TO ALLOW SPECIFIC AGENTS TO CREATE TICKET

      Hi Zoho Team, I have a question regarding this: "Team Desk are the ones to have the permission to create a ticket, Team OPS resolvers must not create a ticket." - How to set permission to Team OPS resolvers for not creating a ticket? Only Team Desk should
    • On success Workflow not triggering from external Zoho Form submission

      Hello everyone, I'd really appreciate your help. I'm building a system, where I'm using Zoho Creator as a crm/spreadsheet to manage movements of inventory. I have 3 "forms" or tables, where one is a main table for obersving status on all inventory, another
    • Tax is missing in expense unable to submit report

      Im getting the above error when submitting a report with an expense. Its complaining about the Tax is missing but there is no Tax area just "Amount". And if I try to Itemize the amount to break out the tax portions with the initial product portion it
    • Time-based Automations updates does not trigger Webhook

      Hi, When a ticket is updated by Time-based automation, it doesn't seem to trigger the webhook event. I looked at the ticket history for the problematic tickets, they were all changes made by action with this label: `Ticket was updated through a Time-based
    • Can't find parent child ticketing

      Hi I can't find parent child ticketing under tickets in this new organization... I have in the past on other organizations
    • Filtering Parent and Child Tickets in Analytics

      Hello Zoho Support Team, We’ve noticed that when checking our ticket analytics in Zoho Desk, the data merges both parent and child tickets for key metrics like the number of new tickets, closed tickets, and first response time. This results in inaccurate
    • Link Zoho Inventory Sales Order with Zoho Desk Ticket

      I'd like to, in a Zoho Inventory Sales Order, see linked/related Zoho Desk tickets. When I'm in Zoho Desk, I can look up related tickets to the sales order, but I can't seem to do it in the reverse manner (where when I'm in a Zoho Inventroy Sales Order,
    • Shopify integration

      I need to integrate Shopify with Zoho Books
    • Can't type latin characters Mac x Windows

      I access a Win XP machine using Chrome on Mac OS X High Sierra and I can't get special characters like á é ó â ê ô ã õ à í ú to work. I tried a few different keyboard layout setups, but nothing worked. I end up having to type a lot of stuff in a local notepad for further copy and paste, which is not convenient at all. Am I missing anything? How can I make this work? Thanks.
    • Zoho People & Zoho CRM Calendar

      Hi, Does anyone know if it is possible to link Zoho People and the calendar in CRM? I would like when holidays are approved they automatically appear in the calendar on CRM. Thanks 
    • How to add Leave Type Permission Start Time

      Hi, I have a requirement to add Leave Type : Permission Start Time on the email template to which is end to the reporting manager. But I am unable to find the field in the list of fields. How to achieve this?
    • How to get batch number of item by api?

      Hi there, Is there any way to get batch number of item by api? Batch number is the batch reference number in https://www.zoho.com/inventory/help/advanced-inventory-tracking/batch-tracking.html . When I call the https://www.zoho.com/books/api/v3/#Items_Get_an_item
    • Next Page