magento 2 前端学习笔记 - 来自一叶和秋
Magento 2.4主题目录结构
涉及到前端的目录基本是小写
涉及到模块组件的目录首字母都大写
app |- code | |- Vendorname | | |- Modulename | | | |- view |- design 这个目录下的前端优先级较高 ,会扩展 code 下面的前端 | |- frontend | | |- vendorname | | | |- themename | | | | |- Magento_Theme | | | | | |- layout | | | | | | |- default.xml 本主题下每个布局都会包含它[扩展2] | | | | | | |- default_head_blocks.xml 主要是加载css ,js用[扩展2] | | | | | |- page_layout | | | | | |- templates | | | | |- ModuleName | | | | | |- layout | | | | | |- templates | | | | | |- web | | | |- web | | | | |- css | | | | |- fonts | | | | |- images | | | | |- js vendor |- magento 官方面的模块名是小写字线开头,且是中杠线连接 | |- module-name | | |- view | |- module-theme 主题基础 | | |- view | | | |- adminhtml | | | |- base 这是前端的鼻祖 | | | | |- page_layout | | | | | |- empty.xml 这是布局的鼻祖 | | | | |- templates | | | | |- layouts.xml | | | |- frontend | | | | |-layout | | | | | |- default.xml 每个布局都会包含它[基础] | | | | | |- default_head_blocks.xml 主要是加载css ,js用[基础] | | | | |- page_layout | | | | |- templates | | | | |- web | | | | |- layouts.xml 定义可以用的page_layout | |- theme-frontend-blank 核的空白主题,市面上的主题99%基于这个基础上开发 | | |-Magento_Theme | | | |- layout | | | | |- default.xml 每个布局都会包含它[扩展1] | | | | |- default_head_blocks.xml 主要是加载css ,js用[扩展1] | | | |- web | | | | |- css | | | | |- js | | |- ModuleName | | | |- layout | | | |- templates | | | |- web | | |- web | | | |- css | | | |- images | | | |- js
前端 主题下的前端元素优先级,比模块下的前端元素高
若要分析效果,从当前主题->父主题 ->当前模块->父模块 去改
Layout页面结构
昨天整理一下,调整前端还是有用
蓝底是block ,白底是container
Magento 2前后端功能思维导图
更多精彩内容请参考官方文档
https://devdocs.magento.com/guides/v2.4/frontend-dev-guide/layouts/xml-instructions.html