Question

In Magento 2 how to change a stock availability for 'out of stock' products in frontend (category listing and product detail page). I don't want to override a template file. I want to change a custom message instead of the 'Out of stock' stock availability message in frontend.

layout/catalog_product_view.xml

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="product.info.form.content">
            <block class="Vendor\LowStockNotification\Block\Product" after="product.info.addtocart" template="Vendor_LowStockNotification::custom_file.phtml"></block>
        </referenceContainer>
    </body>
</page>

layout/catalog_categoy_view.xml

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="content">
            <block class="Magento\Framework\View\Element\Template" name="custom.block" template="Vendor_LowStockNotification::custom_file.phtml" before="-" />
        </referenceContainer>
    </body>
</page>

custom_file.phtml

<?php  
$objectManager = \Magento\Framework\App\ObjectManager::getInstance();
$showStockStatus  = $objectManager->get('Magento\Framework\App\Config\ScopeConfigInterface')->getValue('lowstocknotification/low_stock_notification/stock_status/show_stock_status');
$customMessage = $objectManager->get('Magento\Framework\App\Config\ScopeConfigInterface')->getValue('lowstocknotification/low_stock_notification/stock_status/custom_status');
?>
<!-- custom Stock -->
<input type="hidden" class="show-stock-status" name="showstatus" id="show_stock_status" value="<?php echo $showStockStatus ?>">
<input type="hidden" class="custom-status" name="showstatus" id="custom_status" value="<?php echo $customMessage ?>">
<!-- custom Stock -->

<script type="text/javascript">
    require([
    'jquery',
    'domReady!'
], function ($) {

    var showStatus = $('.show-stock-status').val();
    var customMessage = $('.custom-status').val();
    if(showStatus == 1 && !empty(customMessage)){
        $(".stock.unavailable").text(customMessage);
    }
});
</script>
Was it helpful?

Solution

You Can change this message using jQuery text() Method. you call this line when your page load into your jQuery file.

$(".stock.unavailable").text("Your Custom Text");

OTHER TIPS

Rather than overwrite vendor/module-catalog-inventory/i18n/en_US.csv you should create your own translation file in app/design/frontend/<your_vendor_name>/<your_theme_name>/i18n/en_US.csv and add your translation to it:

"Out of stock.","This product is currently out of stock" If you don't follow this approach and overwrite Magento's core functionality directly at vendor/module-catalog-inventory/i18n/en_US.csv your changes will be lost when you next update Magento2 to avail of new features or security updates.

Also english US is the default locale on a Magento2 installation, but if you've set a different locale at Stores -> Configuration -> General you will need to change the file name from en_US.csv to match your locale, en_GB.csv for the UK for instance.

You can find more information here: http://devdocs.magento.com/guides/v2.1/frontend-dev-guide/translations/xlate.html

Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top