How to add a custom attribute to a product view in Magento 2?
https://magento.stackexchange.com/questions/297196
-
21-03-2021 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
RussianQuestion
I created the attribute with code "supplier" in my admin area,
besides, I saved the file "mycustomblock.phtml" in "/app/design/frontend/{MyThemeName}/default/etc/Magento_Catalog/templates/product/view/"
with this code:
<?php
$_product = $block->getProduct();
$label = $_product->getResource()->getAttribute('supplier')->getStoreLabel();
$value = $_product->getResource()->getAttribute('supplier')->getFrontend()->getValue($_product);
echo '<div class="divWeight"><div class="labelWeight">'.$label.':</div> <div class="valueWeight">'.$value."</div></div>";
?>
Then I edited the file "/app/design/frontend/{MyThemeName}/default/etc/Magento_Catalog/layout/catalog_product_view.xml"
like this:
<?xml version="1.0"?>
<!--
/**
* Copyright © 2015 Magento. All rights reserved.
* See COPYING.txt for license details.
*/
-->
<page layout="2columns-left" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<!-- mycustomblock -->
<referenceBlock name="product.info.main">
<block class="Magento\Catalog\Block\Product\View" name="product.info.mycustomblock" as="mycustomblock" template="product/view/mycustomblock.phtml" group="detailed_info" >
<arguments>
<argument translate="true" name="title" xsi:type="string">mycustomblock</argument>
<argument name="type" xsi:type="string">mycustomblock</argument>
</arguments>
</block>
</referenceBlock>
<!-- mycustomblock position -->
<move element="product.info.mycustomblock" destination="product.info.social" after="product.info.stock.sku"/>
<referenceContainer name="sidebar.additional">
<block class="Magento\Cms\Block\Block" name="banner.sidebar" after="-">
<arguments>
<argument name="block_id" xsi:type="string">cms-static-banner-sidebar</argument>
</arguments>
</block>
<block class="Magento\Cms\Block\Block" name="product.sidebar" after="banner.sidebar">
<arguments>
<argument name="block_id" xsi:type="string">cms-static-latest-product-sidebar</argument>
</arguments>
</block>
<block class="Magento\Cms\Block\Block" name="policy.sidebar" after="product.sidebar">
<arguments>
<argument name="block_id" xsi:type="string">cms-static-policy</argument>
</arguments>
</block>
<referenceBlock name="wishlist_sidebar" remove="true"/>
<referenceBlock name="catalog.compare.sidebar" remove="true"/>
</referenceContainer>
<move element="page.main.title" destination="product.info.main" before="-"/>
<move element="product.info.overview" destination="product.info.main"/>
<referenceContainer name="content">
<container name="product.essential" htmlTag="div" htmlClass="product-essential" before="-">
<container name="product.detail" htmlTag="div" htmlClass="row" before="-">
<container name="product.info.media" htmlTag="div" htmlClass="product-media product media" />
<container name="product.info.main" htmlTag="div" htmlClass="product-info-main product-shop" after="product.info.media">
<block class="Magento\Catalog\Block\Product\View" name="product.info.review" template="product/view/review.phtml" before="-" />
<container name="product.info.extrahint" as="extrahint" label="Product View Extra Hint">
<container name="product.info.social" label="Product social links container" htmlTag="div" htmlClass="product-social-links" before="product.info.overview">
<block class="Magento\Catalog\Block\Product\View" name="product.info.addto" as="addto" template="product/view/addto.phtml"/>
<referenceBlock name="product.info.mailto" remove="true" />
</container>
</container>
<block class="Magento\Catalog\Block\Product\View\Description" name="product.info.overview" template="product/view/attribute.phtml" group="detailed_info" before="product.price.final" after="product.info.stock.sku">
<arguments>
<argument name="at_call" xsi:type="string">getShortDescription</argument>
<argument name="at_code" xsi:type="string">short_description</argument>
<argument name="css_class" xsi:type="string">overview</argument>
<argument name="at_label" translate="true" xsi:type="string">none</argument>
<argument name="title" translate="true" xsi:type="string">Overview</argument>
<argument name="add_attribute" xsi:type="string">itemprop="description"</argument>
</arguments>
</block>
<block class="Magento\Catalog\Pricing\Render" name="product.price.final" after="product.info.overview">
<arguments>
<argument name="price_render" xsi:type="string">product.price.render.default</argument>
<argument name="price_type_code" xsi:type="string">final_price</argument>
<argument name="zone" xsi:type="string">item_view</argument>
</arguments>
</block>
<block class="Magento\Catalog\Block\Product\View" name="product.info" template="product/view/form.phtml" after="product.price.final" before="product.info.details">
<container name="product.info.form.content" as="product_info_form_content">
<block class="Magento\Catalog\Block\Product\View" name="product.info.addtocart" as="addtocart" template="product/view/addtocart.phtml"/>
</container>
<block class="Magento\Framework\View\Element\Template" name="product.info.form.options" as="options_container">
<block class="Magento\Catalog\Block\Product\View" name="product.info.options.wrapper" as="product_options_wrapper" template="product/view/options/wrapper.phtml">
<block class="Magento\Catalog\Block\Product\View\Options" name="product.info.options" as="product_options" template="product/view/options.phtml">
<block class="Magento\Catalog\Block\Product\View\Options\Type\DefaultType" as="default" template="product/view/options/type/default.phtml"/>
<block class="Magento\Catalog\Block\Product\View\Options\Type\Text" as="text" template="product/view/options/type/text.phtml"/>
<block class="Magento\Catalog\Block\Product\View\Options\Type\File" as="file" template="product/view/options/type/file.phtml"/>
<block class="Magento\Catalog\Block\Product\View\Options\Type\Select" as="select" template="product/view/options/type/select.phtml"/>
<block class="Magento\Catalog\Block\Product\View\Options\Type\Date" as="date" template="product/view/options/type/date.phtml"/>
</block>
<block class="Magento\Framework\View\Element\Html\Calendar" name="html_calendar" as="html_calendar" template="Magento_Theme::js/calendar.phtml"/>
</block>
<block class="Magento\Catalog\Block\Product\View" name="product.info.options.wrapper.bottom" as="product_options_wrapper_bottom" template="product/view/options/wrapper/bottom.phtml">
<block class="Magento\Catalog\Block\Product\View" name="product.info.addtocart.additional" as="product.info.addtocart" template="product/view/addtocart.phtml"/>
</block>
</block>
</block>
</container>
<!-- end product main info -->
</container>
</container>
<!-- end detail box -->
</referenceContainer>
</body>
</page>
Finally, I flushed, cleaned the cache and reindexed.
However, the attribute is not shown, neither the label nor the value.
Any idea?
Solution
You need to add catalog_product_view.xml file here in this path in your theme
app/design/frontend/Vendor/Theme/Magento_Catalog/layout/catalog_product_view.xml
Content for this file is ..
<?xml version="1.0"?>
<page layout="1column" 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\Catalog\Block\Product\View" name="product.info.mycustomblock" template="Magento_Catalog::product/view/mycustomblock.phtml"/>
</referenceContainer>
<move element="product.info.mycustomblock" destination="product.info.social" after="product.info.stock.sku" />
</body>
</page>
- After adding above xml file you need to create one template file here..
app/design/frontend/Vendor/Theme/Magento_Catalog/templates/product/view/mycustomblock.phtml
Content for this file is ..
<?php
$_product = $block->getProduct();
$label = $_product->getResource()->getAttribute('supplier')->getStoreLabel();
$value = $_product->getResource()->getAttribute('supplier')->getFrontend()->getValue($_product);
echo '<div class="divWeight"><div class="labelWeight">'.$label.':</div> <div class="valueWeight">'.$value."</div></div>";
?>
You can change content based on your requirement.
Hope this will help you!
Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
