没有合适的资源?快使用搜索试试~ 我知道了~
首页Magento 2.0开发指南:定制店面与模块开发详解
Magento 2.0中文开发手册是一份详尽的指南,针对Magento应用程序的前端开发人员,特别是那些希望创建和定制店面主题的专业人士。这份文档详细介绍了Magento 2的内容呈现过程,强调了有效构建主题所需的关键概念,如设计观点层。前端开发者可以借助这份指南来个性化店面,满足特定客户的特定需求,例如通过CSS进行颜色和界面元素的调整,以及更换图片等视觉变化。 在自定义模块的视图部分,开发者可以学习如何设计和修改Magento管理面板的界面。初级定制可能仅限于修改CSS和图片,这需要基本的PHP技能,主要涉及调整PHTML模板文件,通过复制和粘贴现有代码片段到新模板中。然而,更高级的定制如页面结构变动、布局调整或创建新功能,则需利用Magento的布局引擎,这是一种相对复杂的工具,无需过多PHP编码,但理解和使用它需要一定的技术深度。 开发新的模块是定制的第三层次,涉及到深入的PHP编程知识,这部分内容在本手册中并未详细展开,而是建议参考专门的开发人员指南获取更多信息。目前,Magento的视觉设计编辑器(VDE)作为开发代码库的一部分,允许开发者管理主题、编辑CSS和JS、调整布局以及在所见即所得模式下管理页面。然而,值得注意的是,VDE并非Magento最初版本的一部分,其未来规划将在适当的时间公布,对于VDE的相关反馈,社区可以在短期内提出,但开发团队可能不会立即响应或采取行动。 Magento 2.0中文开发手册提供了全面的前端开发指南,涵盖了从基础定制到高级模块开发的多个层次,适合各层次的开发者根据自身需求进行深入学习和实践。
资源详情
资源推荐
![](https://csdnimg.cn/release/download_crawler_static/11149840/bgd.jpg)
m aigento 2.0开发手册
<i m a ges m o d ule =" M a g ento_Catalog" >
...
<i m a ges/>
图像性能配置由元素的id 和type属性定义的每个图像类型:
<i m a ges m o d ule =" M a g ento_Catalog" >
<i m a ge id ="unique_i mage_id" type ="i mage_type" >
...
</i ma ge >
<i m a ges/>
下表详细介绍的属性:
id string 形象标识。独一无二的主题范围。
可为任意值,但外的任何─盒 Magento的主题ID是有意义的,描述图像的位置。
例如,id值对于交叉销售产品图像购物卡显示为cart_cross_sell_products。
的ID在一个.pht ml模板用于定义类型和特定的页面上显示在每个特定位置的图像的属性。
该类型由指定ID定义的图像。允许值:
image - 对应于 M a gento管理基础映像作用
s mall_image - 对应于 M a gento管理的小角色形象
swatch_i mage - 对应于M a g e nto管理斯沃琪形象的作用
swatch_thu m b - 对应于M a g e nto管理斯沃琪形象的作用。
thu m b nail - 对应于 M a gento管理缩略图作用
图像属性由相应的元件定义,例如:
<i m a ges m o d ule =" M a g ento_Catalog" >
<i m a ge id ="unique_i mage_id" type ="i mage">
< width > 100 </ width > <!-- I ma ge width in px -->
< height>100 </height> <!-- I mage height in px -- >
</i ma ge>
</i ma ges >
下表包含了可配置的所有属性的列表:
本文档使用 看云 构建
- 12 -
![](https://csdnimg.cn/release/download_crawler_static/11149840/bge.jpg)
m aigento 2.0开发手册
属性
类型 描述 需要
width
integer
Image width in pixels. O ptional
Image height in pixels.
If set to true, images that are s m aller than required by the configuration, are n
ot enlarged. Default value: true. Optional
If set to true, proportions of i mages are not chan ged even if required by the
configuration. Default value: true. Optional
If set to true, images are not cropped. Default value: true. Applied only if aspect_r
atio is set to true. Optio nal
If set to true, the transparent background of im ages is saved. If is set to fal
se, images have the white background (by default). You can set the color for the background using th
e background para m eter. Default value: true.
array The color for the images backgroun d. No t applied to i mages with transparency,
height
integer
O ptional
constrain
b oolean
aspect_ratio
b oolean
fra m e
b oolean
transparency
b oolean
O ptional
background
if transparency is set to true. Optional
调整目录图片
M a g e nto的catalog:i m ages:resize,您可以将图像尺寸调整为您的店面展示;例如:
导入产品后,可能具有可变大小的图像
如果图像大小或从缓存中手动删除
分配给产品的每个图像必须根据在模块的vie w.x ml用配置文件定义的图像的元数据的大小。调整图像大小
后,它的大小副本存储在缓存中(/pu b/ m e dia/catalog/product/cache目录)。 M a gento的从缓存中提
供店面形象
一般情况下,同时节省了产品的产品图片被缓存。不过,有时你可能需要重新创建一个使用此命令,例如
产品图片缓存,进口产品后,如果图像手动调整在缓存中,或者如果缓存被错误手动清除。
命令的用法:
ph p /bin/ ma gento catalog:i mages:resize
该命令没有参数或选项。一个进度指示器显示的同时运行该命令。
成功地调整消息产品图片显示Product i mages resized successfully,以确认命令成功。
主题继承
主题继承使您能够轻松地扩展主题和减少维护工作。您可以使用现有主题为自定义的依据,或轻微的店面
设计更新,就像节日装饰。而不是复制广泛的主题文件,并修改你想改变什么,你可以添加覆盖和扩展文
件。
主题继承的水平并不限定。
主题继承是基于回退机制,保证,如果一个视图文件不是在当前主题中发现,该系统在祖先的主题,模块
查看文件或库搜索。
fallback中的顺序是静态的资产(CSS,JavaScript的,字体和图像)等主题文件,布局和模板略有不同。
本文档使用 看云 构建
- 13 -
![](https://csdnimg.cn/release/download_crawler_static/11149840/bgf.jpg)
m aigento 2.0开发手册
本文介绍了每种类型的主题文件回退,并提供了如何重写祖先的主题和模块设计的概述。
有关开发主题组件的全面信息,请参阅本指南中的后续章节。
设置父主题
父主题的子主题the m e.x ml声明文件中指定。
例如:橙色主题由 Orange C o从 M a gento的空白主题继承。继承在
app/design/frontend/Orange C o/orange/the m e.x ml声明如下:
<the m e x mlns:xsi="http://w w w. w 3.org/2001/XM L Sche m a-instance" xsi:no Na m espaceSche m aLocatio
n ="urn: magento:fra m e w ork:Config/etc/the m e.xsd" >
<title> Oran ge </title>
< p arent> M a gento/blank </parent>
< m e dia >
< previe w_i m age > m e dia/preview.jpg </preview_im a g e >
</ m e dia >
</the m e >
父和子主题可以属于不同的供应商。例如,自定义主题可以从 M a gento的空白主题继承。
覆盖静态资产
静态资产,或静态视图文件,是风格,JavaScript,图片和字体。
要自定义父主题,模块视图,或库文件中定义的静态视图文件,您可以按照流程进一步描述回退中的相关
位置添加具有相同名称的文件覆盖它们。这也指.LESS文件,这在技术上不是静态的资产。
特定的目录中,其中在回退的过程中,系统搜索,取决于是否模块上下文是已知的文件。以下是这两个选
项的说明。
如果模块上下文没有为一个文件中定义
1.当前主题静态文件 /web/
2.祖先的静态文件,递归,直到没有父主题 /web/
3.库静态视图文件 lib/w eb/
如果模块上下文为一个文件中定义:
1.当前主题模块静态文件//web/ 例
app/design/frontend/Orange C orp/orange/M a ge nto_Catalog/ web/
2.祖先的主题模块静态文件,递归,直到有没有祖先一个主题:
//web/
3.模块的前端区域静态视图文件: /view/frontend/ we b/
4.模块为根据地的静态视图文件: /view/base/web/
例
名为 OrangeC o一个公司创建了一个名为橙色的主题。主题文件位于
app/design/frontend/Orange C o/orange_ winter。橙从 M a gento的空白主题继承。
让我们想象一下 OrangeC o需要添加一些寒假装饰。因此,创建一个新的orange_ winter主题,从橙继承。
会议的主题是位于 app/design/frontend/ Orange C o/orange_ winter
本文档使用 看云 构建
- 14 -
![](https://csdnimg.cn/release/download_crawler_static/11149840/bg10.jpg)
m aigento 2.0开发手册
在橙色的主题有位于页脚背景图片
app/design/frontend/Orange C o/orange/ we b/i ma ges/background.jpg.
Orange C o希望它有一个节日所替代,所以它把一个新的背景图像完全相同的名和扩展名中
app/design/frontend/Orange C o/orange_ winter/web/i mages/background.jpg
一旦橙色冬季主题应用,新的假日图像覆盖从橘子的人,所以对店面的节日背景是可见的。
覆盖模板
模板的备用方案如下(模块上下文总是知道他们的):
1.当前主题模板 //te m p lates
2.祖先的主题模板,递归,直到没有祖先主题达到:
//te m plates
3.模块模板/view/frontend/te m plates
所以,如果你需要定制一定的模板,你需要创建一个压倒一切的之一,在主题中的模块文件
的../te m plates/相同的名称。 是路径到原始模板
例如,如果您必须覆盖 /vie w/frontend/te m plates/category/widget/link/link_block.pht ml模板这 is
category/ widget/link/
举例默认情况下,根据模块模板 在迷你购物车的产品下面的go to Checkout 按钮
本文档使用 看云 构建
- 15 -
剩余78页未读,继续阅读
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://profile-avatar.csdnimg.cn/a4f8bc019db84f7f9461612db8d15d00_zxmqwer.jpg!1)
zxmqwer
- 粉丝: 1
- 资源: 3
上传资源 快速赚钱
我的内容管理 展开
我的资源 快来上传第一个资源
我的收益
登录查看自己的收益我的积分 登录查看自己的积分
我的C币 登录后查看C币余额
我的收藏
我的下载
下载帮助
![](https://csdnimg.cn/release/wenkucmsfe/public/img/voice.245cc511.png)
最新资源
- 贵州煤矿矿井水分类与处理策略:悬浮物、酸性与非酸性
- 醛固酮增多症肾上腺静脉采样对比:ACTH后LR-CAV的最优评估
- 开源云连接传感器监控平台:农业土壤湿度远程监测
- 母婴用品企业年度生产计划线性规划优化模型:实证与应用
- 井下智能变电站:Rogowski线圈电流检测系统的研发与性能验证
- 霍州矿区煤巷稳定性分析及支护策略
- ARM嵌入式系统远程软件更新方案:基于TFTP协议
- 煤炭选煤中汞分布规律与洗选脱汞效果
- 提升码垛机器人性能:拉格朗日动力学模型与滑模模糊控制的应用
- 增强现实技术提升学前手写教学:设计与开发案例
- 不规则工作面沉陷三角剖分算法提升与应用
- 卡尔曼滤波在瞬变电磁干扰压制中的应用研究
- 煤矿安全能力研究:理论与系统构建
- LonWorks总线技术在斜巷运输车辆定位与跑车防护中的应用
- 神东煤炭集团高效煤粉锅炉系统:节能环保新实践
- Ti/SnO2+Sb2Ox/PbO2电极分形维数与电催化性能研究
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
![](https://img-home.csdnimg.cn/images/20220527035711.png)
![](https://img-home.csdnimg.cn/images/20220527035711.png)
![](https://img-home.csdnimg.cn/images/20220527035111.png)
安全验证
文档复制为VIP权益,开通VIP直接复制
![](https://csdnimg.cn/release/wenkucmsfe/public/img/green-success.6a4acb44.png)