> For the complete documentation index, see [llms.txt](https://docs.stylemixthemes.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/file-upload.md).
# File Upload (Pro feature)
Using the **File Upload** element allows you to upload files in different sizes, quantities and formats.
## Element Tab
The File Upload element has the following attributes in the Element Tab:
* **Element Name** - Title of the element
* **Description** - brief description of the field that will be displayed with the element name.
* **Element width -** set the width of the field relative to the width of the calculator in 100% scale. You will see the changes in real time.
* **Upload from URL** - enables uploading files via a direct URL link to users.
* **Maximum attached files** - the maximum number of files that can be attached.
* **Max file size** - indicate the maximum file size that needs to be uploaded in `MB`.
{% hint style="info" %}
The field above derives its value from the host server's configurations. Learn more about increasing the maximum file size [here](https://app.gitbook.com/o/-MDO-gEg-EzaIBt-7nI8/s/-MDTO7zmTA5-HpvK8JDA/c/Hsa0yQhgwoLAbane3aKP/calculator-elements/file-upload/how-to-increase-maximum-file-upload-size-in-wordpress).
{% endhint %}
* **Set Price for File Uploads** - enables specifying the numeric value for the field so you can use it in [Formula](/cost-calculator-builder/calculator-elements/total.md) fields to calculate the price.
* **Sum Prices for Each File** - the value of the field will be increased per uploaded file. For example, you set the cost as 3 and uploaded 5 files. Instead of just 3, the calculator gives 15 (*3x5=15*) to the Formula field as the cost.
* **Allowed formats** - here specify the file formats that can be uploaded.
{% hint style="info" %}
By default, WordPress allows only common file formats to be uploaded. However, all file types can be set as allowed by taking certain steps. To learn more about it, navigate to this [section](https://app.gitbook.com/o/-MDO-gEg-EzaIBt-7nI8/s/-MDTO7zmTA5-HpvK8JDA/c/Hsa0yQhgwoLAbane3aKP/calculator-elements/file-upload/how-to-allow-additional-file-types-in-wordpress).
{% endhint %}
### Measurement Unit
This section of the Element tab helps to adjust the measurement unit applied to the field and the symbol displayed with the field value:
* **Use Currency Sign** - mainly used to accept fractional inputs and applies the currency settings defined in the [Calculator Settings](/cost-calculator-builder/cost-calculator-settings/calculator-settings/currency.md). The setting will be disabled automatically if **Set Measurement Unit** is enabled.
* **Unit Symbol** - enter the unit symbol
* **Position** - select the position where the symbol should be displayed relative to the number
* **Thousands separator** - select the symbol to [separate thousands ](#user-content-fn-1)[^1]
* **Number of decimals** - indicate the number of decimals in the fractional part
* **Decimal separator** - select the symbol to separate the fractional part
## Settings Tab
The **File Upload** element has the following attributes in the Settings Tab:
* **Required** - Defines whether the element will be required to fill or not.
* **Show in Grand Total** - Disable if you want to hide the element in Grand Total.
* **Hidden by Default** - The element will be hidden until a corresponding [**condition**](/cost-calculator-builder/conditional-system/introduction.md) is met. If the element is hidden, its default value will be counted as '0' in the formula
* **Calculate hidden by default** - If any case hides the element: via the **Hidden by Default** setting or hidden by some [**condition**](/cost-calculator-builder/conditional-system/introduction.md), the element's default value (if it is set) will be counted in the formula
* **Additional Classes** - Add[ extra classes](/cost-calculator-builder/plugin-features/additional-classes.md) to the HTML elements to further style changes.
## Example of Using File Upload
To add the **File Upload** element to your calculator, simply drag and drop the element to your preferred place in the calculator. Fill in the fields based on your preference and save the changes.
Below you can see the result of the created sample calculator with the File Upload element. By the **Choose file** button, you can upload files directly from your computer or upload files via **URL.**
{% tabs %}
{% tab title="Show in Grand Total enabled" %}
The result of the **File Upload** element will be displayed in the total summary.
{% endtab %}
{% tab title="Show in Grand Total disabled" %}
The result of the **File Upload** element will not be displayed in the total summary.
{% endtab %}
{% endtabs %}
Received orders can be located in **Dashboard > Cost Calculator > Orders.** Orders with attached files are displayed with a **Paper Clip** icon beside them.
Uploaded files are available in the open form on the popup window which appears after clicking the **order**.
{% hint style="info" %}
When [Woo Checkout](/cost-calculator-builder/cost-calculator-settings/calculator-settings/woo-products/woo-checkout.md) is enabled in calculator settings the details of the order will be displayed in the WooCommerce orders section and attached files can be found from the order details.
{% endhint %}
[^1]: r.g 7, 000, 000 (seven millions)
---
# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.
## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.
Perform an HTTP GET request on the current page URL with the `ask` query parameter:
```
GET https://docs.stylemixthemes.com/cost-calculator-builder/calculator-elements/file-upload.md?ask=
```
The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.
Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.