# Getting Started!

***

## 🗂️ <mark style="color:blue;">Overview</mark>

***

Get started with the **Jedi - Stock Counter** app! Quickly display a stock counter widget on the product page whenever needed to prioritize transparent communication with your customers regarding product availability!

***

## 📄<mark style="color:blue;">Introduction</mark>

***

Failing to display a stock counter on the products page can lead to customer frustration, missed sales opportunities, increased inquiries, negative user experience, decreased trust, inventory management challenges and damage to the brand's reputation.&#x20;

In order to overcome these difficulties, we have developed an app which displays a stock counter widget on the products page as and when required, so that merchants can now prioritize transparent communication about products availability by displaying stock counter widget, which can provide a positive shopping experience and helps in maintaining customer satisfaction.

***

## 📌 <mark style="color:blue;">How To Get Started?</mark>

This section guides you through the essential steps to efficiently display the stock counter widget on your product page.

{% hint style="success" %}
All the images in this section can be enlarged by clicking on them
{% endhint %}

***

### 📂 <mark style="color:blue;">Step 1: Configure Widget Design And Display Rules</mark>

***

{% stepper %}
{% step %}
Get started by clicking on the **Edit Settings** option of the default widget or add an alternate widget. Upon clicking, you will be taken to the **Widget Design And Display Rules** section.

<figure><img src="/files/8ryYxBUKIkBrN85jCwam" alt=""><figcaption><p>Edit Settings</p></figcaption></figure>
{% endstep %}

{% step %}
Now, configure the design and display rules of the stock counter widget based on the requirements of your store.
{% endstep %}

{% step %}
Once you are satisfied with the widget's design and display rules, click on the **Save** button to proceed to the next steps.

<figure><img src="/files/FgC7p3qtZEHww8NbYn7b" alt=""><figcaption><p>Widget Design &#x26; Display Rules</p></figcaption></figure>
{% endstep %}
{% endstepper %}

{% hint style="info" %}
Please note that the Design and Display Rules of the stock counter widget vary based on your subscription plan
{% endhint %}

***

### 🗃️ <mark style="color:blue;">Step 2: Enable And Add The Widget On Store's Active Theme</mark>

***

{% stepper %}
{% step %}
Next, you just need to enable the stock counter widget you have created.

<figure><img src="/files/5N0MNsDIQcM8ztriNpLT" alt=""><figcaption><p>Enable the widget</p></figcaption></figure>
{% endstep %}

{% step %}
Now, simply navigate to your **Shopify Theme Editor** and open the **Default Product** page. In the left-side navigation panel, click on **Add block** within the **Product information** section.&#x20;
{% endstep %}

{% step %}
After that, select the Jedi - Stock Counter app and simply drag and drop it to your preferred location on the page for seamless integration.

<figure><img src="/files/z5dI0Gpdgu2LikUXpNKT" alt=""><figcaption><p>Add Stock Counter Widget on product page</p></figcaption></figure>
{% endstep %}

{% step %}
Finally, click **Save** in the Theme Editor to ensure all your changes are applied successfully

<figure><img src="/files/b36PRUWwCtwXY4Br66pU" alt=""><figcaption><p>Click on Save</p></figcaption></figure>
{% endstep %}
{% endstepper %}


# Guide

A detailed description of Jedi's Stock Counter app can be found on this page.

## 👩🏻‍🏫 **Introduction:**

Displaying a stock counter widget on a product page can serve several important purposes.

By showing the remaining stock, it creates a sense of urgency among customers. If they see that there are only a few items left, they might be more inclined to make a purchase immediately, fearing the product might run out of stock soon. This fear can lead to quicker decision-making and increased conversions.

Displaying stock levels adds transparency to the purchasing process. Customers appreciate knowing how much of a product is available. It builds trust, as customers might feel that the store is being honest about its inventory levels.

let us understand about "Jedi - Stock Counter" app, what are its features? how does it work?&#x20;

### 📝 **Key Features of Our App**:

:arrow\_right: App facilitates user to display stock counter widget on the products page whenever stocks are getting low in the store, creating the sense of urgency to the customers to buy the products soon.

:arrow\_right: You have the flexibility to personalize the appearance of the stock counter widget, including options like bold or italicized text, changing text colors, modifying the background color, and even adding emojis to enhance its visual appeal.

:arrow\_right: You can preview the appearance of the stock counter widget in the app itself.

:arrow\_right: You can select either the product quantity or the variant quantity as the inventory value that will be displayed on the stock counter widget.

