# Order Analytics

The **Order Analytics** feature in Cost Calculator Builder gives you a clear picture of how your calculators perform and how users interact with them. With this tool, you can track key metrics like revenue, total orders, views, and interactions, along with daily activity trends — all from a clean, visual dashboard.

{% hint style="success" %}

#### The Order Analytics tool enables you to:

* See which calculators perform best
* Find and fix unused fields or options
* Improve calculator layout and flow
* Spot trends in quantities and selections
* Track changes over custom date ranges
* Make data-driven product decisions
* Boost conversions with better insights
  {% endhint %}

This data helps you improve calculator UX, remove unused options, optimize pricing strategies, and boost conversion rates, all based on real user behavior.

## Overview

You can access the feature by following **WP Dashboard > Cost Calculator > Order Analytics:**

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2Fag5iC8PvDB8V1Unqhw2M%2Fimage.png?alt=media&#x26;token=bc99691c-c4c0-44b8-99a4-c42190b129af" alt=""><figcaption></figcaption></figure>

The main interface of the **Order Analytics** can be divided into three parts:

* **Left Sidebar** - contains the General Analytics Dashboard and a list of all calculators. You can select any calculator to view its individual reports and performance data.
* **Filters bar** - includes filters for date range and order status. These allow you to generate reports based on a specific time period and selected order status.
* **Detailed Analytics** - this is the main area displaying all analytics, including line charts, pie charts, bar graphs, and other visual reports.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FHXsML3Dlnf6T3XyqYlwj%2Fimage.png?alt=media&#x26;token=dd317445-1d46-413d-846a-948b99ac19d1" alt=""><figcaption></figcaption></figure>

## General Analytics

Under the General Analytics Dashboard, the overall performance of orders across all your calculators will be displayed. You can access it by following the <i class="fa-calculator">:calculator:</i> **Dashboard** tab in Order Analytics:

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FqlYREqiz4WvdDBosLWTg%2Fimage.png?alt=media&#x26;token=4cff3f53-e3b9-416c-bbc8-3d07d73dba35" alt=""><figcaption></figcaption></figure>

Let's see each of the metrics inside it.

### **Key Performance Metrics**

At the top of the Order Analytics dashboard, you’ll find a quick overview of your most important business indicators. These metrics help you instantly understand how your calculators are performing overall.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FZbuAY0n2BScChDO4OSVf%2Fimage.png?alt=media&#x26;token=a51ec58f-f280-4341-971e-0ac4345a3971" alt=""><figcaption></figcaption></figure>

* **Revenue -** shows the total income generated from all calculator orders in the selected period.
* **Orders -** displays the number of completed orders submitted through your calculators.
* **Views -** represents how many times users have opened any of your calculators, regardless of interaction.
* **Interactions -** tracks how many users actively interacted with at least one field in a calculator, even if they didn’t place an order.

Each metric includes a line graph and daily average, making it easy to track changes over time and spot activity patterns at a glance.

### Orders vs Interactions

This line graph compares the total number of **orders** and **user interactions** over time (hourly, weekly, monthly, yearly). You can set the period in the top right corner of the graph.&#x20;

* **Orders -** how many completed submissions were made.
* **Interactions -** how often users interacted with the calculator, even without completing it.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FoxVPZBERlBHUAs9zo3uu%2Fimage.png?alt=media&#x26;token=5036cff0-ff04-4423-bf51-167fb8ef7780" alt=""><figcaption></figcaption></figure>

* **Horizontal Axis (X)** – shows the timeline (days, weeks, or months depending on the selected range)
* **Vertical Axis (Y)** – shows the number of interactions and orders

{% hint style="success" %}
You can zoom in on any graph by scrolling your mouse while hovering over it. For detailed statistics at a specific point, simply move your cursor over the graph to reveal exact values.
{% endhint %}

This graph helps measure engagement versus actual conversions.

### **Revenue by Calculator**

This chart highlights which calculators are bringing in the most income. It’s useful for identifying your top performers and deciding where to focus your optimization efforts.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FImJ0OcpfoH2Wu7uOWfv0%2Fimage.png?alt=media&#x26;token=f3778e4f-9a17-4131-9850-ec2028c4112d" alt=""><figcaption></figcaption></figure>

* **Vertical Axis (Y)** - represents the calculators
* **Horizontal Axis (X)** - represents the amount of revenue.&#x20;

{% hint style="success" %}
You can hover over the bars to reveal their exact values.
{% endhint %}

### **Best Order Days**

This graph shows which days of the week generate the most orders. It helps you identify peak activity periods, so you can better time your campaigns or offers.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FHndwMxkhoAWKWrwHSlC6%2Fimage.png?alt=media&#x26;token=587df4da-8fba-4a56-81b0-c7d237bf339f" alt=""><figcaption></figcaption></figure>

* **Horizontal Axis (X)** – shows days of the week (Monday to Sunday)
* **Vertical Axis (Y)** – shows the number of orders placed on each day

Taller bars mean more orders on that specific day.

### **Revenue Over Time**

This graph displays how your total revenue changes throughout the selected period. It helps you monitor business performance, track growth, and catch unusual spikes or drops.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2F9IcJnVV38C8nuO2mTqvz%2Fimage.png?alt=media&#x26;token=db504a79-4aa1-4b9c-b79b-3ebb61395905" alt=""><figcaption></figcaption></figure>

