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. Adapter刷新数据的坑

    adapter刷新数据的时候,要能够刷新成功,要保证每次刷新的时候都是改变数据源. 于是,我这样做了,在适配器的构造方法里面写到: private List<ListBean> listI ...

  2. (详细)华为畅享7 SLA-AL00的usb调试模式在哪里打开的流程

    就在我们使用Pc链上安卓手机的时候,如果手机没有开启usb开发者调试模式,Pc则不能够成功检测到我们的手机,有时我们使用的一些功能比较好的的应用软件如之前我们使用的一个应用软件引号精灵,老版本就需要打 ...

  3. linux下编译protobuf

    这里我介绍两种方法,一是直接ccmake配置,二是修改cmake文件下面的CMakeList.txt文件 第一种方法:配置ccmake 1.安装sudo apt-get install cmake-c ...

  4. Network Policy - 每天5分钟玩转 Docker 容器技术(171)

    Network Policy 是 Kubernetes 的一种资源.Network Policy 通过 Label 选择 Pod,并指定其他 Pod 或外界如何与这些 Pod 通信. 默认情况下,所有 ...

  5. [20190402]对比_mutex_wait_scheme不同模式cpu消耗.txt

    [20190402]对比_mutex_wait_scheme不同模式cpu消耗.txt --//前几天做了sql语句在mutexes上的探究.今天对比不同_mutex_wait_scheme模式cpu ...

  6. 宋宝华:关于Ftrace的一个完整案例【转】

    Ftrace简介 Ftrace是Linux进行代码级实践分析最有效的工具之一,比如我们进行一个系统调用,出来的时间过长,我们想知道时间花哪里去了,利用Ftrace就可以追踪到一级级的时间分布. Ftr ...

  7. Scheme来实现八皇后问题(2)

    版权申明:本文为博主窗户(Colin Cai)原创,欢迎转帖.如要转贴,必须注明原文网址 http://www.cnblogs.com/Colin-Cai/p/9790466.html 作者:窗户 Q ...

  8. Git 生成SSH Key

    背景:服务器是LINUX系统(centos7),使用GitLab管理git代码库.各个客户端通过sourcetree 工具,采用SSH获取.提交代码.使用SSH的方式需要公钥和私钥.下面介绍秘钥的生成 ...

  9. Python开发【前端篇】HTML

    1.html概述和基本结构 html概述 HTML是 HyperText Mark-up Language 的首字母简写,意思是超文本标记语言,超文本指的是超链接,标记指的是标签,是一种用来制作网页的 ...

  10. Vue项目分环境打包的实现步骤

    转:https://blog.csdn.net/xinzi11243094/article/details/80521878 方法一:亲测真的有效 在项目开发中,我们的项目一般分为开发版.测试版.Pr ...