Magento主题结构

设计主题是Magento的应用程序的一个重要组成部分。本主题介绍了Magento的主题文件结构。

Magento的主题定位

店面主题是通常位于app/design/frontend//下

虽然在技术上它们可以存在于其他目录。例如Magento的内置主题可以在位于vendor/magento/theme-frontend-<theme_code>当Magento的实例从composer库部署。

每个主题都必须存储在一个单独的目录:

app/design/frontend/<Vendor>/

├── <theme1>

├── <theme2>/

├── <theme3>

├--...

(代码案例由magento技术麦进斗公司提供)

主题组件

Magento的主题目录的结构通常会像如下:

<theme_dir>/

├── <Vendor>_<Module>/

│ ├── web/

│ │ ├── css/

│ │ │ ├── source/

│ ├── layout/

│ │ ├── override/

│ ├── templates/

├── etc/

├── i18n/

├── media/

├── web/

│ ├── css/

│ │ ├── source/

│ ├── fonts/

│ ├── images/

│ ├── js/

├── composer.json

├── registration.php

├── theme.xml

(代码案例由magento技术麦进斗公司提供)

让我们在每一个特定的子目录一探究竟。

下面描述的目录和文件的结构是最延长之一。它可能与你的店的结构一致。

/<Vendor>_<Module> 自选 模块特定的风格,布局和模板。

/<Vendor>_<Module>/web/css/source 自选模块特定的样式(.css和/或.LESS文件)。通用样式模块都在module.less文件,样式部件都在widgets.less。

/<Vendor>_<Module>/layout 自选布局文件,这些文件扩展默认模块或父主题布局。

/<Vendor>_<Module>/layout/override/base 自选 布局覆盖默认模块布局

/<Vendor>_<Module>/layout/override/<parent_theme> 自选 布局重写该模块的父主题布局

/<Vendor>_<Module>/templates 自选 该目录包含覆盖此模块的默认模块模板或父主题模板主题模板。自定义模板也存储在这个目录中。

/etc/view.xml 如果存在于父主题需要一个主题,但可选 此文件包含所有店面产品图片和缩略图图像配置。

/i18n 自选 .csv文件的翻译。

/media 必需 该目录包含一个主题预览(你的主题截图)。

/web 自选 这可以直接从前端装入静态文件

/web/css/source 自选 该目录包含了援引从 Magento的UI库全局元素,并theme.less文件,覆盖默认的变量的值混入主题更少的配置文件。

/web/css/source/lib 自选 重写存储在UI库文件查看文件 lib/web/css/source/lib

/web/fonts 自选 主题字体

/web/images 自选 主题图片

/web/js 自选 主题js

/composer.json 描述了主题的依赖关系和一些元信息。将出现在这里,如果你的主题是一个composer包。

/registration.php 必须 需要在系统中注册的主题。

/theme.xml 必须 该文件是强制性的,因为它声明了一个主题为系统组件。它包含基本元信息,如主题名称和父主题名称,是主题是从现有的主题继承。该文件由Magento的系统能够识别的主题。

主题文件

除了配置文件和主题的元数据文件,所有主题文件分为以下两类:

1.静态视图文件

2.动态视图文件

静态视图文件

一组是由服务器返回到浏览器按原样不经任何处理的主题文件,被称为一个主题的静态文件。静态文件可以位于一个主题目录如下:

<theme_dir>/

├── media/

├── web

│ ├── css/ (except the "source" sub-directory)

│ ├── fonts/

│ ├── images/

│ ├── js/

(代码案例由magento技术麦进斗公司提供)

静态文件和其他主题文件之间的主要区别是,静态文件出现网页作为对文件的引用上,而其它主题文件参加页面生成,但网页作为文件上明确地被引用。这可以通过从店面的直接链接访问静态视图文件,是有区别的公共主题文件。

要对浏览器的公共静态文件发布到/pub/static/frontend////css/目录实际上访问。

原文地址:https://www.cnblogs.com/joserito666/p/11655764.html

时间: 2024-07-30 14:04:50

Magento主题结构的相关文章

html5学习笔记(3)--主题结构元素-1

html5学习笔记(3)--主题结构元素-1 Article元素 以下为对应代码: <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <article> <header> <h1>极客学院</h

深度剖析WordPress主题结构(转)

