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.
  

• For real-time visibility, use the cards element with the carousel type to display key logistic metrics such as shipment status, fleet utilization, delivery performance, etc.
  

• 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.

• Topic Participants

• Harsha SS

  

• 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

• In the Blue Print Transition requirement received it will show 8 check field in pop up if they any one of this field then only move to next stage Ist quote

  In the Blue Print Transition requirement received it will show 8 check field in pop up if they any one of this field then only move to next stage Ist quote Pls help how i fix this

• Linking Multi-UOM Barcodes to Products in Zoho Books

  Greetings, I'm using Zoho Books for retail shop and I'm running into a bit of a challenge with products that have multiple Units of Measurement (UOMs) and corresponding barcodes. For example, I sell cigarettes both as individual packets and in cartons

• Convert Item to composite item

  When using Zoho CRM integrated with Zoho Inventory/Books, the item creation process is a little messy. After a few years of trial and error, we have settled on creating items in CRM, which are sync'ed to Zoho Inventory using Zoho's own internal integration.

• Mapping “Account Name” from CRM to Campaigns

  I’m syncing our Contacts list to Campaigns and want to select “Account Name” as an available field. Account Name does not appear in the drop down menu for CRM field even though Account Name is a field in our standard layout. How can I make it availa

• Zoho Campaigns to Zoho Analytics Sync Fails – Field Mapping Shows But Not Applied

  I’m facing a persistent issue with the Zoho Campaigns integration to Zoho Analytics in my workspace. Here’s a detailed description of the problem: Under Edit Setup, I see a field mapping summary that shows: DataField Mapping: Most Recent Login However,

• Host in US Data Centre

  I humble apply to be registered on US Data centre

• Multiple images, one record

  I have a form that is used to capture the following info: -Facility Name -Origin -Shipment # -Picture of Damaged Pallet (Image field) I want to be able to capture multiple pictures without having to create a new record, as there might be multiple damaged pallets on the shipment. Obviously, one never knows how many damaged pallets might be on a shipment so I'd prefer not to create 20 image fields and have most of them unused.  I'd prefer that they have an option to add another image only if they need

• how to dynamically upload multiple images for single record?

  Is the use of dynamic multiple images in a single record supported? I've searched but have not found the answer. If it is supported, how is it done? I saw 1 suggestion to add a sub-form but that doesn't seem to be the answer. I don't want to add a set number of image fields. Each record would have a different number of images. I want the addition of images to be dynamic. thanks

• Multi-upload field

  Hi I need to include a file upload field that allows the user to select multiple files and upload all at once. I hope I can do this with HTML, I'm new to merging HTML and deluge... Can I trigger a hidden file upload window to appear On User Input of a field in an embedded form? Thanks! Levi

• is it possible to add multiple attachments to a record?

  Hello, I'm trying to add functionality so that a record can have several associated attachments. I obviously added a File Upload field to my form, but that appears to only allow one total. Is there a way around this? Thanks, - Kevin

• multiple upload files in zoho form

  Hi,  I need upload multiple files  in a single upload field thkns

• Keeping Track of Email Threads

  Hi, Z CRM is great for tracking all the activities one would want to track whilst qualifying leads, converting to customers, closing deals etc etc, however.... ....although I can use Z CRM to send an email to a lead/contact and have that recorded as an activity for other team members to see, there is no way of capturing an inbound email from that lead. Assume my lead replies to my email sent from ZCRM, in my case, the response arrives in my ZMail account. However I can't get it back into ZCRM to

• Zoho Creator invokeUrl to retreive PDF

  I'm trying to retreive a record PDF to send to Print Node. Tried with and without the zoho_creator_connection. pdf_content = invokeurl [ url :"https://creatorapp.zoho.com.au/<org_namespace>/<app_link_name>/record-pdf/<report_link_name>/" + input.ID type

• Bulk upload image option in Zoho Commerce

  I dont know if I am not looking into it properly but is there no option to bulk upload images along with the products? Like after you upload the products, I will have to upload images one by one again? Can someone help me out here? And what should I enter

• Zoho App Builder

  I’m looking for a Zoho Creator developer to build a simple app for tracking site expenses for a construction company. Key features: mobile form, dropdowns for projects and expense types, photo attachment for invoices, auto-calculated totals, and Excel

• Captcha can't be enabled conditionally

  Hi Problem: captcha on a form can't be enabled conditionally. Why is this a problem: Because I use the same form on our website (public) in the portal and mobile app. In the portal it works but in the mobile app it doesn't. So there should be a way to

• ACH Returns Don’t Trigger Dunning or Reverse Payment in Zoho Subscriptions

  Zoho Billing marked an ACH payment as successful and kept the subscription active — even though the payment was later returned by the bank (NSF). There was no update to the invoice or subscription status, and I had to manually clean it all up. For credit

• Zoho Sheet - Split cell diagonally fill half color

  is it possible to split a cell diagonally, fill different text in each half and ideally color them differently as well?

