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步:刷新缓存和帖子

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

在Content选项卡中,单击Insert Widget图标

您将看到Blog posts小部件列表

插入成功。

Magento 2 创建 Widget的更多相关文章

  1. qt——for循环里创建widget

    在for循环里创建 widget,比如test类 不能使用 test t; 而要使用 test t = new test(): for (i=0;i<=3;i++) { QPushButton* ...

  2. 创建widget

    1. 定义方法 def predictAll(tickers, startdt='36', enddt = 'today', predictdays = 1): if enddt == 'today' ...

  3. Android开发之创建App Widget和更新Widget内容

    App WidgetsApp Widgets are miniature application views that can be embedded in other applications (s ...

  4. Magento 2.1.X 插件(Plugin)的创建

    Magento 2的插件主要作用:在Magento 1中,为了自定义不同的类和方法,你可以重写一个类. 这是一个非常强大和灵活的定制平台的方式. 这也造成了麻烦,因为两个模块不可以重写同一个类, 重写 ...

  5. Android简易实战教程--第十四话《模仿金山助手创建桌面Widget小部件》

    打开谷歌api,对widget小部件做如下说明: App Widgets are miniature application views that can be embedded in otherap ...

  6. 高级Magento模型 EAV

    我们讲过Magento有两种模型,简单模型和EAV(Entity Attribute Value)模型.上一章我们讲过所有的Magento模型都是继承自Mage_Core_Model_Abstract ...

  7. 深入理解Magento - 第六章 - 高级Magento模型

    我们讲过Magento有两种模型,简单模型和EAV(Entity Attribute Value)模型.上一章我们讲过所有的Magento模型都是继承自Mage_Core_Model_Abstract ...

  8. yii2——自定义widget

    参考资料:http://www.bsourcecode.com/yiiframework2/how-to-create-custom-widget-in-yii2-0-framework/   如何使 ...

  9. Jquery ui widget开发

    Jquery ui 提供了一些基本的widget,但是他提供了很好的机制来创建widget.在jquery css framework中包含了基本的css样式(视觉和感觉诸如颜色,字体大小,图标等), ...

随机推荐

  1. arcgis api 3.x for js 共享干货系列之二自定义 Navigation 控件样式风格(附源码下载)

    0.内容概览 自定义 Navigation 控件样式风格 源码下载 1.内容讲解 arcgis api 3.x for js 默认的Navigation控件样式风格如下图:这样的风格不能说不好,各有各 ...

  2. 德国慕尼黑.NET俱乐部VS2019发布活动

    就在广州.NET俱乐部紧锣密鼓的准备配合VS2019发布搞一场大Party的时候,德国慕尼黑.NET俱乐部早就已经对外宣布他们将会配合VS2019发布搞两场活动,注意,是两场哦,不是一场哦. 第一场是 ...

  3. 查看系统cpu性能top和多核cpu使用性能

    1.使用top查看系统当前负载情况. 在显示过程 按P会按照cpu使用率排序,按M会按照内存占用率排序. 2.多核CPU上,每个核的使用率,使用 mpstat mpstat -P ALL 1 10 - ...

  4. 解决jest处理es模块

    解决jest处理es模块 问题场景 项目使用jest进行测试时, 当引入外部库是es模块时, jest无法处理导致报错. Test suite failed to run Jest encounter ...

  5. .net 支付宝接口小小误区

    1.该密匙目测不是私钥,应用官方文档生成的长私钥. 2. 此公钥用的是应用公钥 3.设置支付完成后的通知页面和回调页面 其他的按照官方文档的demo来实现即可

  6. SQLServer之创建表值函数

    表值函数创建注意事项 用户定义表值函数返回 table 数据类型. 对于内联表值函数,没有函数主体,表是单个 SELECT 语句的结果集. 表值函数主要用于数据计算出来返回结果集. 使用SSMS数据库 ...

  7. swift修改UITextfield的Placeholder字体大小和颜色

    第一种方法: self.userNumber.setValue(UIColor.lightGray, forKey: "_placeholderLabel.textColor") ...

  8. chrome总是提示“请停用开发者模式运行的扩展程序”

    方法1:通过组策略的扩展白名单.要下载一个组策略管理模板 1.开始 -> 运行 -> 输入gpedit.msc -> 回车确定打开计算机本地组策略编辑器(通过Win + R快捷键可以 ...

  9. HBase实践案例:车联网监控系统

    项目背景 本项目为车联网监控系统,系统由车载硬件设备.云服务端构成.车载硬件设备会定时采集车辆的各种状态信息,并通过移动网络上传到服务器端.服务器端接收到硬件设备发送的数据首先需要将数据进行解析,校验 ...

  10. nginx日志切割(logrotate或shell脚本)

    nginx自己不会对日志文件进行切割,可以通过两种不同的方式进行,分别是:通过logrotate和通过shell脚本. 如果是yum方式安装的nginx,系统默认会自动通过logrotate这个日志管 ...