{"id":1837,"date":"2021-07-23T15:23:57","date_gmt":"2021-07-23T15:23:57","guid":{"rendered":"https:\/\/meetanshi.com\/blog\/show-salable-quantity-in-magento-2-product-page\/"},"modified":"2025-07-23T17:16:35","modified_gmt":"2025-07-23T11:46:35","slug":"show-salable-quantity-in-magento-2-product-page","status":"publish","type":"post","link":"https:\/\/meetanshi.com\/blog\/show-salable-quantity-in-magento-2-product-page\/","title":{"rendered":"How to Show Salable Quantity in Magento 2 Product Page"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">\u201cOnly 2 left in stock!\u201d<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Ever read it on any online store? If yes, ever felt a sense of urgency and FOMO?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Marketers use this strategy to prompt potential customers to convert before their favorite products run out of stock.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">However, have you ever thought about how to implement such a technique in&nbsp;Magento 2&nbsp;store?<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The answer is to&nbsp;<em><strong>show salable quantity in Magento 2 product page<\/strong><\/em>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">As the release of&nbsp;<a href=\"https:\/\/meetanshi.com\/blog\/magento-2-3-3-release\/\" target=\"_blank\" rel=\"noreferrer noopener\">Magento 2.3.3<\/a>&nbsp;introduced the concept of salable quantity with the&nbsp;<a href=\"https:\/\/meetanshi.com\/blog\/magento-2-multi-source-inventory\/\" target=\"_blank\" rel=\"noreferrer noopener\">Magento 2 Multi-Source Inventory<\/a>&nbsp;system, now Magento 2 store owners can make use of it and add such messages on the frontend as shown here:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/meetanshi.com\/blog\/wp-content\/uploads\/2021\/07\/Screenshot-at-July-16th-2021-4.34.10-pm-1024x464.png\" alt=\"Show salable quantity in product page in Magento 2\" class=\"wp-image-15642\"\/><\/figure>\n<\/div>\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/meetanshi.com\/blog\/magento-2-salable-quantity-vs-quantity\/\" target=\"_blank\" rel=\"noreferrer noopener\">Salable quantity<\/a>&nbsp;is the sum of all available products that allow you to manage multiple warehouses from one place and saves you from dead inventory or out of stock!<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><a href=\"https:\/\/meetanshi.com\/blog\/get-product-salable-quantity-in-magento-2\/\" target=\"_blank\" rel=\"noreferrer noopener\">Get product salable quantity in Magento 2<\/a>\u00a0and show salable quantity on the product page!<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Check out the below code to do so.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Method to Show Salable Quantity in Magento 2 Product Page<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">1. Create&nbsp;<strong>registration.php<\/strong>&nbsp;at&nbsp;<strong>app\/code\/Vendor\/Module\/<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;?php\n\\Magento\\Framework\\Component\\ComponentRegistrar::register(\n    \\Magento\\Framework\\Component\\ComponentRegistrar::MODULE,\n    'Meetanshi_ShowQty',\n    __DIR__\n);<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">2. Create&nbsp;<strong>module.xml<\/strong>&nbsp;file at&nbsp;<strong>app\/code\/Vendor\/Module\/etc<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;?xml version=\"1.0\"?>\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\"\n        xsi:noNamespaceSchemaLocation=\"..\/..\/..\/..\/..\/lib\/internal\/Magento\/Framework\/Module\/etc\/module.xsd\">\n    &lt;module name=\"Meetanshi_ShowQty\" setup_version=\"1.0.0\" schema_version=\"1.0.0\"\/>\n&lt;\/config><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">3. Create&nbsp;<strong>routes.xml<\/strong>&nbsp;file at&nbsp;<strong>app\/code\/Vendor\/Module\/etc\/frontend<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;?xml version=\"1.0\" ?>\n&lt;config xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\"\n        xsi:noNamespaceSchemaLocation=\"urn:magento:framework:App\/etc\/routes.xsd\">\n    &lt;router id=\"standard\">\n        &lt;route frontName=\"showqty\" id=\"showqty\">\n            &lt;module name=\"Meetanshi_ShowQty\"\/>\n        &lt;\/route>\n    &lt;\/router>\n&lt;\/config><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">4. Create&nbsp;<strong>catalog_product_view.xml&nbsp;<\/strong>file at&nbsp;<strong>app\/code\/Vendor\/Module\/view\/frontend\/layout<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;?xml version=\"1.0\"?>\n&lt;page xmlns:xsi=\"http:\/\/www.w3.org\/2001\/XMLSchema-instance\"\n      xsi:noNamespaceSchemaLocation=\"urn:magento:framework:View\/Layout\/etc\/page_configuration.xsd\">\n    &lt;body>\n        &lt;referenceBlock name=\"alert.urls\">\n            &lt;block class=\"Magento\\Framework\\View\\Element\\Template\" name=\"catalog.product.view.extrablock\"\n                   before=\"product.info.addtocart\" template=\"Meetanshi_ShowQty::showqty.phtml\" cacheable=\"false\"\/>\n        &lt;\/referenceBlock>\n    &lt;\/body>\n&lt;\/page><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">5. Create&nbsp;<strong>showqty.phtml&nbsp;<\/strong>file at&nbsp;<strong>app\/code\/Vendor\/Module\/view\/frontend\/templates<\/strong><\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;?php\n$blockObj = $block->getLayout()->createBlock('Meetanshi\\ShowQty\\Block\\ShowQty');\necho \"&lt;h1>Salable Qty:- \" . $blockObj->saleble() . \"&lt;\/h1>\";\n?><\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">6. Create&nbsp;<strong>showqty.php&nbsp;<\/strong>file at&nbsp;<strong>app\/code\/Vendor\/Module\/Block&nbsp;<\/strong>and use the below code:<\/p>\n\n\n\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\" data-enlighter-theme=\"\" data-enlighter-highlight=\"\" data-enlighter-linenumbers=\"\" data-enlighter-lineoffset=\"\" data-enlighter-title=\"\" data-enlighter-group=\"\">&lt;?php\n\nnamespace Meetanshi\\ShowQty\\Block;\n\nuse Magento\\Catalog\\Model\\ProductFactory;\nuse Magento\\Framework\\App\\Request\\Http;\nuse Magento\\Framework\\View\\Element\\Template;\nuse Magento\\Backend\\Block\\Template\\Context;\nuse Magento\\InventorySalesApi\\Api\\GetProductSalableQtyInterface;\nuse Magento\\InventorySalesApi\\Api\\StockResolverInterface;\nuse Magento\\Store\\Model\\StoreManagerInterface;\nuse Magento\\InventorySalesApi\\Api\\Data\\SalesChannelInterface;\n\n\/**\n * Class ShowQty\n * @package Meetanshi\\ShowQty\\Block\n *\/\nclass ShowQty extends Template\n{\n    \/**\n     * @var GetProductSalableQtyInterface\n     *\/\n    protected $salebleqty;\n\n    \/**\n     * @var StockResolverInterface\n     *\/\n    protected $stockresolver;\n\n    \/**\n     * @var StoreManagerInterface\n     *\/\n    protected $storemanager;\n\n    \/**\n     * @var Http\n     *\/\n    protected $request;\n\n    \/**\n     * @var ProductFactory\n     *\/\n    protected $product;\n\n    \/**\n     * ShowQty constructor.\n     * @param ProductFactory $product\n     * @param StoreManagerInterface $storemanager\n     * @param GetProductSalableQtyInterface $salebleqty\n     * @param Http $request\n     * @param StockResolverInterface $stockresolver\n     * @param Context $context\n     * @param array $data\n     *\/\n    public function __construct(\n        ProductFactory $product,\n        StoreManagerInterface $storemanager,\n        GetProductSalableQtyInterface $salebleqty,\n        Http $request,\n        StockResolverInterface $stockresolver,\n        Context $context,\n        array $data = [])\n    {\n        $this->product = $product;\n        $this->request = $request;\n        $this->storemanager = $storemanager;\n        $this->salebleqty = $salebleqty;\n        $this->stockresolver = $stockresolver;\n        parent::__construct($context, $data);\n    }\n\n    \/**\n     * @throws \\Magento\\Framework\\Exception\\LocalizedException\n     * @throws \\Magento\\Framework\\Exception\\NoSuchEntityException\n     *\/\n    public function saleble()\n    {\n\n        $websiteCode = $this->storemanager->getWebsite()->getCode();\n        $stock = $this->stockresolver->execute(SalesChannelInterface::TYPE_WEBSITE, $websiteCode);\n        $stockId = $stock->getStockId();\n        $productid = $this->request->getParam('id');\n        $loadProduct = $this->product->create()->load($productid);\n        $sku = $loadProduct->getSku();\n        $type = $loadProduct->getTypeId();\n\n        if ($type != 'configurable' &amp;&amp; $type != 'bundle' &amp;&amp; $type != 'grouped') {\n            $stockQty = $this->salebleqty->execute($sku, $stockId);\n            return $stockQty;\n        } else {\n            return '';\n        }\n\n    }\n}<\/pre>\n\n\n\n<p class=\"wp-block-paragraph\">That\u2019s it.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Do consider sharing this post with Magento Community via social media.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Thank you.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u201cOnly 2 left in stock!\u201d Ever read it on any online store? If yes, ever felt a sense of urgency and FOMO? Marketers use this strategy to prompt potential customers to convert before their favorite products run out of stock. However, have you ever thought about how to implement such a technique in&nbsp;Magento 2&nbsp;store? The [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[34],"tags":[],"class_list":["post-1837","post","type-post","status-publish","format-standard","hentry","category-magento"],"_links":{"self":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/1837","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/comments?post=1837"}],"version-history":[{"count":5,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/1837\/revisions"}],"predecessor-version":[{"id":19299,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/1837\/revisions\/19299"}],"wp:attachment":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/media?parent=1837"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/categories?post=1837"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/tags?post=1837"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}