• Calling Token API in Postman returning "error: invalid_client"

  Hello, I've been working on setting up an API to get data from zoho crm into a third-party application. I'm currently testing the setup in Postman, but I'm getting an error from the API to retrieve the access token. It keeps returning "error: invalid_client".

• How to handle this process need using a Blueprint?

  See one minute screen recording: https://workdrive.zohoexternal.com/external/eb743d2f4cde414c715224fc557aaefeb84f12268f7f3859a7de821bcc4fbe15

• bulk scheduling youtube shorts and facebook reels

  how do i flag the video as facebook reel rather than normal video, it's vertical, 20 seconds, yet still being posted as video on facebook for youtube, it's being rejected out right both videos are to standard, can be posted normally with normal scheduler

• Invitation-Based User Access in Zoho Analytics

  Hello everyone, We’re rolling out an important update on how users are added to your Zoho Analytics Organization and Workspaces. Previously, when admins added users, they were automatically added to the organization. Moving forward, to improve security

• Filtert products by multi select custom field

  Hello, this is seems like a must addition, why it can not be done now?

• Multiple images

  Hi Is there a way to insert multiple images in one image record or any way that instead of one image, I could upload 5 to 10 images together. Looking forward for a solution. Regards

• Zoho Projects - Custom Objects

  Hello, is there the ability now, or in the near future, to add custom objects to Zoho Projects? The requirement here would be to have the ability to track change requests to a project's budget. The idea here is to have the ability to create a custom Object

• Access CRM Variables from Formula field

  Is it possible to use a CRM variable (defined in Developer Space -> CRM Variables) in a formula field for calculations ?

• Announcing Bigin India Meetups Across 8 Cities: July 29 - Aug 07

  Hello Biginners, We've got some exciting news to share! We're hosting our first round of Customer Meetups for 2025 in India, from 29th July - 9th August. Whether you're a Bigin newbie or a seasoned pro, this is your chance to meet customers from your

• Why isn't there an Expense description field / column?

  Hello! I'm new to Zoho Books and accounting. I'm surprised there isn't a proper expense description field (and column in the overview "all expenses" page)? I thought this was a given in accounting, as visualizing expenses facilitates tracking them down?

• New in Zoho PDF Editor: Watermarks, password protection, signature collection, and more.

  Hi Zoho Sign users! We are delighted to introduce the latest enhancements to Zoho PDF Editor, designed based on user feedback and feature requests. This update enables you to reorder, extract, and rotate PDF pages, add watermarks, and collect signatures.

• Cant't update custom field when custom field is external lookup in Zoho Books

  Hello I use that : po = zoho.books.updateRecord("purchaseorders",XXXX,purchaseorder_id,updateCustomFieldseMap,"el_books_connection"); c_f_Map2 = Map(); c_f_Map2.put("label","EL ORDER ID"); c_f_Map2.put("value",el_order_id); c_f_List.add(c_f_Map2); updateCustomFieldseMap

• Printed Reports, Increase Font SIZE

  I need to send some printed copies of financial reports to my attorney. The reports print out with microscopic fonts. How do I increase the font size so that a normal human can read the text? Every other accounting app can do this so I imagine I have

• Avoid email sending!

  Hello, Thanks you Zoho for the wonderful apps you provide. Question: Is there a way to disable sending emails when: - creating an estimate or billing. Thanks Tommy

• Need to show discount before total after subtotal

  Need to show discount before total after subtotal on my estimate template (see attachment)

• Email a "thank you" note for this payment is NOW checked by default

  Hello Team, Just noticed that Email a "thank you" note for this payment is now checked by default. I tried searching in Preferences and there is no way to turn this off. I do not want this to be the default. Is there a way to turn this off?

• End-to-end services hours

  We are trying to determine the best method of quoting service hours on quotes but only present the sum amount to a customer, without losing the tracking of quantity of hours for invoicing purposes. Does anyone have a good method they have determined?

• Specific Approval Question

  Hi everyone, Just a quick question here. I have located the "Approval Type" in the preferences, which is great, and I am sure we could make use of it. However, I am trying to understand how I can implement an approval "workflow". The business call it

• Zoho Books - Show Discount Totals When Greater Than Zero

  Hi Books Team, I understand that to show or hide discount amount on a Quote or Invoice, I need to use different templates. It would be a great quality of life improvement for users if we had an option to show or hide the discount amount at line item and

• Specifying a filename for Schedule Reports

  Is it possible to specify a filename to use with scheduled reports? For example: With a general ledger report, instead of general_ledger.pdf I would like to include the date the report was generated in the filename so it is called general_ledger_202

• Need to upsert "Created Time" field in Leads Module

  I am in the process of implementing Zoho CRM for my business. I need to modify the "Created By' field to reflect the actual date/time the lead was captured in my original Excel file. Otherwise, my conversion velocity data will always be inaccurate, which

• HTML for confirmation email

  Hi, After a prospect submitted the Zoho form, we want to send a confirmation mail. In this mail we want to add our email signature. However, while this is possible in Zoho CRM this doesn't seem to be an option in Zoho Forms. Also an html editor is not

• Next Page