I am creating a custom extension for Magento 2. Currently i want to show custom div on single product page under Details tab.
How to achieve this ? can someone please give me tutorial or reference or guide me how to accomplish this in extension.
I am adding image for better clarification.
Add a comment
|
2 Answers
use below file in your custom extension or theme
vendor/magento/module-catalog/view/frontend/templates/product/view/attributes.phtml
create file in your module
vendorname/modulename/view/frontend/templates/product/view/attribute.phtml
Next create this file
vendorname/modulename/view/frontend/layout/catalog_product_view.xml
add below line of code on it.
<referenceBlock class="Magento\Catalog\Block\Product\View\Description" name="product.info.description" as="description" template="vendorname_modulename::product/view/attribute.phtml" group="detailed_info">
will be like
<?xml version="1.0"?>
<!--
/**
* Copyright © Magento, Inc. All rights reserved.
* See COPYING.txt for license details.
*/
-->
<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<css src="mage/gallery/gallery.css"/>
</head>
<body>
<referenceBlock class="Magento\Catalog\Block\Product\View\Description" name="product.info.description" as="description" template="vendorname_modulename::product/view/attribute.phtml" group="detailed_info">
</referenceBlock>
</body>
</page>
-
-
create below path in your custom module and copy pastse the core file then change it as per your req vendorname/modulename/view/frontend/templates/product/view/attributes.phtml Commented Jun 29, 2021 at 16:17
-
and layout.xml file will be under etc directory ? or no need to create layout.xml file ? Commented Jun 29, 2021 at 16:18
-
-
i did this but nothing happened ? should i remove cache and setup upgrade ? Commented Jun 29, 2021 at 16:27
USING CUSTOM THEME
Go to /app/vendor/magento/module-catalog/view/frontend/templates/product/view/
Copy the file attributes.phtml into you custom theme under the following directory
Magento_Catalog\templates\product\view
Now change the file according to your needs, here is an example :)
<?php
$_helper = $this->helper(Magento\Catalog\Helper\Output::class);
$_product = $block->getProduct();
?>
<?php if ($_additional = $block->getAdditionalData()) :?>
<div class="additional-attributes-wrapper table-wrapper">
<table class="data table additional-attributes" id="product-attribute-specs-table">
<caption class="table-caption"><?= $block->escapeHtml(__('More Information')) ?></caption>
<tbody>
<?php foreach ($_additional as $_data) :?>
<tr>
<th class="col label" scope="row"><?= $block->escapeHtml($_data['label']) ?></th>
<td class="col data" data-th="<?= $block->escapeHtmlAttr($_data['label']) ?>"><?= /* @noEscape */ $_helper->productAttribute($_product, $_data['value'], $_data['code']) ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</div>
<?php endif;?>
<?= 'HELLO WORLD' ?>
USING CUSTOM MODULE
Copy the file:
app\code\magento\vendor\magento\module-catalog\view\frontend\layout\catalog_product_view.xml
into
app\code\vendor\module\view\frontend\layout\
replace the line:
<block class="Magento\Catalog\Block\Product\View\Attributes" name="product.attributes" as="additional" template="Magento_Catalog::product/view/attributes.phtml" group="detailed_info">
with
<block class="Magento\Catalog\Block\Product\View\Attributes" name="product.attributes" as="additional" template="Vendor_Module::product/view/attributes.phtml" group="detailed_info">
Copy
/app/vendor/magento/module-catalog/view/frontend/templates/product/view/attributes.phtml
to
app\code\vendor\module\view\frontend\templates\product\view\
-
sir i am creating custom module / extension. not theme Commented Jun 29, 2021 at 16:28
-
-
<block class="Magento\Catalog\Block\Product\View\Attributes" name="product.attributes" as="additional" template="Magento_Catalog::product/view/attributes.phtml" group="detailed_info"> that block is not there in layout xml file Commented Jun 29, 2021 at 16:59
-
i think i am doing something wrong, can you please come on chat ? Commented Jun 29, 2021 at 18:09
-