How to Create a Module to replace the Specifications Table?

Question

I am currently learning Magento development. I have 3 Magento websites that I have built and operate using a purchased theme. Now I would like to learn more about how to do customizations properly instead of "hacking" template files.

I followed instructions online on how to create a simple module on Magento 2. The basic module is working and just outputs Hello World. Now, I would like to extend the functionality.

http://inchoo.net/magento-2/how-to-create-a-basic-module-in-magento-2/

What I would like to do is to replace the specifications table that shows on product pages. I would like to use a different template for each attribute set.

Any tips on pointing me in the right direction to build this myself? I figured building my own module would be a good way to get a deeper understanding of how everything works.

Template to override /html/vendor/magento/module-catalog/view/frontend/templates/product/view/attributes.phtml

Block Magento\Catalog\Block\Product\View\Attributes

Thank you for your time.

Answer 1

You can create a new Module to specify custom template for Attributes block as below:

Stack/Custom/registration.php

\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::MODULE,
    'Stack_Custom',
    __DIR__
);

Stack/Custom/etc/module.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
    <module name="Stack_Custom" setup_version="1.0.0" />
</config>

Stack/Custom/etc/di.xml

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
    <preference for="Magento\Catalog\Block\Product\View\Attributes" type="Stack\Custom\Block\Product\View\Attributes" />
</config>

Stack/Custom/Block/Product/View/Attributes.php

namespace Stack\Custom\Block\Product\View;

use Magento\Catalog\Model\Product;
use Magento\Framework\Phrase;
use Magento\Framework\Pricing\PriceCurrencyInterface;

/**
 * Product attributes custom block.
 */
class Attributes extends \Magento\Catalog\Block\Product\View\Attributes
{
    /**
     * @var Product
     */
    protected $_product = null;

    /**
     * Core registry
     *
     * @var \Magento\Framework\Registry
     */
    protected $_coreRegistry = null;

    /**
     * @var PriceCurrencyInterface
     */
    protected $priceCurrency;

    /**
     * @param \Magento\Framework\View\Element\Template\Context $context
     * @param \Magento\Framework\Registry $registry
     * @param PriceCurrencyInterface $priceCurrency
     * @param array $data
     */
    public function __construct(
        \Magento\Framework\View\Element\Template\Context $context,
        \Magento\Framework\Registry $registry,
        PriceCurrencyInterface $priceCurrency,
        \Magento\Eav\Api\AttributeSetRepositoryInterface $attributeSet,            
        array $data = []
    ) {
        $this->priceCurrency = $priceCurrency;
        $this->_coreRegistry = $registry;
        $this->attributeSet = $attributeSet;
        parent::__construct($context, $registry, $priceCurrency, $data);
    }

    protected function _prepareLayout()
    {
        parent::_prepareLayout();

        $product = $this->getProduct();
        $attributeSetRepository = $this->attributeSet->get($product->getAttributeSetId());
        $attributeName = $attributeSetRepository->getAttributeSetName();

        $templatePath = "";

        if($attributeName == 'Default') {
           $templatePath = "Magento_Catalog::product/view/custom_one.phtml";
        } else if($attributeName == 'Test') {
           $templatePath = "Magento_Catalog::product/view/custom_two.phtml";
        }

        if($templatePath != "") {
            $this->setTemplate($templatePath);
        }    
    }
}

Create custom template files in Magento_Catalog/templates/product/view in your theme directory.

Hope this help!!