Hello Magento Friends,
In today’s blog, we will learn about How to Display Tier Price at Category Page in Magento 2.
Magento 2, one of the leading e-commerce platforms, offers extensive customization options, including the ability to display tier prices directly on category pages. Tier pricing can significantly impact the purchasing decisions of customers.
Let’s find out how to display tier prices on the category page in Magento 2.
How to Display Tier Price at Category Page in Magento 2?
Override list.phtml file in your theme at the below path.
app\design\frontend\Vendor\Theme\Magento_Catalog\templates\product\list.phtml
Then add the code given below
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 |
<?php /** * Product list template * * @var $block \Magento\Catalog\Block\Product\ListProduct * @var \Magento\Framework\Escaper $escaper * @var \Magento\Framework\View\Helper\SecureHtmlRenderer $secureRenderer */ ?> <?php $_productCollection = $block->getLoadedProductCollection(); /** @var \Magento\Catalog\Helper\Output $_helper */ $_helper = $block->getData('outputHelper'); ?> <?php if (!$_productCollection->count()): ?> <div class="message info empty"> <div><?= $escaper->escapeHtml(__('We can\'t find products matching the selection.')) ?></div> </div> <?php else: ?> <?= $block->getToolbarHtml() ?> <?= $block->getAdditionalHtml() ?> <?php if ($block->getMode() === 'grid') { $viewMode = 'grid'; $imageDisplayArea = 'category_page_grid'; $showDescription = false; $templateType = \Magento\Catalog\Block\Product\ReviewRendererInterface::SHORT_VIEW; } else { $viewMode = 'list'; $imageDisplayArea = 'category_page_list'; $showDescription = true; $templateType = \Magento\Catalog\Block\Product\ReviewRendererInterface::FULL_VIEW; } /** * Position for actions regarding image size changing in vde if needed */ $pos = $block->getPositioned(); ?> <div class="products wrapper <?= /* @noEscape */ $viewMode ?> products-<?= /* @noEscape */ $viewMode ?>"> <ol class="products list items product-items"> <?php /** @var $_product \Magento\Catalog\Model\Product */ ?> <?php foreach ($_productCollection as $_product): ?> <li class="item product product-item"> <div class="product-item-info" id="product-item-info_<?= /* @noEscape */ $_product->getId() ?>" data-container="product-<?= /* @noEscape */ $viewMode ?>"> <?php $productImage = $block->getImage($_product, $imageDisplayArea); if ($pos != null) { $position = 'left:' . $productImage->getWidth() . 'px;' . 'top:' . $productImage->getHeight() . 'px;'; } ?> <?php // Product Image ?> <a href="<?= $escaper->escapeUrl($_product->getProductUrl()) ?>" class="product photo product-item-photo" tabindex="-1"> <?= $productImage->toHtml() ?> </a> <div class="product details product-item-details"> <?php $_productNameStripped = $block->stripTags($_product->getName(), null, true); ?> <strong class="product name product-item-name"> <a class="product-item-link" href="<?= $escaper->escapeUrl($_product->getProductUrl()) ?>"> <?=/* @noEscape */ $_helper->productAttribute($_product, $_product->getName(), 'name')?> </a> </strong> <?= $block->getReviewsSummaryHtml($_product, $templateType) ?> <?= /* @noEscape */ $block->getProductPrice($_product) ?> <!-- Add Tier Price Code Start --> <?php if($_product->getTierPrice()){ $tierPrice = $_product->getTierPrice(); foreach ($tierPrice as $key => $value) { $qty = (int)$value['price_qty']; $price = $value['price']; $formattedTierPrice = $this->helper('Magento\Framework\Pricing\Helper\Data')->currency(number_format($price, 2), true, false); $savePercentage = ceil(100 - ( (100 / $_product->getPrice())* $value['price']) ) ."%"; $tierprice_label = "Buy $qty for ".$formattedTierPrice." each and save ".$savePercentage."";?> <div class="tierprice_label"><?php echo $tierprice_label; ?></div> <?php }} ?> <!-- Add Tier Price Code End --> <?= $block->getProductDetailsHtml($_product) ?> <div class="product-item-inner"> <div class="product actions product-item-actions"> <div class="actions-primary"> <?php if ($_product->isSaleable()):?> <?php $postParams = $block->getAddToCartPostParams($_product); ?> <form data-role="tocart-form" data-product-sku="<?= $escaper->escapeHtml($_product->getSku()) ?>" action="<?= $escaper->escapeUrl($postParams['action']) ?>" data-mage-init='{"catalogAddToCart": {}}' method="post"> <?php $options = $block->getData('viewModel')->getOptionsData($_product); ?> <?php foreach ($options as $optionItem): ?> <input type="hidden" name="<?= $escaper->escapeHtml($optionItem['name']) ?>" value="<?= $escaper->escapeHtml($optionItem['value']) ?>"> <?php endforeach; ?> <input type="hidden" name="product" value="<?= /* @noEscape */ $postParams['data']['product'] ?>"> <input type="hidden" name="<?= /* @noEscape */ Action::PARAM_NAME_URL_ENCODED ?>" value="<?= /* @noEscape */ $postParams['data'][Action::PARAM_NAME_URL_ENCODED] ?>"> <?= $block->getBlockHtml('formkey') ?> <button type="submit" title="<?= $escaper->escapeHtmlAttr(__('Add to Cart')) ?>" class="action tocart primary" disabled> <span><?= $escaper->escapeHtml(__('Add to Cart')) ?></span> </button> </form> <?php else:?> <?php if ($_product->isAvailable()):?> <div class="stock available"> <span><?= $escaper->escapeHtml(__('In stock')) ?></span></div> <?php else:?> <div class="stock unavailable"> <span><?= $escaper->escapeHtml(__('Out of stock')) ?></span></div> <?php endif; ?> <?php endif; ?> </div> <?= ($pos && strpos($pos, $viewMode . '-primary')) ? /* @noEscape */ $secureRenderer->renderStyleAsTag( $position, 'product-item-info_' . $_product->getId() . ' div.actions-primary' ) : '' ?> <div data-role="add-to-links" class="actions-secondary"> <?php if ($addToBlock = $block->getChildBlock('addto')): ?> <?= $addToBlock->setProduct($_product)->getChildHtml() ?> <?php endif; ?> </div> <?= ($pos && strpos($pos, $viewMode . '-secondary')) ? /* @noEscape */ $secureRenderer->renderStyleAsTag( $position, 'product-item-info_' . $_product->getId() . ' div.actions-secondary' ) : '' ?> </div> <?php if ($showDescription): ?> <div class="product description product-item-description"> <?= /* @noEscape */ $_helper->productAttribute( $_product, $_product->getShortDescription(), 'short_description' ) ?> <a href="<?= $escaper->escapeUrl($_product->getProductUrl()) ?>" title="<?= /* @noEscape */ $_productNameStripped ?>" class="action more"><?= $escaper->escapeHtml(__('Learn More')) ?></a> </div> <?php endif; ?> </div> </div> </div> <?= ($pos && strpos($pos, $viewMode . '-actions')) ? /* @noEscape */ $secureRenderer->renderStyleAsTag( $position, 'product-item-info_' . $_product->getId() . ' div.product-item-actions' ) : '' ?> </li> <?php endforeach; ?> </ol> </div> <?= $block->getChildBlock('toolbar')->setIsBottom(true)->toHtml() ?> <?php // phpcs:ignore Magento2.Legacy.PhtmlTemplate ?> <?php endif; ?> |
Conclusion:
By following these simple steps, you can enhance the browsing experience for your customers by displaying tier prices directly on category pages in Magento 2. Providing transparency regarding pricing tiers can help boost sales and encourage customers to make informed purchasing decisions.
Also, learn How to Set Product Tier Price Programmatically in Magento 2.
Implementing tier pricing display is just one way to optimize your Magento 2 store for improved user experience and increased conversions. Explore further customization options and stay updated with the latest Magento 2 developments to continuously enhance your online store’s performance and meet the evolving needs of your customers.
Happy Coding!
Click to rate this post!
[Total: 0 Average: 0]
