首页 > 分享 > magento2 前端开发手册

magento2 前端开发手册

花匠小妙招
2025-07-04 18:14

#页面的快速布局

设置页面布局在<head>中包含静态资源（JavaScript，CSS，字体）删除<head>中的静态资源（JavaScript，CSS，字体）创建一个容器引用一个容器创建一个块设置一个块的模板修改块参数引用一个块使用块对象方法来设置块属性重新排列元素删除元素替换元素

#block的切换

<?php $blockGall = $this->getLayout()->createBlock('MGSMpanelBlockCatalogProductViewGallery');?>>//切换路径，block路径:'MGSMpanelBlockCatalogProductViewGallery'

<?php $blockGall->方法名()?>//调用发放

# 重建数据(多用于后台产品属性的新增与修改，目的为了清楚缓存文件)

在根目录下输入命令

php bin/magento indexer:reindex

php bin/magento cache:clean (如果你的站点开启了缓存)

#页面布局

相关标记

block

container

before and after

action

referenceBlock and refe

<block>

定义了一个块。

details:块是页面输出的单位，对于最终用户来说它呈现出一些独特的内容：一段信息，一个用户界面元素，任何视觉上都可以看到的东西。块使用模板来生成HTML。块的示例包括一个类别列表、一个迷你购物车、产品标记和产品清单。

属性描述值需要？ class 实现特定块的渲染的类的名称。这个类的一个对象负责块输出的实际渲染。类名需要 name 名称，可用于处理该属性分配的块。该名称必须是每个生成的页面唯一的。如果未指定，则将以格式分配自动名称ANONYMOUS_n 0-9，AZ，az，下划线（_），句点（。），短划线（ - ）。以字母开头。区分大小写。不需要 before

用于定位块

在同一父项下的元素之前。元素名称或别名在该值中指定。使用破折号（ - ）将块定位在其嵌套层次的所有其他元素之前。有关详细信息，请参阅 before and after 属性。可能的值：元素名称或破折号（ - ）不需要 after 用于将块定位在同一父元素下的元素之后。元素名称或别名在该值中指定。使用破折号（ - ）将块定位在其嵌套级别的所有其他元素之后。有关详细信息，请参阅 before and after 属性。可能的值：元素名称或破折号（ - ）不需要 template 表示此属性分配到的块的功能的模板。模板文件名称不需要 as 作为父元素范围内的标识符的别名。 0-9，AZ，az，下划线（_），句点（。），短划线（ - ）。区分大小写。不需要 cacheable 定义块元素是否可缓存。这可以用于开发目的，并使页面的所需元素动态化。 true 或者 false 不需要

<container>

一个没有内容的结构，它包含其他布局元素，例如块和容器。

details:在视图输出生成期间，容器会呈现子元素。它可以是空的，也可以包含任意一组的容器和元素

<referenceBlock>

　用于引用，更新快

<referenceContainer>

用于引用，更新容器

用于定位块

在同一父项下的元素之前。元素名称或别名在该值中指定。使用破折号（ - ）将块定位在其嵌套层次的所有其他元素之前。有关详细信息，请参阅before and after属性。可能的值：元素名称或破折号（ - ）不需要 after 用于将块定位在同一父元素下的元素之后。元素名称或别名在该值中指定。使用破折号（ - ）将块定位在其嵌套级别的所有其他元素之后。有关详细信息，请参阅before and after 属性。可能的值：元素名称或破折号（ - ）不需要 template 表示此属性分配到的块的功能的模板。模板文件名称不需要 as 作为父元素范围内的标识符的别名。 0-9，AZ，az，下划线（_），句点（。），短划线（ - ）。区分大小写。不需要 cacheable 定义块元素是否可缓存。这可以用于开发目的，并使页面的所需元素动态化。 true 或者 false 不需要

before and after attributes

为了帮助您将元素定位于适合设计、搜索引擎优化、可用性或其他需求的特定顺序，Magento软件提供了布局属性之前和之后的功能。

这些可选属性可用于布局XML文件中，以控制它们共同父元素中的元素顺序。下面的表给出了您可以使用前后属性的结果的详细描述。第一个表使用一个块a作为定位元素。

属性值描述 before 破折号（ - ）该块显示在其父节点中的所有其他元素之前。 before [element] 该块显示在指定的元素之前。 before 空值或[元素名称]不存在使用的值after。如果该值为空或不存在，则该元素被视为未定位。 after 破折号（ - ）该块显示在其父节点中的所有其他元素之后。 after [element] 该块显示在指定的元素之后。 after 空值或[元素名称]不存在使用的值before。如果该值为空或者不存在，则该块被认为是未定位的。