* **Horizontal Axis (X)** – shows the timeline (by day, week, or month)
* **Vertical Axis (Y)** – shows the revenue amount

{% hint style="success" %}
You can zoom in on any graph by scrolling your mouse while hovering over it. For detailed statistics at a specific point, simply move your cursor over the graph to reveal exact values.
{% endhint %}

## Individual Calculator Order Analytics

Along with the General Analytics, you can get a brief overview of the orders of the specific calculators performance. To access the feature, just select the needed calculator from the list on the left sidebar:

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FjtaXrDcrn2BzJGVptqMn%2Fimage.png?alt=media&#x26;token=4aada9b4-4836-4619-8fb9-664cbf4661d8" alt=""><figcaption></figcaption></figure>

The interface of the **Individual Calculator Order Analytics** is similar to the [**General Analytics**](#general-analytics) dashboard. However, instead of overall site-wide data, each calculator displays its own unique analytics based on the specific fields it contains.

The analytics section begins with the [**Orders vs Interactions**](#orders-vs-interactions) graph. All other graphs and charts are generated automatically based on the specific fields used in the selected calculator.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2Ffzu87vQqW4l9wxUsa26E%2Fimage.png?alt=media&#x26;token=af502cde-4bca-4c3b-8854-fb3326953ed0" alt=""><figcaption></figcaption></figure>

This table shows which types of calculator fields generate specific graphs in the analytics dashboard:

| Calculator Element                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     | Graph Type in Order Analytics       |
| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------- |
| [Quantity](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/quantity), [Basic Slider](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/range-button), [Multirange](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/multi-range)                                                                                                                                                                                                                      | [**Column Chart**](#column-chart)   |
| [Dropdown](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/drop-down), [Image Dropdown](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/drop-down-with-image), [Switch](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/toggle-button), [Checkbox](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/checkbox), [Image Checkbox](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/checkbox-1) | [**Bar Chart**](#bar-chart)         |
| [Radio](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/radio-button), [Image Radio](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/radio-button-1)                                                                                                                                                                                                                                                                                                                           | [**Pie Chart**](#pie-chart)         |
| Other Fields                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           | *can not be displayed in analytics* |

Here are the sample chart types:

{% tabs %}
{% tab title="Column Chart" %}

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2F3d3ed2rvcT15mutoIzZG%2Fimage.png?alt=media&#x26;token=b21199fd-a8b4-481c-96eb-e28f7ed38a77" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Bar Chart" %}

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FdJIyGJ1n5IisyrDjx0mj%2Fimage.png?alt=media&#x26;token=3bec5bd1-4786-4588-b823-4ed23d1d6273" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Pie Chart" %}

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2Fqj5qYNJCjrStJ8I8KfIJ%2Fimage.png?alt=media&#x26;token=6ae3c75c-4f9a-4ce2-9d5b-4aa69945cca8" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### Page Settings

You can design your own analytics dashboard for each calculator on this page using **Page Settings.**&#x20;

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2Fv6ujU2MZOEtV11qdLKnb%2Fimage.png?alt=media&#x26;token=f64fbd24-c5d1-4ba2-8bdc-c7851f0a8575" alt=""><figcaption></figcaption></figure>

Page Settings is divided into two tabs:

{% tabs %}
{% tab title="Charts" %}
Here you can enable/disable the graphs that need to be represented. Graphs come from the calculator elements (fields), which is why they're unique for each calculator.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FMFvqSADhjvxSGyA1CMqN%2Fimage.png?alt=media&#x26;token=27666b28-8e71-4527-9f14-8d80afab9b36" alt=""><figcaption></figcaption></figure>
{% endtab %}

{% tab title="Widgets" %}
Here you can enable/disable the [**widgets** ](#analytics-widgets)(small line graphs) that need to be represented. Some of them come from the calculator elements (fields), which is why they're unique for each calculator.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FTUkTTij8a9cZiRJvZH5U%2Fimage.png?alt=media&#x26;token=af8bd292-804b-405d-b39e-19f69a5f4514" alt=""><figcaption></figcaption></figure>
{% endtab %}
{% endtabs %}

### Analytics Widgets

There is also an option to display some metrics as a form of widgets (small line graphs) on the right sidebar of the page.

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2F62pz5MZM2NVXt7W8zd2X%2Fimage.png?alt=media&#x26;token=8d97bc3c-1aec-4558-ada2-adfb4619e0a0" alt=""><figcaption></figcaption></figure>

To add a new widget, first, choose it from the dropdown and click on <kbd>Add Widget</kbd>:

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FFLcbvXT6PTvXkDzWYL2E%2Fimage.png?alt=media&#x26;token=edf2b82b-b4bc-4c2a-84bc-764b3025db33" alt=""><figcaption></figcaption></figure>

Using the three-dot<i class="fa-ellipsis-vertical">:ellipsis-vertical:</i>icon, you can get the parameters for the selected widget:

<figure><img src="https://834137925-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MDTO7zmTA5-HpvK8JDA%2Fuploads%2FUvyjv7GB3gcAoPRMIGr9%2Fimage.png?alt=media&#x26;token=6f1446bc-b6ad-4bc5-acaf-ebf429cc2621" alt=""><figcaption></figcaption></figure>

* **Hide** - hides the selected widget
* **Small/Large** - changes the widget display mode
* **Delete** - deletes the widget from the list