利用强大的技术,可以把基于wordpress的网站做成各种各样的形式,这除了要求wordpress主题开发人员精通html,PHP,JS,CSS等技术,还需要开发者掌握WordPress主题的框架. Gevin今天结合The anatomy of a WordPress theme这篇文章,和大家一起剖析WordPress主题的结构.原文作者用图文形式,分别从网站外观.页面组成和后台文件三个方面,形象的向大家展示了WordPress的架构,下面Gevin和大家一起分析WordPress是如何架构

Magento主题Petty - Lingerie Store

Petty - Lingerie Store 主题特色 Magento的兼容性: 1.9.2.x Magento的引擎: 1.9.2.4 附加功能: 切片PSD,回到Top Button,类手风琴,云变焦,评论系统,crossbrowser兼容性,自定义网页模板,放弃Down Cart,下拉选单,图标,谷歌地图,谷歌Web字体,样本含量,社会选择,工具提示,megamenu,通讯弹出,类似脸谱网的盒子 动画: HTML和JS,视差,背景视频 自举版本: 3.2.0 类视图: 网格,列表 编码:

magento目录结构精编版

1 /app – 程序根目录 2 3 /app/etc – 全局配置文件目录 4 5 /app/code – 所有模块安装其模型和控制器的目录 6 7 /app/code/core – 核心代码或经过认证得模块,如果要升级不要这里的代码 8 9 /app/code/community – 社区版的模块目录10 11 /app/code/local – 定制代码目录12 13 /app/code/core/Mage? – magento默认命名空间14 15 /app/code/core/Mage

Magento主题模块路径规则符号

Magento的应用程序组件,包括模块,主题和技术可以在Magento的根目录下任何位置的语言包.这指的是,Magento的默认和自定义组件. 下面的相对路径用于模块和主题: 主题目录 谈到定制主题,或一般的主题时,通常使用. 对于Magento的开箱前端的主题,绝对路径通常是下列之一: app/design/frontend/Magento/ vendor/magento/theme-frontend- 模块目录. 在谈到一个特定的Magento的模块,也表示法类似于使用下列内容: <Mage

Magento 2 Theme Ultimate Guide - 如何创建Magento 2主题终极指南

Magento 2 Theme Ultimate Guide - 如何创建Magento 2主题基础指南 在Magento 2中管理和设置主题的方式有很多改进.Magento 1.9中引入的theme.xml定义文件和新的回退系统的使用是两个最重要的改进.Magento 2中的后备系统与Magento 1.x的工作方式类似,但是具有额外的优势,您可以选择无限的父主题继承/后退到 全部通过主题中的theme.xml文件. 假设您想基于新的Magento“Blank”主题创建一个全新的主题.首先,您

html5新增的结构化元素

1.主题结构元素: article section time  pubdate属性  nav aside article用法:常用来表示一个独立的结构: section用法:一个东西可能会有几部分,每一个可用一个section组成: article和section的区别:article是section的特例,article更强调与其他部门的独立,section强调分段和分块. time  用法: <time pubdate datetime="2014/09/01T21:51Z"

Magento后台简单更换favicon.ico

刚才需要更换网站的favicon.ico,就是浏览器url前面的那个小图标. 网上稍微搜搜一下,然后就震惊了,号多方法是替换文件的方法,而且文件散步在网站的各个角落. 其实,后台是有直接上传更换的方法. 路径 system--Configuration--General--Design--HTML Head--Favicon Icon就可以更换了 不出现的情况下,刷新下缓存. 附 更换文件解决办法 (本博主注:以下方法试过不太好用,且麻烦,博主认为有些favicon不一定要更换,建议用上面的后台

概率主题模型简介 Introduction to Probabilistic Topic Models

此文为David M. Blei所写的<Introduction to Probabilistic Topic Models>的译文,供大家参考. 摘要:概率主题模型是一系列旨在发现隐藏在大规模文档中的主题结构的算法.本文首先回顾了这一领域的主要思想,接着调研了当前的研究水平,最后展望某些有所希望的方向.从最简单的主题模型--潜在狄立克雷分配(Latent Dirichlet Allocation,LDA)出发,讨论了其与概率建模的联系,描述了用于主题发现的两种算法.主题模型日新月异,被扩展和