У попередній статті ми показали як вивести текст "Hello World" на власній сторінці. Тепер виведіть його у новому блоці.
1. Додайте новий PHP class блоку.
Створіть файл:
app/code/<VendorName>/<ModuleName>/Block/SomeName.php
помістіть у нього код:
<?php
namespace VendorName\ModuleName\Block;
class SomeName extends \Magento\Framework\View\Element\Template
{
public function getWelcomeText()
{
return 'Hello World';
}
}
SomeName - довільна назва у форматі CamelCase (верблюжий регістр).
\Magento\Framework\View\Element\Template - клас, від якого унаслідуєте власний блок, що взаємодіє з темплейтом.
getWelcomeText - створений нами публічний метод що повертатиме текст "Hello World". Ви самі можете придумати його назву.
2. Додайте файл шаблону/темплейту (template .phtml file)
Створіть файл:
app/code/<VendorName>/<ModuleName>/view/frontend/templates/some-name.phtml
помістіть у нього код:
<h1><?php echo $block->escapeHtml($block->getWelcomeText()) ?></h1>
З міркувань безпеки пропускайте вивід тексту через escapeHtml метод. Це вбереже сайт від HTML ін'єкцій.
3. Поєднайте PHP class блоку та файл темплейту у лейаут-файлі.
Створіть файл:
app/code/<VendorName>/<ModuleName>/view/frontend/layout/<rute_id>_<controller_name>_<action_name>.xml
помістіть у нього код:
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="2columns-left" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<block class="VendorName\ModuleName\Block\SomeName" name="some.block.name" template="VendorName_ModuleName::some-name.phtml" />
</referenceContainer>
</body>
</page>
<rute_id>_<controller_name>_<action_name> - назва лейаут-файла, повинна складатися лише із нижнього регістру символів та містити id маршрутизатора, назву контролера та назву екшена.
layout - атрибут , що вказує на тип макету сторінки. Доступними зазамовчуванням є такі типи: 1column, 2columns-left, 2columns-right, 3columns, empty. Поекспериментуйте з ними - задайте різні типи лейаутів, порівняйте їх.
content - назва контейнета, у який буде поміщено блок.
Памятайте, що після зміни та збереження лейаут файлу слід очистити Layouts Cache, якщо він увімкнений. Виконайте CLI команду:
php bin/magento cache:clean layout
4. Викличте завантаження та рендиринг лейату у контролері.
Відредагуйте файл:
app/code/<VendorName>/<ModuleName>/Controller/<ControllerName>/<ActionName>.php
помістіть у метод execute наступний код:
$this->_view->loadLayout();
$this->_view->renderLayout();
Ось як це має виглядати:
<?php
namespace VendorName\ModuleName\Controller\ControllerName;
class ActionName extends \Magento\Framework\App\Action\Action
{
public function execute()
{ $this->_view->loadLayout();
$this->_view->renderLayout(); }
}
5. Відвідайте оновленну сторінку.
Перейдіть за посиланням:
http://your-magento-store.com/path/сontrollerName/actionName/
Перед вами відкриється сторінка:
У прикладах ми створюватимемо модуль Magefan_Faq для поширених запитань (FAQ - Frequently Asked Question(s)). Отримана структура модуля виглядатиме так:
├── app
│ └── code
│ └── Magefan
│ └── Faq
│ ├── Block
│ │ └──Index.php
│ │
│ ├── etc
│ │ ├──module.xml
│ │ └──frontend
│ │ └── routes.xm
│ │
│ ├── registration.php
│ ├── Controller
│ │ └── Index // controller_name
│ │ └── Index.php // action_name
│ │
│ └── view
│ └── frontend
│ ├── layout
│ │ └── magefan_faq_index_index.xml
│ └── templates
│ └── index.phtml
│
На GitHub можна переглянути змінені файли модуля Magefan_Faq.