:arrow\_right: You can set the maximum and minimum range for the inventory value. The stock counter widget will only be displayed if the inventory quantity falls within the range defined by the user.

:arrow\_right: Stock counter widget is displayed automatically without any human intervention.

:arrow\_right: You can add multiple widgets but only 1 qualified widget as per the configured rules is displayed at a time. Priority of the widget is from top to bottom.

### **👩‍💻 App functionality**:

The stock counter widget is a dynamic feature designed to enhance the shopping experience for customers visiting the products page of an online store. Its visibility is directly tied to the inventory levels of the items available for purchase it can be products quantity or variants quantity.

When the inventory value, either products quantity or the variants quantity, falls within the specific range defined by the user (with a minimum and maximum quantity), the stock counter widget is automatically displayed on the products page. Its purpose is to provide real-time information, alerting potential buyers to the availability of products within the defined inventory range. This ensures that customers are well-informed about the stock status, helping them make timely purchasing decisions.

In essence, the stock counter widget's automatic visibility adjustment based on user-defined inventory ranges contributes significantly to a seamless and transparent shopping process. It enables customers to gauge product availability accurately, promoting informed decision-making and customer satisfaction while maintaining the integrity of the store's inventory management system.

## ⚙️ Let's see app configuration steps:

**STEP 1️⃣  -->** Initially, certain pre-settings need to be configured in the online store. steps explained below:

1. Go to your Theme Editor
2. Go to the "Default Product" page
3. On the left side navigation, click the "Add block" in the "Product information" section.
4. Choose the app, then drag and drop wherever you want.
5. Don't forget to click "Save" in the theme editor.

<figure><img src="/files/0RSOtdcOcFijPKWyHppB" alt=""><figcaption><p>Online store theme customization</p></figcaption></figure>

**STEP 2️⃣ -->** Launch the application in the store

<figure><img src="/files/M47wduT0L6FHnf2rlWLz" alt=""><figcaption></figcaption></figure>

**STEP 3️⃣ -->** Configure the look and feel of the widget

Style the text by applying bold, italic, or underline formatting, incorporate background colors, change the text color, add emojis for visual effects, and then preview the changes.

Select inventory quantity either products quantity or variants quantity.

<figure><img src="/files/zpjrkv7aCvl77UHPvJ6l" alt=""><figcaption></figcaption></figure>

**STEP 4️⃣ -->** Configure rules when the widget should be displayed.

<figure><img src="/files/dfOv4MpiASzqka9310Sv" alt=""><figcaption></figcaption></figure>

Set the min and max quantity range so whenever inventory quantity falls in the defined range then the stock counter widget is displayed automatically on the products page.

**STEP 5️⃣ -->** Save the app settings and enable it to ensure the stock counter widget is displayed whenever the store's inventory is running low.


# Video Tutorial

Learn different features of the Jedi - Stock Counter app with these video tutorials

## <mark style="color:blue;">How to display the stock counter widget on the products page?</mark>

{% embed url="<https://youtu.be/hT9gNm-1hKA>" %}
Learn how to display the stock counter widget on the products page
{% endembed %}

## <mark style="color:blue;">How do I show widget for selected products?</mark>

{% embed url="<https://youtu.be/y8phX1C64po>" %}
Learn how to show widget for selected products
{% endembed %}

## <mark style="color:blue;">How do I hide the widget if the inventory is more than 10?</mark>

{% embed url="<https://youtu.be/t75nyxpAn9E>" %}
Learn how to hide the widget if the inventory is more than 10
{% endembed %}


# FAQs

All the answers to your questions can be found here!

<details>

<summary>Is the inventory quantity considered as the product's quantity or the variant's quantity ?</summary>

The app enables merchants to configure whether to show product's quantity or the variants' quantity.

<img src="/files/iq6wtncOq4gVVLoGTiHU" alt="" data-size="original">

</details>

<details>

<summary>How can the widget be hidden when products are sold out?</summary>

It is very simple and easy to hide stock counter widget when the products are sold out. Simply set the Min quantity value to 1 or more under "Appearance rule" section of the widget.

</details>

<details>

<summary>Is there any option to create multiple widgets ?</summary>

Yes, you can create multiple widgets but only 1 widget will be displayed on the products page. Priority of the widget is decided based on the position of the widget in the app (Top to bottom) .

<img src="/files/bb1JqN5UL78iP4Mtbvol" alt="" data-size="original">

</details>

<details>

<summary>Whom to contact in case of any queries?</summary>

You can write to us at <support@jediapps.com> in case of any queries.

