第005篇 主题 - 07 文件查找【待完善】

专题摘要

通常我们需要创建文件来重写主题和模块的视图文件。为了实现这些操作，我们需要找到相关的文件。本专题主要讨论如何找到这些文件。

定位模板

Magento提供内置模板提示功能帮助我们定位响应页面的每个部分的模板来源。启用模板提示：

Stores => Setting => Configuration => Advance => Developer => Debug通过下拉选择是否开启对应的模板提示并保存。也可以通过命令行来启用和禁用模板提示：

#启用提示
php bin/magento dev:template-hints:enable

#禁用提示
php bin/magento dev:template-hints:disable

#清除缓存
php bin/magento cache:clean

在启用模板提示后，刷新页面会看到每个模块对应的文件位置，就像这样：

 当然也可以通过Url参数进行控制：templatehints=magento 

 当然，我们也可以通过在项目中根据系统生成的标题，css类名，block的标题，标签，或者超链接文本进行文本搜索，例如商品名称的css类名称为"page-title-wrapper",那么我们可以对整个项目中的.phtml进行搜索，最终我们搜索到如下结果：

vendor/magento/module-theme/view/frontend/templates/html/title.html

 但是因为我们不能直接修改这个默认文件，因此我们需要对该文件进行重写，在app/design/frontend/<Vendor>/<theme>/Magento_Theme/templates/html/title.phtml中重写该文件,

 清除缓存，刷新页面，即可看到测试文本出现在了页面上，说明我们已经对模板重写成功。更多详情查看模板定制。

布局定位

和模板类似，布局文件也是按照模块进行存储设计。可以通过查询目标元素的模板来定位布局文件所属模块。找到布局所属模块后，可在以下位置进行布局查找：

<current_theme_dir>/<Namespace>_<Module>/layout

<parent_theme(s)_dir>/<Namespace>_<Module>/layout

<module_dir>/view/frontend/layout

<module_dir>/view/base/layout

虽然没有直截了当的办法查找布局文件，但大部分模板文件命名基本一语中的的描述了该布局自身。然后查询哪些布局文件涉及了目标模板。例如：

样式定位

为了找到应用于元素的CSS规则，需先找到包含该元素的页面模板。当然也可以利用浏览器debug工具来定位应用该元素使用的CSS。找到CSS类名后，在主题和模板的目录中通过文本检索来查询定义该类的.less或.css文件。可参考一下流程来操作：

1. 主题样式<current_theme_dir>/web/css
2. 模块主题样式<current_theme_dir>/<Namespace>_<Module>/web/css
3. 父主题样式<parent_theme_dir>/web/css
4. 父主题模块样式<parent_theme_dir>/<Namespace>_<Module>/web/css
5. 前端模块样式<module_dir>/view/frontend/web/css
6. 基础模块样式<module_dir>/view/base/web/css

例如：在基于Blank主题的前端主题中查询迷你购物车的展示样式定义。app/code/Magento/Checkout/view/frontend/templates/cart/minicart.phtml模板中顶级元素包含了minicart-wrapper类。因此可通过下面的方案查找：

1. 在app/design/frontend/Magento/blank/web/css中未找到相关结果
2. 在app/design/frontend/Magento/blank/Magento_Checkout/web/css中查询发现minicart-wrapper定义在app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/_minicart.less中。

在明确类的定义文件后，我们需要对对应的文件进行定制重写。详情查看主题样式

第005篇 主题 - 07 文件查找【待完善】

原文：https://www.cnblogs.com/2019PawN/p/14627385.html