How to customize for Hyvä theme
In order to inject the Product Labels onto the product view you will need to override the Magento_Catalog::product/view/gallery.phtml template.
Add the below code after the gallery but still within the gallery container. The container should have CSS instruction position:relative
. In Hyvä theme it can be achieved by adding the relative class to the class list of the gallery container.
<?php if ($labels = $block->getChildBlock('product.labels')): ?>
<?= $labels->toHtml(); ?>
<?php endif ?>
In most cases product listings do not require additional adjustments. The only requirenment is that the anchor tag <a>
of the product item should have position:responsive
CSS instruction as well.
If for some case in your custom theme labels are not displayed in product listings automatically it can be fixed by overriding the template file Magento_catalog::list/item.phtml
In item.phtml add the below code after the <img>
element but within the anchor <a>
tag and add the class relative to the anchor tag.
<?php if ($labels = $block->getChildBlock('labels')): ?>
<?= $labels->setProduct($product)->setViewCode('list')->toHtml(); ?>
<?php endif; ?>