Back to blog
April 19, 2026 - Stockful

Turn Your Shopify Inventory Data Into a Conversion Tool With Storefront Badges and Metafields

Stockful writes 11 inventory metafields to Shopify and ships two no-code theme blocks. Add stock badges and location availability to any product page.

Your inventory data has been doing one job: telling you what is in stock and what is not. It lives in the admin, powers your internal reports, and occasionally triggers an alert.

But inventory data is also one of the strongest conversion levers in ecommerce. “Only 3 left” drives urgency. “In stock at your nearest store” builds confidence. A product selling 50 units per day signals social proof. These are all inventory signals, and most Shopify merchants never put them in front of their customers.

The reason is simple: getting real-time inventory data onto your storefront has historically required custom development. You need a developer to write Liquid code, connect to the right data source, handle edge cases, and maintain it when your theme updates.

Stockful’s new storefront data feature changes that. It writes 11 inventory metafields directly to your Shopify products and ships two configurable theme blocks you can drag onto any product page in the theme editor. For developers building custom or headless storefronts, a JavaScript API (window.stockful) exposes the full dataset for complete flexibility.

No code required for the standard setup. Full control available for those who want it.

What is new

Stockful now does three things it did not do before:

Metafield sync. Stockful writes 11 inventory-derived metafields to your Shopify products and variants, updated in real time for stock status and daily for analytics metrics. These metafields are accessible in Liquid templates, the Shopify Storefront API (for headless builds), and through a JavaScript global.

Theme blocks. Two pre-built theme blocks, Stockful Badge and Stockful Location Availability, can be added to any product page template through the Shopify theme editor. They are fully configurable (shape, colours, display options) and require no code.

Developer API. A window.stockful JavaScript global provides the full inventory dataset for any product on the page, enabling custom integrations in bespoke Liquid themes or headless storefronts.

All three are available on every Stockful plan.

The 11 metafields

Stockful syncs 11 metafields to your Shopify products, split between variant-level and product-level data. All metafields live under the namespace app--326028230657--stockful.

7 variant-level metafields

These are attached to individual product variants, giving you granular data for each size, colour, or option:

stock_status. The variant’s current inventory state: in stock, low stock, or out of stock. This updates within seconds of an inventory change, so your storefront always reflects reality.

available_quantity. The number of units currently available for sale. Combined with your theme logic, this powers “Only X left” messaging.

velocity. The variant’s average daily sales rate, calculated from Stockful’s historical data. A high velocity number is social proof: this product is popular and moving fast.

days_of_supply. How many days of stock remain at the current sales rate. When this drops below a threshold, it is a natural urgency signal.

low_stock_threshold. The point at which Stockful considers the variant to be low stock. Exposing this is optional but useful for custom Liquid logic.

reorder_point. The inventory level at which a reorder should be placed. Primarily useful for internal-facing storefront tools or B2B contexts.

sold_count. The number of units sold in the trailing period. “147 sold this week” is a social proof signal that most stores leave unused.

4 product-level metafields

These are attached at the product level and aggregate data across all variants:

stock_status. The product’s overall status. If any variant is in stock, the product-level status reflects that.

abc_class. The product’s ABC classification (A, B, or C). While this is primarily an ops metric, it has merchandising applications: you might display urgency badges only on A-class products, since those are the items customers care most about being available.

velocity. The product-level daily sales rate across all variants.

days_of_supply. The product-level days of supply, useful for broad “selling fast” indicators.

What each metafield unlocks

The metafields are building blocks. Here is what they enable on the storefront:

stock_status powers basic stock badges (in stock, low stock, out of stock) with no additional logic needed. available_quantity powers “Only X left” urgency messaging. velocity and sold_count power social proof (“selling fast”, “X sold this week”). days_of_supply powers time-based urgency (“only 3 days of stock left at this rate”). abc_class lets you selectively apply urgency tactics to your most important products.

The real-time metafields (stock_status, available_quantity) update within seconds of an inventory change. The analytics metafields (velocity, days_of_supply, sold_count, and others) sync once per day, which is appropriate for their slower-changing nature.

The two theme blocks

For merchants who want the conversion benefits without writing any code, Stockful ships two theme blocks that work with any Online Store 2.0 compatible theme.

Stockful Badge

This block displays a stock status indicator on your product page. It can show the current state (in stock, low stock, out of stock), urgency messaging based on available quantity or days of supply, and social proof based on velocity or sold count.

The block is configurable directly in the theme editor:

You choose the badge shape and colour scheme. You control which data points to display (stock status only, quantity remaining, velocity, or a combination). You set the thresholds for when urgency messaging appears (for example, show “Only X left” when available quantity drops below 10). You decide whether to show the badge on all products or only when certain conditions are met.

The result is a polished, on-brand stock indicator that updates automatically as inventory changes, without you touching code or manually updating product descriptions.

Stockful Location Availability

