After about a week reading through the Magento 2 Docs - layout instructions, and some other stack exchange Q's and A's, I still having a hard time to figure out how to insert a custom block in to the specific location of the product page.
What I have so far,
in to the top of this page: /app/design/frontend/<Vendor>/<theme>/Magento_Catalog/templates/product/view/details.phtml
I have inserted this line of code:
echo $this->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('block_identifier')->toHtml();
In the product "Custom Lyout Update", i have inserted this XML
<referenceContainer name="block_identifier" >
<block class="Magento\Framework\View\Element\Template" name="test_file" template="Magento_Theme::html/test.phtml" />
</referenceContainer>
The only time I can see contents of my test.php file is when I change referenceContainer name to predefined blocks as "content" or "product.info".
Links that I found useful:
Magento2- Display Static Block in Phtml file & CMS page
Magento 2 - How to call a custom phtml file in another phtml file, xml layout, static block and cms page?
How to show the static blocks in Magento 2?
Magento 2 tutorial – How to use the new front-end templating system
My current temp fix
I insert test.phtml file to a specific product this way.
<referenceContainer name="main" >
<container name="product.info.desc" htmlTag="div" htmlId="product-info-desc-id" htmlClass="product-info-class" >
<block class="Magento\Framework\View\Element\Template" name="test_file" template="Magento_Theme::html/test.phtml" />
</container>
</referenceContainer>
<move element="product.info.desc" destination="content" after="product.info.media" />
Any help is greatly appreciated. Thank you.
2 Answers 2
(1) first create a new module with a custom eav for your product content (this is just the InstallData.php content):
<?php namespace <vendor>\<module_name>\Setup;
use Magento\Eav\Setup\EavSetup;
use Magento\Eav\Setup\EavSetupFactory;
use Magento\Framework\Setup\InstallDataInterface;
use Magento\Framework\Setup\ModuleContextInterface;
use Magento\Framework\Setup\ModuleDataSetupInterface;
/**
* @codeCoverageIgnore
*/
class InstallData implements InstallDataInterface
{
/**
* EAV setup factory
*
* @var EavSetupFactory
*/
private $eavSetupFactory;
/**
* Init
*
* @param EavSetupFactory $eavSetupFactory
*/
public function __construct(EavSetupFactory $eavSetupFactory)
{
$this->eavSetupFactory = $eavSetupFactory;
/* assign object to class global variable for use in other class methods */
}
/**
* {@inheritdoc}
* @SuppressWarnings(PHPMD.ExcessiveMethodLength)
*/
public function install(ModuleDataSetupInterface $setup, ModuleContextInterface $context)
{
$setup->startSetup();
/** @var EavSetup $eavSetup */
$eavSetup = $this->eavSetupFactory->create(['setup' => $setup]);
/**
* Add attributes to the eav/attribute
*/
$eavSetup->addAttribute(
\Magento\Catalog\Model\Product::ENTITY,
'my_attribute',
[
'type' => 'text',
'backend' => '',
'frontend' => '',
'label' => 'my custom content',
'input' => 'textarea',
'class' => '',
'source' => '',
'global' => 1,
'visible' => true,
'required' => false,
'user_defined' => true,
'default' => 0,
'searchable' => false,
'filterable' => false,
'comparable' => false,
'visible_on_front' => false,
'used_in_product_listing' => true,
'wysiwyg_enabled' => true, // if you want a wysiwyg editor
'unique' => false,
'apply_to' => 'simple,configurable,virtual,bundle,downloadable,grouped',
'group' => 'General'
]
);
$setup->endSetup();
}
}
(2) in the module extend catalog_product_view.xml to insert your attribute:
[I added mine as a new product tab]
<referenceBlock name="product.info.details">
<block class="Magento\Catalog\Block\Product\View\Description" name="{SOME_NAME}" template="product/view/attribute.phtml" group="detailed_info">
<arguments>
<argument name="at_call" xsi:type="string">getMyAttribute</argument>
<argument name="at_code" xsi:type="string">my_attribute</argument>
<argument name="css_class" xsi:type="string">{some class if you like}</argument>
<argument name="at_label" xsi:type="string">none</argument>
<argument name="title" translate="true" xsi:type="string">My tab label</argument>
</arguments>
</block>
</referenceBlock>
(3) now you can go to your magento admin and insert custom content (even html) into the attribute content like for every other attribute
In app\code\Namespace\Modulename\view\frontend\layout\catalog_product_view.xml add like below code. You can use your required referenceContainer
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="alert.urls">
<block class="Namespace\Modulename\Block\Catalog\Product\View\Module" name="textblock" as="textblock" after="-" template="catalog/product/view/textblock.phtml" />
</referenceContainer>
</body>
</page>
frontendor?product_id_whatever.phtml, and I need to insert it as block and position it before description/review tabs.