Hello Magento Buddies ?,
How are you all? Welcome to Magento blog stories. Today, I am here with a new article on How to Set Cart Page Items Custom Notice Message in Magento 2. Our previously published blog, How to Get Tracking Information from Shipment in Magento 2 helps to send order notifications to the customers.
Introduction
Providing customization to the customers helps for the better user experience. Also to get noticed and stand out in the competition, custom designs are enforced. By default, Magento 2 provides default messages for some functionalities. Magento provides backorder functionality and with the help of that, the customers can place orders even if the product is out of stock. At that time Magento shows one predefined message on the cart page e.g “We don’t have as many quantities as you requested, but we’ll backorder the remaining one.”
But what if you want to display your own custom message to the customers? Worry not, with the help of the below code you can Set Cart Page Items Custom Notice Message in Magento 2. So, let us do it.
Steps to Set Cart Page Items Custom Notice Message in Magento 2
Step 1: First of all, run to the following path
app\code\Vendor\Extension\view\frontend\layout\
Now, create a checkout_cart_index.xml file and add the following code.
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock class="Magento\Checkout\Block\Cart" name="checkout.cart.form">
<block class="Magento\Framework\View\Element\RendererList" name="checkout.cart.item.renderers.override" as="renderer.list.custom"/>
<arguments>
<argument name="renderer_list_name" xsi:type="string">checkout.cart.item.renderers.override</argument>
</arguments>
</referenceBlock>
</body>
</page>
Step 2: Next, go to the following path
app\code\Vendor\Extension\view\frontend\layout\
Now, create a checkout_cart_item_renderers.xml file and add the following code.
<?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>
<referenceBlock name="checkout.cart.item.renderers.override">
<block class="Magento\Checkout\Block\Cart\Item\Renderer" as="default" template="Vendor_Extension::cart/item/default.phtml" />
<block class="Magento\Checkout\Block\Cart\Item\Renderer" as="simple" template="Vendor_Extension::cart/item/default.phtml" />
</referenceBlock>
</body>
</page>
Step 3: Lastly, go to the following path
app\code\Vendor\Extension\view\frontend\templates\cart\item
And, create a default.phtml file and add the following code.
<?php
$_item = $block->getItem();
$product = $_item->getProduct();
$isVisibleProduct = $product->isVisibleInSiteVisibility();
$helper = $this->helper(Magento\Msrp\Helper\Data::class);
$canApplyMsrp = $helper->isShowBeforeOrderConfirm($product) && $helper->isMinimalPriceLessMsrp($product);
?>
<tbody class="cart item">
<tr class="item-info">
<td data-th="<?= $block->escapeHtmlAttr(__('Item')) ?>" class="col item">
<?php if ($block->hasProductUrl()) :?>
<a href="<?= $block->escapeUrl($block->getProductUrl()) ?>"
title="<?= $block->escapeHtmlAttr($block->getProductName()) ?>"
tabindex="-1"
class="product-item-photo">
<?php else :?>
<span class="product-item-photo">
<?php endif;?>
<?= $block->getImage($block->getProductForThumbnail(), 'cart_page_product_thumbnail')->toHtml() ?>
<?php if ($block->hasProductUrl()) :?>
</a>
<?php else :?>
</span>
<?php endif; ?>
<div class="product-item-details">
<strong class="product-item-name">
<?php if ($block->hasProductUrl()) :?>
<a href="<?= $block->escapeUrl($block->getProductUrl()) ?>"><?= $block->escapeHtml($block->getProductName()) ?></a>
<?php else :?>
<?= $block->escapeHtml($block->getProductName()) ?>
<?php endif; ?>
</strong>
<?php if ($_options = $block->getOptionList()) :?>
<dl class="item-options">
<?php foreach ($_options as $_option) :?>
<?php $_formatedOptionValue = $block->getFormatedOptionValue($_option) ?>
<dt><?= $block->escapeHtml($_option['label']) ?></dt>
<dd>
<?php if (isset($_formatedOptionValue['full_view'])) :?>
<?= $block->escapeHtml($_formatedOptionValue['full_view']) ?>
<?php else :?>
<?= $block->escapeHtml($_formatedOptionValue['value'], ['span', 'a']) ?>
<?php endif; ?>
</dd>
<?php endforeach; ?>
</dl>
<?php endif;?>
<?php if ($messages = $block->getMessages()) :?>
<?php foreach ($messages as $message) :?>
<div class= "cart item message <?= $block->escapeHtmlAttr($message['type']) ?>">
<div><?= $block->escapeHtml("Product Coming Soon") ?></div>
</div>
<?php endforeach; ?>
<?php endif; ?>
<?php $addInfoBlock = $block->getProductAdditionalInformationBlock(); ?>
<?php if ($addInfoBlock) :?>
<?= $addInfoBlock->setItem($_item)->toHtml() ?>
<?php endif;?>
</div>
</td>
<?php if ($canApplyMsrp) :?>
<td class="col msrp" data-th="<?= $block->escapeHtmlAttr(__('Price')) ?>">
<span class="pricing msrp">
<span class="msrp notice"><?= $block->escapeHtml(__('See price before order confirmation.')) ?></span>
<?php $helpLinkId = 'cart-msrp-help-' . $_item->getId(); ?>
<a href="#" class="action help map"
id="<?= ($block->escapeHtmlAttr($helpLinkId)) ?>"
data-mage-init='{"addToCart":{
"helpLinkId": "#<?= $block->escapeJs($block->escapeHtml($helpLinkId)) ?>",
"productName": "<?= $block->escapeJs($block->escapeHtml($product->getName())) ?>",
"showAddToCart": false
}
}'
>
<span><?= $block->escapeHtml(__("What's this?")) ?></span>
</a>
</span>
</td>
<?php else :?>
<td class="col price" data-th="<?= $block->escapeHtmlAttr(__('Price')) ?>">
<?= $block->getUnitPriceHtml($_item) ?>
</td>
<?php endif; ?>
<td class="col qty" data-th="<?= $block->escapeHtmlAttr(__('Qty')) ?>">
<div class="field qty">
<div class="control qty">
<label for="cart-<?= $block->escapeHtmlAttr($_item->getId()) ?>-qty">
<span class="label"><?= $block->escapeHtml(__('Qty')) ?></span>
<input id="cart-<?= $block->escapeHtmlAttr($_item->getId()) ?>-qty"
name="cart[<?= $block->escapeHtmlAttr($_item->getId()) ?>][qty]"
data-cart-item-id="<?= $block->escapeHtmlAttr($_item->getSku()) ?>"
value="<?= $block->escapeHtmlAttr($block->getQty()) ?>"
type="number"
size="4"
step="any"
title="<?= $block->escapeHtmlAttr(__('Qty')) ?>"
class="input-text qty"
data-validate="{required:true,'validate-greater-than-zero':true}"
data-role="cart-item-qty"/>
</label>
</div>
</div>
</td>
<td class="col subtotal" data-th="<?= $block->escapeHtmlAttr(__('Subtotal')) ?>">
<?php if ($canApplyMsrp) :?>
<span class="cart msrp subtotal">--</span>
<?php else :?>
<?= $block->getRowTotalHtml($_item) ?>
<?php endif; ?>
</td>
</tr>
<tr class="item-actions">
<td colspan="4">
<div class="actions-toolbar">
<?= /* @noEscape */ $block->getActions($_item) ?>
</div>
</td>
</tr>
</tbody>
Step 4: After the completion of the above steps, Refresh the Cache.
This is it.
Final Words
As a result, now you can Set Cart Page Items Custom Notice Message in Magento 2 and send a custom message to your store customers in order to increase their shopping experience. In case you address any issues, contact our support team. Do share it with your friends to help them boost up their store performance. I would like to hear from you about this article, so leave a comment below.
Happy Coding ?