默认的magento2主题-Magento2主题开发高级实战

当前位置:　首页>> 技术小册>> Magento2主题开发高级实战

默认情况下，Magento 2有两个不同的主题：

Luma: 创建的目的是启动对Magento2的主题结构的理解。强烈建议不要将此作为制作主题。

Blank: 提供基本的主题结构，用作开发Magento 2中新主题的样板。

### Magento Luma主题 
Luma主题实现了响应式网页设计（RWD），作为主题开发中的一种良好实践，并继承了Blank主题的代码和布局。Magento 2 Blank主题位于vendor/magento/theme前端空白文件夹中，是基本的Magento主题，并被声明为Luma的父主题。这怎么可能？从逻辑上讲，Magento为每个主题都有不同的文件夹，但Magento非常聪明，可以重用代码。

马根托利用主题继承。你将在下一章中看到更多关于主题继承的内容。Luma主题是你安装Magento 2时看到的。主页基于一列结构：

![](/uploads/images/20230717/7af5fa17f4751f8b3ec051ccfaa1bcf2.png)

在前面的屏幕截图中，您可以看到Luma主题通过区分每个部分和用于内容的产品促销，以良好的设计原则工作。类别和购物车图标位于页面顶部。在底部附近，我们有热门卖家部分，其中提供了一些可用的产品。最后，页面底部提供了一些附加信息，例如About us链接。

产品页面以两列布局显示特色产品的图片：

![](/uploads/images/20230717/181a9bd85b1c59a808b49cdd33e818ae.png)

在产品页面上，您可以看到“比较产品”和“愿望清单”等选项，这是一个指向页面在商店层次结构中位置的面包屑轨迹，以及可以放大的产品照片：

![](/uploads/images/20230717/a1128b13da19ecdd4135c0d09371da0f.png)

类别页面恢复为两列布局，默认情况下以网格形式显示产品。正如许多Magento主题中常见的那样，您可以通过两种不同的方式查看产品。网格视图在网格中显示产品：

![](/uploads/images/20230717/742960a870ffd9132be9d6cf398aee28.png)

列表视图允许在产品照片和网格视图中显示的其他信息旁边显示有关产品的更多信息：

![](/uploads/images/20230717/1b43530ab37f2e6ccb4cc4990273c529.png)

Luma主题的风格基于Magento用户界面（UI）库，并使用CSS3媒体查询来处理屏幕宽度，根据访问它的设备调整布局。在下一章中，我们将了解Magento的UI是如何工作的。

### Blank主题

空白主题提供了Magento商店无错误运行所需的所有可能的文件，这样，如果其中不存在文件，则构建的新自定义主题不会导致错误。

空白主题不包含设计商店样式所需的全部CSS和图像，因为您将使用我们的自定义主题进行此操作。

### 提示
不要更改Magento vendor目录里的文件！
您不要编辑vendor/magento包中的任何文件，也不要试图在vendor目录中创建自定义主题，因为这将使完全升级magento变得困难。

确保你正在处理的任何自定义主题都在他们自己的设计包中；例如，您的主题文件应该位于`app/design/frontend/<Vendor>/`中。

该分类下的相关小册推荐：

Magento零基础到架构师(库存管理)

Laravel(10.x)从入门到精通(十九)

剑指PHP(从入门到进阶)

PHP合辑1-基础入门

Workerman高性能Web框架-Webman

PHP8入门与项目实战（5）

Laravel(10.x)从入门到精通(十六)

Yii2框架从入门到精通(上)

PHP安全之道

Laravel(10.x)从入门到精通(二)

全面构建Magento2电商系统

Laravel(10.x)从入门到精通(五)