Magento 2 - Добавьте Статический блок CMS в форму адреса для оформления заказа
Всем добрый вечер,
Я хочу добавить статический блок CMS в форму адреса доставки заказа Magento 2. Я хотел бы отобразить блок CMS в поле номер телефона. Старый метод состоял бы в том, чтобы вставить шаблон в мою новую тему и обновить его, но в Magento 2 проверка выполняется с помощью knockoutjs, и я немного растерялся.
Любая помощь в том, какие шаблоны нокаута или XML-макет мне нужно обновить, чтобы сделать это, была бы очень полезной.
3 answers
Вам придется сделать это с помощью модуля, это невозможно сделать из темы.
Идея состоит в том, чтобы получить html-код блока CMS и поместить его в объект checkoutConfig JS. Мы делаем это, добавляя поставщика конфигурации в Magento\Checkout\Model\CompositeConfigProvider
Вот {module_dir}/etc/frontend/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">
<type name="Magento\Checkout\Model\CompositeConfigProvider">
<arguments>
<argument name="configProviders" xsi:type="array">
<item name="cms_block_provider" xsi:type="object">Vendor\Module\Model\CheckoutConfigProvider</item>
</argument>
</arguments>
</type>
<type name="Vendor\Module\Model\CheckoutConfigProvider">
<arguments>
<!--ID OF THE CMS BLOCK-->
<argument name="blockId" xsi:type="string">16</argument>
</arguments>
</type>
</config>
Это добавит нашего поставщика конфигурации, а также мы передадим идентификатор блока CMS, который вы хотите отобразить.
Теперь для поставщика конфигурации {модуль_дир}/Model/CheckoutConfigProvider.php:
<?php
namespace Vendor\Module\Model;
use Magento\Checkout\Model\ConfigProviderInterface;
use Magento\Cms\Block\Widget\Block;
class CheckoutConfigProvider implements ConfigProviderInterface
{
protected $cmsBlockWidget;
public function __construct(Block $block, $blockId)
{
$this->cmsBlockWidget = $block;
$block->setData('block_id', $blockId);
$block->setTemplate('Magento_Cms::widget/static_block/default.phtml');
}
public function getConfig()
{
return [
'cmsBlockHtml' => $this->cmsBlockWidget->toHtml()
];
}
}
Это отобразит html-код блока и сделает его доступным для javascript в window.checkoutConfig.cmsBlockHtml.
Теперь нам нужно добавить uiComponent в адресную форму. Мы делаем это в {module_dir}/view/frontend/layout/checkout_index_index.xml`
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="checkout" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="checkout.root">
<arguments>
<argument name="jsLayout" xsi:type="array">
<item name="components" xsi:type="array">
<item name="checkout" xsi:type="array">
<item name="children" xsi:type="array">
<item name="steps" xsi:type="array">
<item name="children" xsi:type="array">
<item name="shipping-step" xsi:type="array">
<item name="children" xsi:type="array">
<item name="shippingAddress" xsi:type="array">
<item name="children" xsi:type="array">
<item name="shipping-address-fieldset" xsi:type="array">
<item name="children" xsi:type="array">
<item name="cms-block" xsi:type="array">
<item name="component" xsi:type="string">uiComponent</item>
<item name="config" xsi:type="array">
<item name="template" xsi:type="string">Vendor_Module/cms-block</item>
</item>
<item name="sortOrder" xsi:type="string">125</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</item>
</argument>
</arguments>
</referenceBlock>
</body>
</page>
Наконец, нам просто нужно создать файл шаблона нокаута для этого uiComponent.
Это будет {module_dir}/view/frontend/web/template/cms-block.html:
<div data-bind="html: window.checkoutConfig.cmsBlockHtml"></div>
Вот что я сделал, чтобы отобразить блок CMS на странице оформления заказа под боковой панелью. 1. В шаблонах/onepage.phtml я создал переменную js для хранения содержимого блока cms следующим образом:
<?php $myCmsBlock = $block->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('my_cms_block')->toHtml() ?>
<script type="text/javascript">
var my_cms_block = <?php echo json_encode($myCmsBlock)?>;
</script>
2. В файле шаблона нокаута (в моем случае это было web/js/template/sidebar.html), отображал содержимое блока cms из указанной выше переменной js следующим образом:
<div class="opc-help-cms" data-bind="html:my_cms_block">
</div>
Надеюсь, это кому-то поможет! Спасибо!
Основываясь на ответе Ааронса, я поместил это в наш Модуль Mestrona_common Blocks Magento 2 на GitHub.