This block adds a “Check store availability” button to your product page. When a customer clicks it, a drawer slides open showing which of your Shopify locations have the product in stock, along with available quantities at each.

This is particularly valuable for merchants with both online and physical retail locations. Customers can see whether a product is available at their nearest store before making a trip, or choose to buy online if no local store has it.

The block is configurable: you choose which locations to display (you probably do not want to show your central warehouse), set the button text, and control the drawer’s visual style.

For developers: the window.stockful API

If you are building a custom Liquid theme or a headless storefront, the pre-built theme blocks may not fit your design. The window.stockful JavaScript global gives you direct access to the full inventory dataset for any product on the page.

This lets you build completely custom stock displays, integrate inventory data into existing theme components, or pipe the data into a React or Vue frontend in a headless architecture.

For Liquid templates, you can access the metafields directly. Here is how to read a product’s stock status:

{{ product.metafields.app--326028230657--stockful.stock_status.value }}

For headless storefronts using the Shopify Storefront API, query the metafields via GraphQL:

query ProductWithStock($handle: String!) {
  product(handle: $handle) {
    stockStatus: metafield(namespace: "app--326028230657--stockful", key: "stock_status") {
      value
    }
  }
}

The full developer documentation, including the complete window.stockful object reference and example implementations, is at docs.stockful.app/storefront/developer-api. For the full metafield schema and type definitions, see the data reference.

Setup walkthrough

Getting storefront data live takes three steps.

Step 1: Enable storefront data in Stockful

Open the Stockful app in your Shopify admin. Go to Settings, then Storefront. Toggle “Enable storefront data” and choose which metafields you want to sync. You can enable all 11 or just the ones relevant to your use case (for example, only stock_status and available_quantity if you just want a basic stock badge).

Once enabled, Stockful begins writing metafields to your products immediately.

Step 2: Activate the app embed

In your Shopify admin, go to Online Store, then Themes, then Customize. In the theme editor, open the App embeds panel (in the left sidebar). Find Stockful and enable it. This loads the lightweight script that powers the theme blocks and the window.stockful API.

Step 3: Add blocks to your product page

Still in the theme editor, navigate to your product page template. Click “Add block” and look for Stockful Badge or Stockful Location Availability. Drag the block into your desired position on the page, configure the display options, and save.

That is it. Your product pages now display live inventory data.

For a detailed visual walkthrough, see the theme blocks guide.

Example patterns

Here are four common patterns merchants build with storefront data.

Urgency badge: “Only X left”

Use the Stockful Badge block with quantity display enabled. Set a threshold (for example, show quantity only when available_quantity is below 15). When a product has 8 units remaining, customers see “Only 8 left” directly on the product page. When it is restocked above 15, the quantity message disappears and a standard “In stock” badge shows instead.

This pattern is effective because it creates genuine urgency based on real data, not manufactured scarcity.

Social proof: “Selling fast”

Use the velocity or sold_count metafield to trigger a “Selling fast” label. If a product is moving more than, say, 5 units per day, display the badge. This is particularly powerful for newer products that do not yet have reviews or ratings but are demonstrably popular based on sales data.

Multi-location availability

Drop in the Stockful Location Availability block. Customers click “Check store availability” and see a location-by-location breakdown. This is valuable for retailers with physical stores because it answers the question “Can I get this at my local branch?” before the customer has to call or visit.

It also works as a conversion nudge: if the customer’s nearest store is out of stock, the drawer makes it obvious that buying online and shipping to home is the faster option.

Custom Liquid: conditional badges for A-class products only

Using Liquid directly, you can build conditional logic that displays urgency badges only for your most important products:

{% if product.metafields.app--326028230657--stockful.abc_class.value == "A" %}
  {% if product.metafields.app--326028230657--stockful.stock_status.value == "low_stock" %}
    <span class="badge badge--urgency">Low stock, order soon</span>
  {% endif %}
{% endif %}

This prevents urgency badge fatigue. If every product on your store has a “Low stock” badge, customers stop believing it. Reserving urgency signals for your genuine bestsellers (A-class products) keeps them credible.

For more storefront patterns, including velocity-based badges and conditional displays for seasonal products, see the examples library.

Why this matters

Most Shopify inventory apps are admin-only tools. They help merchants manage stock, but the data never reaches the customer. Stockful’s storefront data bridges that gap.

The principle is straightforward: your inventory data is already telling a story about your products. Which ones are popular. Which ones are running low. Where they are available. Sharing that story with customers, selectively and honestly, improves the shopping experience and drives conversion.

Urgency works because it is real. Social proof works because it is real. Location availability works because it solves a genuine customer question. None of these require exaggeration or manipulation. They just require putting accurate inventory data where customers can see it.

Stockful gives you the data pipeline (metafields updated in real time), the no-code option (theme blocks), and the developer toolkit (window.stockful and Storefront API access) to make it happen however your store is built.

Get started at stockful.app. See the full storefront documentation at docs.stockful.app/storefront/overview.

More from Stockful: