更改布局文件是两种可能的方式在Magento定制页面布局(第二个方法是改变模板)之一。要更改页面线框,修改页面布局文件;所有其他的自定义设置页面中的配置或通用布局文件执行。
使用布局的说明:
* 移动页面元素到另一个父元素
* 添加内容
* 删除页面元素
基本指令集是所有类型的布局文件一样。本文将介绍这些基本指令;有关它们在特定布局文件类型中使用的细节,请参阅布局文件类型制品。
常见的布局说明
使用下面的布局说明自定义您的布局:
* <block>
* <container>
* before and after attributes
* <action>
* <referenceBlock> and <referenceContainer>
* <move>
* <remove>
* <update>
* <argument>
**<block>块**
定义一个block块.
详细信息:块是页输出的单位呈现一些与众不同的内容 - 一个资料片,用户界面元素 - 任何视觉实实在在为最终用户。块使用模板来生成HTML。块的例子包括类别列表中,小型车,产品标签,以及产品上市。
| 属性|描述 |值 | 必须 |
| -- | -- | -- | -- |
| class |实现特定块的渲染类的名称。这个类的一个对象负责块输出的实际呈现。 |类名class name |yes |
| name| 可用于地址,此属性分配块名称。该名称必须是每个生成的页面是唯一的。如果未指定,一个自动的名字将在格式ANONYMOUS_n被分配 |0-9,A-Z,A-Z,下划线(_),句,破折号(。)( - )。应以字母开头。区分大小写。 |no |
| before |用于块位置之前相同的父下一个元素。的元素名称或别名在值指定。使用破折号( - ),以块嵌套其级别的所有其他元素之前的位置。详见属性之前和之后。 |可能的值:元素名称或破折号( - ) |no |
| after |所使用的相同的父下一个元件之后的块的位置。的元素名称或别名在值指定。使用破折号( - ),以块嵌套其级别的所有其他元素后的位置。详见属性之前和之后。 | 可能的值:元素名称或破折号( - ) |no |
| template| 表示块的功能模板来此属性分配。 |模板文件名 |no |
| as|别名用作父元素的范围标识符。 |0-9,A-Z,A-Z,下划线(_),句,破折号(。)( - )。区分大小写。 | no|
| cacheable| 定义块元素是否可以缓存。这可以用于开发目的,使页面动态需要的元素 | 对或错 true ro false |no |
传递参数使用 <argument></argument>指令
**<container>容器**
没有持有其它布局元素,如块和容器内容的结构。
详细信息:容器渲染视图输出生成过程中的子元素。它可以是空的,或者它可以包含的任意一组<container> and <block>分子
|属性 |描述 |值 |必须 |
| -- | -- | -- | -- |
| name |可用于解决此属性分配容器的名称。该名称必须是每个生成的页面是唯一的。 |A-Z,A-Z,0-9,下划线(_),句,破折号(。)( - )。应以字母开头。区分大小写。 | yes |
| label| 一个任意的名字在Web浏览器中显示。 |任何 | no |
| before| 所使用的相同的父下一个元件之前的容器的位置。的元素名称或别名在值指定。使用破折号( - ),以块嵌套其级别的所有其他元素之前的位置。详见属性之前和之后。 | 可能的值:元素名称或破折号( - )。 |no |
| after| 所使用的相同的父下一个元件之后到容器的位置。的元素名称或别名在值指定。使用破折号( - ),以块嵌套其级别的所有其他元素后的位置。详见属性之前和之后。 |可能的值:元素名称或破折号( - )。 |no |
| as| 别名用作父元素的范围标识符。 |0-9,A-Z,A-Z,下划线(_),句,破折号(。)( - )。区分大小写。 | no |
| output|定义是否输出根元素。如果指定,则该元素将被添加到输出列表。 (如果没有指定,父元素负责渲染它的孩子。) |除了陈旧toHtml任何价值。推荐值为1。 | no |
| htmlTag| 输出参数。如果指定,输出被包裹成指定的HTML标记。 |任何有效的HTML 5标记。 | no |
| htmlId|输出参数。如果指定,则该值被添加到包装元素。如果没有包装元素,该属性没有效果。 |任何有效的HTML 5的<id>值。 |no |
|htmlClass| 输出参数。如果指定,则该值被添加到包装元素。如果没有包装元素,该属性没有效果。|何有效的HTML 5的<class>值。 | no|
布局用法示例:
~~~
...
<container name="div.sidebar.additional" htmlTag="div" htmlClass="sidebar sidebar-additional" after="div.sidebar.main">
<container name="sidebar.additional" as="sidebar_additional" label="Sidebar Additional"/>
</container>
...
~~~
这将新的列添加到页面布局。
**之前before和之后after的属性**
了帮助您在适合的设计,搜索引擎优化,可用性或其他要求特定的顺序定位元素,Magento的软件提供了before and after布局的属性。
这些可选属性可以在布局的XML文件被用于控制在其共同的父元素的顺序。下表给出的结果,你可以得到使用before and after的属性的详细说明。第一个表使用块作为定位元素。
| 属性 |值 |描述 |
| -- | -- | -- |
| before |破折号( - ) | 在其父节点中的所有其他元素之前的程序段显示。 |
| before| [元素名称] | 指定元素的之前的块显示。 |
| before | 空值或[元素名称]不存在| 使用after值。如果该值是空或不存在,以及,元素被视为非定位。|
| after| 破折号( - ) |在其父节点中的所有其他元素后的块显示。 |
| after | [元素名称] |命名的元素后的块显示。 |
| after| 空值或[元素名称]不存在| 使用before的值。如果该值是空或不存在,以及,该块被视为非定位。 |
例子
|情况 | 结果|
| -- | -- |
| before和after都存在 |after优先。 |
| before和after属性不存在或为空 |该元件被认为是不定位的。所有其他元素被定位在指定位置。缺少的元素显示在不违反为定位的元素要求的随机位置。 |
| 几个元素before或after设置有破折号( - )|元素显示在不违反为正确定位元件要求一个随机位置。 |
**<Action>动作**
该<Action>指令已被弃用。如果该方法实现允许,
使用<argument> for <block> or <referenceBlock>
访问块公共API
在block API中申明一个公共方法
详细说明:用于设置块的某种方法的块生成过程中的执行情况;<action>节点必须位于在<block>节点的范围。
例:
~~~
<block class="Magento\Module\Block\Class" name="block">
<action method="setText">
<argument name="text" translate="true" xsi:type="string">Text</argument>
</action>
<action method="setEnabled">
<argument name="enabled" xsi:type="boolean">true</argument>
</action>
</block>
~~~
<action>子节点被翻译成块的方法的参数。子节点的名称是任意的。如果有与在相同名称的两个或多个节点<action>,它们被看作一个数组
在前面的例子中,<arg1>的值作为第一个参数传递和<arg2>值作为array(“one”,“two”)通过。所有可用的方法的列表取决于块实现(例如,块的类的公共方法)。
|属性 |描述 |值 |必须 |
| -- | -- | -- | -- |
|method |块block类此标记位于该公共方法的名称块生成过程中被调用。 | block块的方法名 |yes |
传递参数 使用<argument></argument> 标签.
**<referenceBlock> and <referenceContainer>**
在更新 <referenceBlock> and <referenceContainer>被施加到相应的 <block> or <container>.
例如:如果你使用参考<referenceBlock name="right">你的目标block <block name="right"> 传递参数给block 使用<argument></argument>
|属性 |描述 |值 | 确认 |
| -- | -- | -- | --|
| remove |允许去除或取消在除去元件。当一个容器被除去,其子元素移除。 |true/false |no|
| display| 可以禁止特定块或容器的渲染与所有儿童(包括直接设置并通过引用)。块的/容器及其子各自的PHP对象仍然产生并且可用于操纵。 |true/false |no|
* remove属性是可选的,它的默认值是假的。
这种实现允许您通过设置删除属性值设置为false,取消去除布局块或容器。例: `<referenceBlock name="block.name" remove="true" />`
* display显示属性是可选的,它的默认值是true
你总是能够在您的布局来覆盖这个值。在当删除值为true的情况下,显示属性将被忽略。例:
~~~
<referenceContainer name="container.name" display="false" />
~~~
**<move>**
设置声明块或容器元素作为指定顺序的另一个元素的子元素。
例:
~~~
<move element="name.of.an.element" destination="name.of.destination.element" as="new_alias" after="name.of.element.after" before="name.of.element.before"/>
~~~
* <move>如果没有定义要移动的元件被跳过。
* 如果as没有定义为属性,则使用该元件的别名的当前值。如果这是不可能的,name属性的值来代替。
* 在布局过程中产生,<move>指令被删除之前(使用remove属性设置)进行处理。这意味着,如果任何元素被移动到预定取出元件,它们也将被移除。
|属性 |描述 |值 | 必须 |
| -- | -- | -- | -- |
| element | 移动元素的名称。 |元素名称 |yes |
| destination | 目标父元素的名称。 |元素名称 | yes|
| as | 别名,为在新的位置元素使用。|0-9,A-Z,A-Z,下划线(_),句,破折号(。)( - )。区分大小写。 | no|
| after/before | 指定元素的相对位置的兄弟姐妹。使用破折号( - ),以块前或嵌套的级别的所有其他的兄弟姐妹后的位置。如果省略该属性,该元素是所有兄弟后放置。| 元素名称|no |
**<remove>**
仅用于去除在一个页段链接的静态资源。<head>部分。对于删除块或容器, 使用<remove>属性 <referenceBlock> and <referenceContainer>
使用示例:
~~~
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<!-- Remove local resources -->
<remove src="css/styles-m.css" />
<remove src="my-js.js"/>
<remove src="Magento_Catalog::js/compare.js" />
<!-- Remove external resources -->
<remove src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css"/>
<remove src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"/>
<remove src="http://fonts.googleapis.com/css?family=Montserrat" />
</head>
~~~
**<update>**
包括一定的布局文件。使用如下:
~~~
<update handle="{name_of_handle_to_include}"/>
~~~
指定的句柄“包括”递归执行。
**<argument>**
用来传递参数
|属性 |描述 |值 |必须 |
| -- | -- | -- | -- |
| name |参数名 |独特 | yes |
| xsi:type | 参数类型。 |string/boolean/object/number/null/array | yes|
| translate| |true/false| no|
要传递多个参数使用以下结构:
~~~
<arguments>
<argument></argument>
<argument></argument>
...
</arguments>
~~~
为了传递一个参数是一个数组使用以下结构:
~~~
<argument>
<item></item>
<item></item>
...
</argument>
~~~
在布局文件中设置的参数值可以在使用模板进行访问 get{ArgumentName}() and has{ArgumentName}()方法,后者返回一个布尔值,确定是否有设置的任何值。
{ArgumentName}从name获得归因于以下方式: 获取的值 <argument name="some_string">方法名是 getSomeString()例如:在app/code/Magento/Theme/view/frontend/layout/default.xml 中布局文件设置css_class值:
布局文件:
~~~
...
<arguments>
<argument name="css_class" xsi:type="string">header links</argument>
</arguments>
...
~~~
Using the value of css_class in app/code/Magento/Theme/view/frontend/templates/html/title.phtml:
~~~
...
$cssClass = $this->getCssClass() ? ' ' . $this->getCssClass() : '';
...
~~~
- 前端开发
- 前端开发人员指南
- 介绍
- 主题模块路径规则符号
- 主题Themes
- 概括
- 创建主题
- magento主题结构
- 应用和配置管理主题
- 配置图片属性主题
- 主题继承
- 定位模板,布局和样式
- 布局layout
- 布局说明
- 布局文件类型
- 扩展继承布局
- 覆盖布局
- 公共布局任务定制
- 自定义布局图
- 模板Templates
- 模板定制演练
- 模板的基本概念
- 定制的模板插图
- 定制电子邮件模板
- 模板XSS安全
- 层叠样式表(css)
- 载入css
- magento继承修改模板.phtml
- 只修改phtml文字内容
- 在magento的block之前加内容
- PHP开发
- PHP开发人员指南
- 开发路线图
- composer简介
- 常见术语表
- 准备(开发快速启动)
- 组件类型和版本
- 有关组件文件结构
- 路线图制定和包装组件
- 建立
- composer.json文件
- 创建组件文件结构
- 定义你的配置文件
- 注册您的组件
- URN架构验证
- 命名部件
- 组件加载顺序
- 启用或禁用组件
- package包
- 打包组件
- 更新
- 验证
- 测试你的组件
- 加入CLI命令
- 命令命名指南
- 如何添加CLI命令
- 组件开发
- 服务合同
- 公共接口和API
- 服务合约设计模式
- 依赖注入
- 实例化对象与工厂
- 代理
- 代码生成
- EAV和扩展属性
- Magento的插件
- 路由
- 索引
- 配置服务网络的API
- 向后兼容性
- 消息队列
- 在开发过程中清除目录
- magento设置
- magento开发模式设置
- magento安装中文语言包
- 创建一个新的block
- magento后台操作
- 调试-页面phtml所在的目录
- magento添加分类
- 添加属性
- 属性组
- 组合商品
- 配置商品
- 虚拟商品
- 捆绑商品
- 可下载商品
- 商品促销设置
- CMS页面设置
- block使用
- connect使用
- 多店铺
- 联系我们
- paypal设置
- 物流运费
- 网站地图
- 订单处理
- 账号管理
- 网站货币设置
- google分析
- 页面默认设置
- Magento技巧积累
- 常用技巧
- magento2更改商品图片在网站中不同位置的大小
- magento的view里面的default.xml