</details>


# Services

Have a unique idea or facing a challenge, no app currently solves? We’re here to help.

Whether you're looking to build a **Shopify app,**  getting an app published to shopify app store, enhance your store’s functionality, or simply explore what’s possible — our team is ready to collaborate.

***

## 👨🏽‍💻<mark style="color:blue;">Quick Introduction</mark>

***

We are a passionate and skilled team of developers, designers, and a product manager. With **10+ years of hands-on experience** in e-commerce technologies, we've built a strong foundation in designing and developing powerful, user-centric **Shopify apps**.

We believe in building **solutions that scale**, **features that matter**, and **interfaces that sell**.

> Whether you're launching your first Shopify store or looking to optimize a complex e-commerce flow — we’re here to help you do it smarter

***

## 🛠️ <mark style="color:blue;">Shopify Apps We've Built</mark>

***

Over the years, we’ve developed a wide range of apps tailored to unique business needs. Here’s a glimpse of what we’ve delivered for merchants and brands across the globe:

<details>

<summary><strong>Jedi Product &#x26; Collection Sort</strong></summary>

**Jedi Product & Collection Sort**, is a powerful tool that helps online store owners efficiently organize product displays. With advanced sorting options and an intuitive interface, it enables flexible product arrangements.

📌Check out the app: <https://apps.shopify.com/coll-sort-push-down-sold-out-1>

</details>

<details>

<summary><strong>iAlert - Low Stock Alert</strong></summary>

The **iAlert – Low Stock Alert** app helps merchants stay informed when stock levels drop below a set threshold. Users can define a minimum stock value, and when inventory reaches or falls below this limit, a notification is automatically sent to the designated email.

📌Check out the app: <https://apps.shopify.com/low-stock-notifier>

</details>

<details>

<summary><strong>Blink - Hide Publish</strong></summary>

The **Blink- Hide & Publish** app empowers merchants to integrate their stores by hiding sold-out items and republishing them once they’re back in stock, ensuring that customers only see products they can purchase.

📌Check out the app: <https://apps.shopify.com/auto-hide-unhide-products?st_source=autocomplete>

</details>

<details>

<summary><strong>Jedi Stock Counter</strong></summary>

The **Jedi Stock Counter** app displays a stock counter widget on the products page as and when required, so that merchants can prioritize transparent communication about availability of a product in their store.

📌Check out the app: <https://apps.shopify.com/jedi-stock-counter>

</details>

<details>

<summary><strong>ToolKit Sales Boost</strong></summary>

**ToolKit - Sales Boost Pro** is a flexible app designed to simplify tasks, boost productivity, and optimize your workflow. From managing inventory and tracking stock levels to announcing exciting sales, this versatile app offers a suite of intuitive, customizable tools crafted to suit your store's needs.

📌Check out the app: <https://apps.shopify.com/xeon-multi-tool><br>

</details>

<details>

<summary><strong>Xeon - Back In Stock Date</strong></summary>

The **Xeon - Back In Stock Date** app helps you display the expected restock date for sold-out products, so shoppers know when to return, reducing lost sales and improving trust.

📌Check out the app: <https://apps.shopify.com/go-in-stock-alerts>

</details>

<details>

<summary><strong>Orderly - Order Notifier</strong></summary>

The **Orderly - Order Notifier** helps merchants streamline order management by automatically sending order reports to staff and admins. Set up powerful automations to notify customers about order updates or send bulk emails to multiple order recipients — all with ease.

📌Check out the app: <https://apps.shopify.com/unfulfilled-order-notifier>

</details>

> **Explore all our apps exclusively on the Shopify App Store.**\
> Browse the complete collection using the links below:
>
> * <https://apps.shopify.com/partners/gamenow>
> * <https://apps.shopify.com/partners/developer-84536043624c65bc>

***

## 📬 <mark style="color:blue;">Contact Us</mark>

***

Get in touch with us — we're here to help you build the perfect Shopify solution.

* 📧 **Email:&#x20;**<mark style="color:blue;">**<support@jediapps.com>**</mark>
* 📅 **Schedule google-meet call:** [**https://calendar.app.google/AJhAQwjCRhEC8Xgs7**](https://calendar.app.google/AJhAQwjCRhEC8Xgs7)
* 📱 **WhatsApp:&#x20;**<mark style="color:blue;">**+918287046468**</mark>
* 🌐 **Website:** [**https://www.unovahq.com/**](https://www.unovahq.com/)

> We're committed to crafting smart, scalable Shopify solutions, tailored just for your business.


