Magento 2 建立 Widget

Widget是一個更好的工具，能夠將內容插入或編輯到CMS頁面塊或頁面中。

什麼是小部件？

小部件是Magento 2配置中的強大功能。做爲商店管理員，您能夠利用小部件來改善生動界面下的店面。小部件容許顯示靜態信息或動態內容營銷。我想說明一些Magento小部件的實現，例如：

• 動態產品數據
• 最近查看的產品的動態列表
• 促銷橫幅
• 交互式導航元素和動做塊
• 插入內容頁面的動態Flash元素

如何在Magento 2中建立小部件？

在Magento 2中建立小部件的概述

• 第1步：聲明小部件
• 第2步：建立窗口小部件模板文件
• 第3步：建立小部件Block類
• 第4步：刷新緩存和帖子

第1步：聲明小部件

自定義 HelloWorld 主題下 ：建立etc/widget.xml包含如下內容的文件

<?xml version="1.0" ?>
<widgets xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:helloworld:Magento_Widget:etc/widget.xsd">
    <widget class="Mageplaza\HelloWorld\Block\Widget\Posts" id="mageplaza_helloworld_posts">
        <label>Blog Posts</label>
        <description>Posts</description>
        <parameters>
            <parameter name="posts" sort_order="10" visible="true" xsi:type="text">
                <label>Custom Posts Label</label>
            </parameter>
        </parameters>
    </widget>
</widgets>

第2步：建立窗口小部件模板文件

自定義 HelloWorld 主題下 ：文件： view/frontend/templates/widget/posts.phtml

 

<?php if($block->getData('posts')): ?>
    <h2 class='posts'><?php echo $block->getData('posts'); ?></h2>
    <p>This is sample widget. Perform your code here.</p>
<?php endif; ?>

 

第3步：建立小部件Block類

自定義 HelloWorld 主題下 ：建立塊文件： Block/Widget/Posts.php

 

<?php 
namespace Mageplaza\HelloWorld\Block\Widget;

use Magento\Framework\View\Element\Template;
use Magento\Widget\Block\BlockInterface; 
 
class Posts extends Template implements BlockInterface {

    protected $_template = "widget/posts.phtml";

}

 

第4步：刷新緩存和帖子

• 你應該刷新Magento緩存，閱讀本教程：Flush Magento緩存
• 發佈帖子。

去 admin panel > Content > Pages > Home page > Edit

在Content選項卡中，單擊Insert Widget圖標

 

 您將看到Blog posts小部件列表

 

插入成功。