3

I am using magento 2.3

I want to display product attribute on product page, I select the storefront properties tab and change the value of Visible on Catalog Pages on Storefront drop down value No to Yes. but custom product attribute is not showing.

enter image description here

please see attached screenshot. same I want to display.

4 Answers 4

10

In order to do add your custom attributes to the product detail page, you must:

  1. Set up a custom attribute in the admin,
  2. Configure your custom attribute to display on the product page,
  3. Add your custom attribute to your product's attribute set,
  4. Add content to the attribute on your product's edit page.

Note the attribute code of your custom attribute.

Once that is complete, if not already setup, you must set up a custom theme:

  1. Create theme: https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/themes/theme-create.html

  2. Once your theme is created, applied and configured, add the following folder to your custom theme:

    [theme] / Magento_Catalog / layout
    

Create the following file:

[theme] / Magento_Catalog / layout / catalog_product_view.xml

Examine the following file:

vendor/magento/module-catalog/view/frontend/layout/catalog_product_view.xml

Determine which container you would like to display your custom attribute within and note the name of the container. We will use the name of the container in order to reference the container in the catalog_product_view.xml file.

i.e. <referenceContainer name="content"> or <referenceContainer name="product.info.main"> or <referenceContainer name="add-container-name-here">

Place this code within catalog_product_view.xml, replacing {attributeCode} with your custom attribute code:

<?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="product.info.main">
            <block class="Magento\Catalog\Block\Product\View" name="product.attribute.{attributeCode}" template="Magento_Catalog::product/view/attribute.phtml">
                <arguments>
                    <argument name="at_call" xsi:type="string">get{attributeCode}</argument>
                    <argument name="at_code" xsi:type="string">{attributeCode}</argument>
                    <argument name="at_label" xsi:type="string">Any Custom Attribute Label</argument>
                    <argument name="css_class" xsi:type="string">Any CSS Class Name</argument>
                </arguments>
            </block>
        </referenceContainer>
    </body>
</page>

Flush cache & deploy static resources (you may also need to run indexer).

This will display the attribute using the default Magento 2 attribute template.


If you would like to use a custom template to display your custom attribute, use this code within the catalog_product_view.xml file:

<?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="product.info.main">
            <block class="Magento\Catalog\Block\Product\View" name="product.attribute.custom" template="Magento_Catalog::product/view/attribute/custom.phtml">
                <arguments>
                    <argument name="title" translate="true" xsi:type="string">Your Custom Attribute Title</argument>
                </arguments>
            </block>
        </referenceContainer>
    </body>
</page>

Add the following folder to your custom theme:

 [theme] / Magento_Catalog / templates / product / view / attribute

Create the following file:

[theme] / Magento_Catalog / templates / product / view / attribute / custom.phtml

Add the following code to custom.phtml, replace {attributeCode} with your custom attribute code:

<?php
$product = $block->getProduct();
$attrData = $product->getData('{attributeCode}');
$blockTitle = $this->getData('title');
if (trim($attrData) !== "") : ?>
    <div class="product-full-width-section">
        <h2 class="product-section-title"><?= $blockTitle; ?></h2>
        <?php echo $attrData; ?>
    </div>
<?php endif; ?>

Adjust the HTML code, as needed.

Flush cache & deploy static resources (you may also need to run indexer).

3
  • we should create the file attribute.phtml? Dec 29, 2021 at 4:37
  • 1
    No, within the folder: [theme] / Magento_Catalog / templates / product / view / attribute , then create the file: custom.phtml
    – Joshua34
    Dec 29, 2021 at 18:29
  • Just a quick note for me in the future (and for anyone else confused): If the attribute ID is 'custom_delivery_message', then get{attributeCode} becomes 'getCustomDeliveryMessage' and {attributeCode} becomes 'custom_delivery_message'. At least that's what worked for me.
    – Jarxberg
    Dec 19, 2023 at 9:10
0

please assign value to that attribute in product edit, so that attribute display in product edit,

if it not display than run the command

php bin/magento indexer:reindex
php bin/magento cache:flush
0

I followed the info on this page to show Manufacturer name under product title. I get no errors but nothing shows. running magento 2.4.5 with custom theme base on luma . also is there a way to link manufacturer name to either a CMS page or pass it as a search parama to display all the product of set manufacturer ?

Thanks.

-1

Try it like this:-

app/design/frontend/Vendor/theme/Magento_Catalog/templates/product/view/attr.phtml

<?php echo $this->helper('Magento\Catalog\Helper\Output')->productAttribute($block->getProduct(), $block->getProduct()->getAttributeCode(), 'attribute_code'); ?>

app/design/frontend/Vendor/theme/Magento_Catalog/layout/catalog_product_view.xml

<referenceBlock name="product.info.main">
    <block class="Magento\Catalog\Block\Product\View" name="attr" template="product/view/attr.phtml" />
</referenceBlock>

now remember you can select the container according to your requirement here <referenceBlock name="product.info.main">

hope this helps!

2
  • Hi Chikku , not working
    – gill
    Jul 22, 2020 at 13:25
  • try removing static files or else check in private window
    – Pramod
    Jul 23, 2020 at 6:27

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.