> For the complete documentation index, see [llms.txt](https://halosoft.gitbook.io/ella-7-documentation/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://halosoft.gitbook.io/ella-7-documentation/product-page/hot-stock.md).

# Hot stock

Highlights products with limited inventory to create urgency and encourage customers to purchase before items sell out.

<figure><img src="https://3432241786-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAgyEGjimJ0Z5PS9XDyAH%2Fuploads%2FWlQUZLtQ2WRzbr4zkebc%2Fimage.png?alt=media&amp;token=2a4a5b2b-1aef-485b-9ffb-78714ea43822" alt=""><figcaption></figcaption></figure>

### **How to add the** Hot stock **block?**

1. From your Shopify admin, go to **Online Store** -> **Themes**.
2. Find the theme that you want to edit, and then click **Customize**.
3. Choose **Products** from the dropdown window.
4. In the **Templates -> Add Product information ->** **Add section Details ->** choose **Product hot stock**

<figure><img src="https://3432241786-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAgyEGjimJ0Z5PS9XDyAH%2Fuploads%2F0r9RcGGXC8p5SeEO5Tqo%2Fimage.png?alt=media&amp;token=d295176a-23ef-42b6-9aeb-dcbcbdf3b5e0" alt=""><figcaption></figcaption></figure>

## Product Hot Stock Settings <a href="#user-content-product-hot-stock-settings" id="user-content-product-hot-stock-settings"></a>

### Configuration <a href="#user-content-configuration" id="user-content-configuration"></a>

<figure><img src="https://3432241786-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAgyEGjimJ0Z5PS9XDyAH%2Fuploads%2F9UF8peA5kSXgCMaAd9Ji%2Fimage.png?alt=media&amp;token=c4e64cfc-ed54-42a2-ba3d-d3aa9cb00eb5" alt=""><figcaption></figcaption></figure>

| Label             | Type     | Description                                                                                                        | Visibility                                    |
| ----------------- | -------- | ------------------------------------------------------------------------------------------------------------------ | --------------------------------------------- |
| Product max stock | `number` | Set the maximum inventory level to be used as the 100% reference for the progress bar.                             | Always visible                                |
| Text color        | `color`  | Set the color of the text displayed in the hot stock notice.                                                       | Always visible                                |
| Text preset       | `select` | Select a typography preset for the notice. Choose **Custom** to configure font family, size, and styling manually. | Always visible                                |
| Font              | `select` | Choose the font family (Body, Subheading, or Heading) for the notice text.                                         | Visible when "Text preset" is set to "Custom" |
| Size              | `select` | Set the font size for the notice text.                                                                             | Visible when "Text preset" is set to "Custom" |
| Line height       | `select` | Adjust the vertical spacing between lines of text.                                                                 | Visible when "Text preset" is set to "Custom" |
| Letter spacing    | `select` | Adjust the horizontal spacing between characters.                                                                  | Visible when "Text preset" is set to "Custom" |
| Case              | `select` | Transform text casing (e.g., Default, Uppercase, Capitalize).                                                      | Visible when "Text preset" is set to "Custom" |

### Progress Bar <a href="#user-content-progress-bar" id="user-content-progress-bar"></a>

<figure><img src="https://3432241786-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAgyEGjimJ0Z5PS9XDyAH%2Fuploads%2Fz4rqE3HqJTPz526Enwcf%2Fimage.png?alt=media&amp;token=682b77c8-7fa6-48bc-9e21-394eb000e160" alt=""><figcaption></figcaption></figure>

| Label                | Type    | Description                                                                             | Visibility     |
| -------------------- | ------- | --------------------------------------------------------------------------------------- | -------------- |
| Progress bar height  | `range` | Adjust the thickness (in pixels) of the inventory progress bar.                         | Always visible |
| Progress bar color 1 | `color` | Set the primary color for the progress bar (e.g., representing low stock).              | Always visible |
| Progress bar color 2 | `color` | Set the secondary color for the progress bar (e.g., representing healthy stock levels). | Always visible |