<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在Magento 2中，可以通过创建自定义主题来覆盖Magento 2的默认主题。以下是创建和管理主题的步骤：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在Magento 2的根目录下，创建一个名为app/design/frontend/&lt;Vendor&gt;/&lt;theme&gt;的文件夹，其中&lt;Vendor&gt;是你的公司或品牌的名称，&lt;theme&gt;是你的主题名称。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在主题文件夹中创建以下子文件夹：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">etc：包含主题配置文件。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">media：包含主题的图像文件和CSS文件。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">web：包含主题的JavaScript文件和CSS文件。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在主题文件夹中创建theme.xml文件，以指定主题名称和父主题。以下是一个示例theme.xml文件：</p><pre class="brush:as3;toolbar:false">&lt;?xml&nbsp;version=&quot;1.0&quot;?&gt; &lt;theme&nbsp;xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot;&nbsp;xsi:noNamespaceSchemaLocation=&quot;urn:magento:framework:Config/etc/theme.xsd&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;title&gt;New&nbsp;Theme&lt;/title&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;parent&gt;Magento/blank&lt;/parent&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;media&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;preview_image&gt;media/preview.jpg&lt;/preview_image&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;/media&gt; &lt;/theme&gt;</pre><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在这个示例中，主题名称为“New Theme”，父主题为“Magento/blank”，预览图像为“media/preview.jpg”。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在etc文件夹中创建view.xml文件，以指定主题的图像大小和质量。以下是一个示例view.xml文件：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">&lt;?xml&nbsp;version=&quot;1.0&quot;?&gt; &lt;view&nbsp;xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot;&nbsp;xsi:noNamespaceSchemaLocation=&quot;urn:magento:framework:Config/etc/view.xsd&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;media&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;images&nbsp;module=&quot;Magento_Catalog&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;image&nbsp;id=&quot;category_page_grid&quot;&nbsp;type=&quot;small_image&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;width&gt;240&lt;/width&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;height&gt;300&lt;/height&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/image&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;image&nbsp;id=&quot;category_page_list&quot;&nbsp;type=&quot;small_image&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;width&gt;240&lt;/width&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;height&gt;300&lt;/height&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/image&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;image&nbsp;id=&quot;product_page_main_image&quot;&nbsp;type=&quot;image&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;width&gt;700&lt;/width&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;height&gt;700&lt;/height&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/image&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/images&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;/media&gt; &lt;/view&gt;</pre><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在这个示例中，指定了三种图像类型的大小和质量：category_page_grid、category_page_list和product_page_main_image。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在web/css文件夹中创建styles.css文件，以覆盖Magento 2的默认CSS样式。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在Magento 2的后台中，转到Stores &gt; Configuration &gt; General &gt; Design，并在Design Theme字段中选择你的主题。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p3" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;PingFang SC&quot;; white-space: normal;">这些是创建和管理<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">Magento 2</span>主题的基本步骤。你可以根据你的需要添加更多的文件和样式表来自定义你的主题。</p><p><br/></p>

<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在Magento 2中，可以通过以下步骤卸载一个已安装的店面主题：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">进入Magento 2的后台管理界面，选择Content &gt; Design &gt; Configuration。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">选择你想卸载的主题所在的商店视图，并单击Edit。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在“Design Theme”字段中选择Magento 2的默认主题。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">单击Save Configuration以保存更改。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">删除主题文件夹。在Magento 2的根目录下，删除app/design/frontend/&lt;Vendor&gt;/&lt;theme&gt;文件夹，其中&lt;Vendor&gt;是你的公司或品牌的名称，&lt;theme&gt;是你的主题名称。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">清除Magento 2的缓存。可以在Magento 2的后台管理界面中选择System &gt; Cache Management，然后单击Flush Magento Cache。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">这些步骤将卸载你的Magento 2商店中的主题。请注意，如果你的主题使用自定义JavaScript和CSS文件，则必须删除这些文件，以确保完全卸载主题。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一些卸载Magento 2主题的代码示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">// 获取当前商店视图的ID</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">$storeViewId = 1; // 假设商店视图的ID为1</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">// 获取商店视图的主题配置</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">$config = $this-&gt;_objectManager-&gt;create(\Magento\Framework\App\Config\ScopeConfigInterface::class);</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">$themeId = $config-&gt;getValue(&#39;design/theme/theme_id&#39;, \Magento\Store\Model\ScopeInterface::SCOPE_STORE, $storeViewId);</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">// 如果主题是你想要卸载的主题，则设置为默认主题</p><pre class="brush:as3;toolbar:false">if&nbsp;($themeId&nbsp;==&nbsp;&#39;Vendor/Theme&#39;)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;$configWriter&nbsp;=&nbsp;$this-&gt;_objectManager-&gt;create(\Magento\Framework\App\Config\Storage\WriterInterface::class); &nbsp;&nbsp;&nbsp;&nbsp;$configWriter-&gt;save(&#39;design/theme/theme_id&#39;,&nbsp;&#39;Magento/luma&#39;,&nbsp;\Magento\Store\Model\ScopeInterface::SCOPE_STORES,&nbsp;$storeViewId); &nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;清除Magento缓存 &nbsp;&nbsp;&nbsp;&nbsp;$cacheManager&nbsp;=&nbsp;$this-&gt;_objectManager-&gt;create(\Magento\Framework\App\Cache\Manager::class); &nbsp;&nbsp;&nbsp;&nbsp;$cacheManager-&gt;clean([&#39;CONFIG&#39;]); } //&nbsp;删除主题文件夹 $themePath&nbsp;=&nbsp;BP&nbsp;.&nbsp;&#39;/app/design/frontend/Vendor/Theme&#39;; if&nbsp;(is_dir($themePath))&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;$filesystem&nbsp;=&nbsp;$this-&gt;_objectManager-&gt;create(\Magento\Framework\Filesystem::class); &nbsp;&nbsp;&nbsp;&nbsp;$filesystem-&gt;getDirectoryWrite(\Magento\Framework\App\Filesystem\DirectoryList::APP)-&gt;delete($themePath); }</pre><p class="p3" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;PingFang SC&quot;; white-space: normal;">请注意，上面的代码示例中使用了<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">_objectManager</span>，它是一个<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">Magento 2</span>中不推荐使用的方法，你应该使用依赖注入来获取所需的类实例。</p><p><br/></p>

<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在Magento 2中，可以通过以下步骤安装第三方店面主题：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">下载主题文件。通常，主题文件将作为一个ZIP文件提供。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">将主题文件上传到Magento 2的根目录。你可以使用SFTP或其他文件传输协议上传文件。如果你将文件上传到Magento 2的根目录，则可以将文件解压缩到app/design/frontend目录。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在Magento 2的后台管理界面中选择Content &gt; Design &gt; Configuration。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">选择你想要更改主题的商店视图，并单击Edit。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在“Design Theme”字段中选择你的主题。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">单击Save Configuration以保存更改。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一些安装Magento 2主题的代码示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">//&nbsp;安装主题 $themeId&nbsp;=&nbsp;&#39;Vendor/Theme&#39;;&nbsp;//&nbsp;主题ID $themeTitle&nbsp;=&nbsp;&#39;Vendor&nbsp;Theme&#39;;&nbsp;//&nbsp;主题标题 $themePath&nbsp;=&nbsp;BP&nbsp;.&nbsp;&#39;/app/design/frontend/Vendor/Theme&#39;;&nbsp;//&nbsp;主题路径 $theme&nbsp;=&nbsp;$this-&gt;_objectManager-&gt;create(\Magento\Theme\Model\Theme::class); $theme-&gt;setData([ &nbsp;&nbsp;&nbsp;&nbsp;&#39;theme_id&#39;&nbsp;=&gt;&nbsp;$themeId, &nbsp;&nbsp;&nbsp;&nbsp;&#39;title&#39;&nbsp;=&gt;&nbsp;$themeTitle, &nbsp;&nbsp;&nbsp;&nbsp;&#39;parent_id&#39;&nbsp;=&gt;&nbsp;null, &nbsp;&nbsp;&nbsp;&nbsp;&#39;is_featured&#39;&nbsp;=&gt;&nbsp;0, &nbsp;&nbsp;&nbsp;&nbsp;&#39;area&#39;&nbsp;=&gt;&nbsp;&#39;frontend&#39;, &nbsp;&nbsp;&nbsp;&nbsp;&#39;type&#39;&nbsp;=&gt;&nbsp;\Magento\Framework\View\Design\ThemeInterface::TYPE_VIRTUAL, &nbsp;&nbsp;&nbsp;&nbsp;&#39;code&#39;&nbsp;=&gt;&nbsp;$themeId, &nbsp;&nbsp;&nbsp;&nbsp;&#39;theme_path&#39;&nbsp;=&gt;&nbsp;$themePath ]); $theme-&gt;save();</pre><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">// 设置主题</p><pre class="brush:as3;toolbar:false">$storeId&nbsp;=&nbsp;1;&nbsp;//&nbsp;商店视图的ID $configWriter&nbsp;=&nbsp;$this-&gt;_objectManager-&gt;create(\Magento\Framework\App\Config\Storage\WriterInterface::class); $configWriter-&gt;save(&#39;design/theme/theme_id&#39;,&nbsp;$themeId,&nbsp;\Magento\Store\Model\ScopeInterface::SCOPE_STORES,&nbsp;$storeId);</pre><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">// 清除Magento缓存</p><pre class="brush:as3;toolbar:false">$cacheManager&nbsp;=&nbsp;$this-&gt;_objectManager-&gt;create(\Magento\Framework\App\Cache\Manager::class); $cacheManager-&gt;clean([&#39;CONFIG&#39;]);</pre><p class="p3" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;PingFang SC&quot;; white-space: normal;">请注意，上面的代码示例中使用了<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">_objectManager</span>，它是一个<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">Magento 2</span>中不推荐使用的方法，你应该使用依赖注入来获取所需的类实例。另外，如果你使用的是<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">Magento 2.3</span>或更高版本，则需要将上面的代码示例修改为使用工厂方法或依赖注入来创建所需的类实例。</p><p><br/></p>

<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Magento 2的主题开发工作流程通常包括以下步骤：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">确定主题的目标市场和受众，并设计主题的外观和功能。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">创建主题的目录结构。Magento 2的主题通常存储在app/design/frontend目录下，主题的目录结构应该类似于以下示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">app/design/frontend/Vendor/Theme/ ├──&nbsp;etc │&nbsp;&nbsp;&nbsp;├──&nbsp;module.xml │&nbsp;&nbsp;&nbsp;└──&nbsp;theme.xml ├──&nbsp;Magento_Theme │&nbsp;&nbsp;&nbsp;├──&nbsp;layout │&nbsp;&nbsp;&nbsp;├──&nbsp;templates │&nbsp;&nbsp;&nbsp;├──&nbsp;web │&nbsp;&nbsp;&nbsp;│&nbsp;&nbsp;&nbsp;├──&nbsp;css │&nbsp;&nbsp;&nbsp;│&nbsp;&nbsp;&nbsp;├──&nbsp;fonts │&nbsp;&nbsp;&nbsp;│&nbsp;&nbsp;&nbsp;├──&nbsp;images │&nbsp;&nbsp;&nbsp;│&nbsp;&nbsp;&nbsp;└──&nbsp;js │&nbsp;&nbsp;&nbsp;├──&nbsp;composer.json │&nbsp;&nbsp;&nbsp;├──&nbsp;registration.php │&nbsp;&nbsp;&nbsp;└──&nbsp;theme.xml ├──&nbsp;registration.php └──&nbsp;theme.xml</pre><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">创建主题的布局文件。Magento 2的布局文件使用XML格式编写，并定义了主题的页面结构、块和容器。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">创建主题的模板文件。Magento 2的模板文件使用.phtml文件扩展名，并定义了主题的具体内容，例如HTML标记和动态内容。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">创建主题的CSS和JavaScript文件。Magento 2的CSS和JavaScript文件应该存储在主题的web目录中，并通过XML布局文件引用。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">测试主题的外观和功能，并进行必要的调整。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一些Magento 2主题开发的代码示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在app/design/frontend/Vendor/Theme/Magento_Theme/layout目录下，可以创建一个名为default.xml的布局文件，用于定义主题的页面结构和内容：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">&lt;?xml&nbsp;version=&quot;1.0&quot;?&gt; &lt;!-- &nbsp;&nbsp;&nbsp;&nbsp;默认布局文件 &nbsp;&nbsp;&nbsp;&nbsp;app/design/frontend/Vendor/Theme/Magento_Theme/layout/default.xml --&gt; &lt;page&nbsp;xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot;&nbsp;xsi:noNamespaceSchemaLocation=&quot;urn:magento:framework:View/Layout/etc/page_configuration.xsd&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;body&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;referenceContainer&nbsp;name=&quot;header.container&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;container&nbsp;name=&quot;topbar&quot;&nbsp;htmlClass=&quot;topbar&quot;&nbsp;before=&quot;-&quot;/&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/referenceContainer&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;referenceBlock&nbsp;name=&quot;top.search&quot;&nbsp;remove=&quot;true&quot;/&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;move&nbsp;element=&quot;catalog.topnav&quot;&nbsp;destination=&quot;header-wrapper&quot;/&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;referenceContainer&nbsp;name=&quot;sidebar.main&quot;&nbsp;remove=&quot;true&quot;/&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;referenceContainer&nbsp;name=&quot;footer-container&quot;&nbsp;remove=&quot;true&quot;/&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;/body&gt; &lt;/page&gt;</pre><p><br/></p>

<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在Magento 2中，模块和主题的路径中使用了一些常规符号，这些符号的含义如下：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Vendor：代表模块或主题的厂商名称，通常由字母组成。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Module：代表模块的名称，通常由字母组成。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Theme：代表主题的名称，通常由字母组成。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">frontend：代表前端（即网站的前台），所有与前端相关的文件都应该存储在这个目录中。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">adminhtml：代表后端（即Magento的后台管理面板），所有与后端相关的文件都应该存储在这个目录中。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">etc：代表模块或主题的配置文件目录。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">view：代表模块或主题的视图文件目录。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">layout：代表布局文件目录，用于定义页面结构和内容。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">templates：代表模板文件目录，用于定义页面具体内容。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">web：代表静态文件目录，包括CSS、JavaScript、图片等。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一些Magento 2模块和主题路径的代码示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">模块路径示例：app/code/Vendor/Module</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在该目录下，可以创建registration.php文件来注册模块，并在etc/module.xml文件中定义模块的基本信息。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">主题路径示例：app/design/frontend/Vendor/Theme</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在该目录下，可以创建registration.php文件来注册主题，并在etc/theme.xml文件中定义主题的基本信息。此外，主题的布局文件应该存储在Magento_Theme/layout目录中，模板文件应该存储在Magento_Theme/templates目录中，静态文件应该存储在Magento_Theme/web目录中。</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">例如，以下是一个主题中的CSS文件路径示例：app/design/frontend/Vendor/Theme/Magento_Theme/web/css/custom.css。可以在布局文件中使用以下代码将CSS文件引入页面：</p><pre class="brush:as3;toolbar:false">&lt;head&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;css&nbsp;src=&quot;Vendor_Theme::css/custom.css&quot;/&gt; &lt;/head&gt;</pre><p><br/></p>

<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">作为前端开发人员，您需要了解以下内容才能开始在Magento 2中开发：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">HTML和CSS：了解基本的HTML和CSS语法以及如何使用它们创建页面布局和样式。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">JavaScript：了解基本的JavaScript语法以及如何使用它来创建交互性和动态效果。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Magento 2布局和模板：了解Magento 2的布局和模板文件结构以及如何使用它们来构建页面。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">LESS或SASS：了解LESS或SASS预处理器以及如何使用它们来编写更可维护和可扩展的CSS。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Grunt或Gulp：了解Grunt或Gulp构建工具以及如何使用它们来自动化任务，如压缩、合并和编译文件。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Magento 2静态资源部署：了解如何将静态资源（如CSS、JavaScript和图片）部署到Magento 2中。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一些Magento 2前端开发的代码示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">布局文件示例</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Magento 2中的布局文件使用XML格式编写，例如下面是一个显示产品价格的布局文件示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">&lt;?xml&nbsp;version=&quot;1.0&quot;?&gt; &lt;page&nbsp;xmlns:xsi=&quot;http://www.w3.org/2001/XMLSchema-instance&quot;&nbsp;xsi:noNamespaceSchemaLocation=&quot;urn:magento:framework:View/Layout/etc/page_configuration.xsd&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;body&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;referenceBlock&nbsp;name=&quot;product.info.price&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;arguments&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;argument&nbsp;name=&quot;zone&quot;&nbsp;xsi:type=&quot;string&quot;&gt;footer&lt;/argument&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/arguments&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/referenceBlock&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;/body&gt; &lt;/page&gt;</pre><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">模板文件示例</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Magento 2中的模板文件使用PHP语法编写，例如下面是一个显示产品名称和价格的模板文件示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">&lt;div&nbsp;class=&quot;product-info&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;h1&nbsp;class=&quot;product-name&quot;&gt;&lt;?php&nbsp;echo&nbsp;$block-&gt;escapeHtml($product-&gt;getName());&nbsp;?&gt;&lt;/h1&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=&quot;product-price&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;?php&nbsp;echo&nbsp;$block-&gt;getLayout()-&gt;createBlock(&#39;Magento\Catalog\Pricing\Render&#39;,&nbsp;&#39;product.price.final&#39;)-&gt;setTemplate(&#39;Magento_Catalog::product/price/final_price.phtml&#39;)-&gt;setData(&#39;price&#39;,&nbsp;$finalPrice)-&gt;toHtml();&nbsp;?&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt; &lt;/div&gt;</pre><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">LESS文件示例</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一个示例LESS文件，用于定义按钮样式：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">.btn&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;background-color:&nbsp;#0070c0; &nbsp;&nbsp;&nbsp;&nbsp;border-color:&nbsp;#0070c0; &nbsp;&nbsp;&nbsp;&nbsp;color:&nbsp;#fff; &nbsp;&nbsp;&nbsp;&nbsp;&amp;:hover, &nbsp;&nbsp;&nbsp;&nbsp;&amp;:focus&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color:&nbsp;#005193; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;border-color:&nbsp;#005193; &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;&amp;:active&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;background-color:&nbsp;#003d6b; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;border-color:&nbsp;#003d6b; &nbsp;&nbsp;&nbsp;&nbsp;} }</pre><p><br/></p>

<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是Magento 2的HTML风格指南：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">缩进：使用2个空格进行缩进，而不是制表符。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">标签嵌套：避免使用过多的嵌套，以保持代码简洁和易于阅读。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">标签属性：使用双引号而不是单引号来定义标签属性。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">标签闭合：所有标签必须正确闭合。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">ID和类名：使用小写字母和破折号来定义ID和类名，例如“my-class”和“my-id”。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">行内样式：避免使用行内样式，尽可能使用外部CSS样式表。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一些Magento 2 HTML代码示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">布局文件示例</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Magento 2的布局文件使用XML格式编写，例如下面是一个显示产品价格的布局文件示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">&lt;div&nbsp;class=&quot;product-info&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;h1&nbsp;class=&quot;product-name&quot;&gt;&lt;?php&nbsp;echo&nbsp;$block-&gt;escapeHtml($product-&gt;getName());&nbsp;?&gt;&lt;/h1&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=&quot;product-price&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;?php&nbsp;echo&nbsp;$block-&gt;getLayout()-&gt;createBlock(&#39;Magento\Catalog\Pricing\Render&#39;,&nbsp;&#39;product.price.final&#39;)-&gt;setTemplate(&#39;Magento_Catalog::product/price/final_price.phtml&#39;)-&gt;setData(&#39;price&#39;,&nbsp;$finalPrice)-&gt;toHtml();&nbsp;?&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt; &lt;/div&gt;</pre><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">模板文件示例</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">Magento 2的模板文件使用PHP语法编写，例如下面是一个显示产品名称和价格的模板文件示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">&lt;div&nbsp;class=&quot;product-info&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;h1&nbsp;class=&quot;product-name&quot;&gt;&lt;?php&nbsp;echo&nbsp;$block-&gt;escapeHtml($product-&gt;getName());&nbsp;?&gt;&lt;/h1&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;div&nbsp;class=&quot;product-price&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;?php&nbsp;echo&nbsp;$block-&gt;getLayout()-&gt;createBlock(&#39;Magento\Catalog\Pricing\Render&#39;,&nbsp;&#39;product.price.final&#39;)-&gt;setTemplate(&#39;Magento_Catalog::product/price/final_price.phtml&#39;)-&gt;setData(&#39;price&#39;,&nbsp;$finalPrice)-&gt;toHtml();&nbsp;?&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;/div&gt; &lt;/div</pre><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">&gt;<br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">HTML元素示例</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一个示例HTML元素，用于创建一个简单的表格：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">&lt;table&nbsp;class=&quot;table&quot;&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;thead&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;tr&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;th&gt;Name&lt;/th&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;th&gt;Age&lt;/th&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;th&gt;City&lt;/th&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/tr&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;/thead&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;tbody&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;tr&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;td&gt;John&nbsp;Doe&lt;/td&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;td&gt;25&lt;/td&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;td&gt;New&nbsp;York&lt;/td&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/tr&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;tr&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;td&gt;Jane&nbsp;Smith&lt;/td&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;td&gt;30&lt;/td&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;td&gt;Los&nbsp;Angeles&lt;/td&gt; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&lt;/tr&gt; &nbsp;&nbsp;&nbsp;&nbsp;&lt;/tbody&gt; &lt;/table&gt;</pre><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p><br/></p>

<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p>在 Magento 2 中，使用 LESS 作为默认的 CSS 预处理器。以下是 Magento 2 中 LESS 编码标准的一些指导：</p><ol style="border: 0px solid rgb(217, 217, 227); box-sizing: border-box; --tw-border-spacing-x:0; --tw-border-spacing-y:0; --tw-translate-x:0; --tw-translate-y:0; --tw-rotate:0; --tw-skew-x:0; --tw-skew-y:0; --tw-scale-x:1; --tw-scale-y:1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness:proximity; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width:0px; --tw-ring-offset-color:#fff; --tw-ring-color:rgba(59,130,246,0.5); --tw-ring-offset-shadow:0 0 transparent; --tw-ring-shadow:0 0 transparent; --tw-shadow:0 0 transparent; --tw-shadow-colored:0 0 transparent; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; list-style-position: initial; list-style-image: initial; margin-top: 1.25em; margin-bottom: 1.25em; padding: 0px 0px 0px 1rem; counter-reset: item 0; display: flex; flex-direction: column; color: rgb(55, 65, 81); font-family: Söhne, ui-sans-serif, system-ui, -apple-system, &quot;Segoe UI&quot;, Roboto, Ubuntu, Cantarell, &quot;Noto Sans&quot;, sans-serif, &quot;Helvetica Neue&quot;, Arial, &quot;Apple Color Emoji&quot;, &quot;Segoe UI Emoji&quot;, &quot;Segoe UI Symbol&quot;, &quot;Noto Color Emoji&quot;; white-space: pre-wrap; background-color: rgb(247, 247, 248);" class=" list-paddingleft-2"><li><p>变量名使用小写字母和下划线（_）命名法，如 $primary-color。</p></li><li><p>类名和 ID 名称应使用短横线（-）命名法，如 .block-wrapper 和 #main-content。</p></li><li><p>所有属性名称和属性值应使用小写字母，如 font-size: 14px;。</p></li><li><p>使用 rem 作为基础单位来定义字体大小、间距、宽度等，如 font-size: 1.2rem;。</p></li><li><p>在声明多个属性时，使用缩进来提高代码的可读性。</p></li><li><p>使用变量来存储颜色、字体、间距等常用值，并在需要时引用变量。</p></li><li><p>使用 Mixin 来重用常用的样式代码，如：</p></li></ol><pre>.button&nbsp;{ &nbsp;&nbsp;border-radius:&nbsp;4px; &nbsp;&nbsp;padding:&nbsp;12px&nbsp;24px; } .button-primary&nbsp;{ &nbsp;&nbsp;.button; &nbsp;&nbsp;background-color:&nbsp;$primary-color; &nbsp;&nbsp;color:&nbsp;#fff; } .button-secondary&nbsp;{ &nbsp;&nbsp;.button; &nbsp;&nbsp;background-color:&nbsp;$secondary-color; &nbsp;&nbsp;color:&nbsp;#fff; }</pre><p>在上面的示例中，.button Mixin 定义了按钮的基本样式，.button-primary 和 .button-secondary 类分别使用 .button Mixin 来定义主要按钮和次要按钮的样式。</p><p>使用媒体查询来定义响应式设计，如：</p><pre>@media&nbsp;only&nbsp;screen&nbsp;and&nbsp;(max-width:&nbsp;768px)&nbsp;{ &nbsp;&nbsp;.header&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;height:&nbsp;60px; &nbsp;&nbsp;} }</pre><p>在上面的示例中，.header 类在窗口宽度小于 768px 时会被调整为 60px 高。</p><p>以上是 Magento 2 中 LESS 编码标准的一些指导。使用这些指导，您可以编写更清晰、更易于维护的 LESS 代码。</p><p><br/></p>

<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是Magento 2中的jQuery小部件编码标准：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">将小部件包含在立即执行函数（Immediately-Invoked Function Expression，IIFE）中，以防止全局污染。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在小部件构造函数中将选项与默认值合并。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在小部件构造函数中，将所有DOM元素的引用缓存为实例属性。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在小部件构造函数中，将所有事件处理程序绑定到DOM元素上，并使用“.proxy”方法绑定到小部件实例，以确保在处理程序中正确引用实例属性和方法。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在小部件构造函数中，调用“_init”方法以初始化小部件。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在小部件构造函数中，将“options”对象传递给“_setOptions”方法，以设置小部件选项并在必要时重新渲染小部件。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在小部件构造函数中，将小部件实例存储在DOM元素上，以便稍后可以通过DOM元素访问该实例。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在小部件构造函数中，调用“_create”方法以创建小部件，并在必要时使用“_setOptions”方法设置选项。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在小部件销毁时，取消绑定所有事件处理程序，并将所有实例属性设置为null。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一个Magento 2中的jQuery小部件代码示例：</p><pre class="brush:as3;toolbar:false">(function&nbsp;($)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;$.widget(&#39;mymodule.myWidget&#39;,&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;options:&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;message:&nbsp;&#39;Hello&nbsp;World!&#39; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;_create:&nbsp;function&nbsp;()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this._render(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;_render:&nbsp;function&nbsp;()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;$element&nbsp;=&nbsp;this.element; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;message&nbsp;=&nbsp;this.options.message; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$element.html(message); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$element.addClass(&#39;my-widget&#39;); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;_setOptions:&nbsp;function&nbsp;(options)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;$.extend(this.options,&nbsp;options); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this._render(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;_init:&nbsp;function&nbsp;()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this._render(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;_destroy:&nbsp;function&nbsp;()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.element.empty(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.element.removeClass(&#39;my-widget&#39;); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.element.off(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.element.removeData(&#39;mymodule-myWidget&#39;); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;this.element&nbsp;=&nbsp;null; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;}); })(jQuery);</pre><p class="p3" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;PingFang SC&quot;; white-space: normal;">在这个示例中，我们创建了一个名为“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">myWidget</span>”的<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">jQuery</span>小部件。我们定义了选项对象，包含默认消息“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">Hello World</span>！”。我们实现了“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">_create</span>”方法，该方法调用“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">_render</span>”方法以呈现小部件。我们还实现了“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">_setOptions</span>”方法，该方法将选项与默认值合并，并在必要时重新渲染小部件。我们还实现了“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">_init</span>”方法，该方法在小部件初始化时呈现小部件。最后，我们实现了“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">_destroy</span>”方法，该方法在销毁小部件时清除所有实例属性和事件处理程序。</p><p><br/></p>

<h5 style="color:red;">系统学习magento二次开发，推荐小册：<a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank">《Magento中文全栈二次开发 》</a></h5> <div class="image-container"> <p> <a style="color:blue;" href="https://www.maxiaoke.com/manual/magento_cn_dev.html" target="_blank"> <img src="https://www.maxiaoke.com/uploads/images/20230218/bb9c82995c24d1105676e02f373755f5.jpg" alt="Magento中文全栈二次开发"> </a> </p> </div> <div class="text-container" style="font-size:14px; color:#888"> <p>本小册面向Magento2以上版本，书代码及示例兼容magento2.0-2.4版本。涵盖了magento前端开发，后端开发，magento2主题,magento2重写,magento2 layout,magento2控制器,magento2 block等相关内容,带领您成为magento开发技术专家。</p> </div> <hr><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是Magento 2中的JavaScript编码标准：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">使用单引号而不是双引号来定义字符串。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">对于变量和函数名，使用驼峰式命名法。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">使用ES6的“let”和“const”关键字声明变量，避免使用“var”。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">对于函数声明，将函数名与括号之间留一个空格，将括号与函数体之间留一个空格。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">对于if语句、for循环、while循环等，将括号与语句之间留一个空格。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">对于函数和方法调用，将括号与函数名之间留一个空格。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在箭头函数中，如果只有一个参数，则可以省略括号。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在箭头函数中，如果函数体只有一行，则可以省略花括号。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">在条件表达式中，始终使用严格相等运算符（===）而不是宽松相等运算符（==）。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">对于长函数，将函数拆分为较小的函数。</p><p class="p1" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; white-space: normal;">以下是一个Magento 2中的JavaScript代码示例：</p><p class="p2" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;Helvetica Neue&quot;; min-height: 17px; white-space: normal;"><br/></p><pre class="brush:as3;toolbar:false">let&nbsp;message&nbsp;=&nbsp;&#39;Hello&nbsp;World!&#39;; function&nbsp;showMessage()&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;console.log(message); } function&nbsp;calculateTax(price,&nbsp;taxRate)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;const&nbsp;tax&nbsp;=&nbsp;price&nbsp;*&nbsp;taxRate; &nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;tax; } if&nbsp;(message&nbsp;===&nbsp;&#39;Hello&nbsp;World!&#39;)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;showMessage(); } for&nbsp;(let&nbsp;i&nbsp;=&nbsp;0;&nbsp;i&nbsp;&lt;&nbsp;10;&nbsp;i++)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;console.log(i); } const&nbsp;numbers&nbsp;=&nbsp;[1,&nbsp;2,&nbsp;3,&nbsp;4,&nbsp;5]; numbers.forEach((number)&nbsp;=&gt;&nbsp;console.log(number)); const&nbsp;calculateTotal&nbsp;=&nbsp;(price,&nbsp;taxRate)&nbsp;=&gt;&nbsp;price&nbsp;+&nbsp;calculateTax(price,&nbsp;taxRate); console.log(calculateTotal(100,&nbsp;0.1));</pre><p class="p3" style="margin-top: 0px; margin-bottom: 0px; font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; font-size: 15px; line-height: normal; font-family: &quot;PingFang SC&quot;; white-space: normal;">在这个示例中，我们使用了<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">ES6</span>的“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">let</span>”和“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">const</span>”关键字来声明变量，使用驼峰式命名法来定义变量和函数名。我们定义了两个函数，“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">showMessage</span>”用于在控制台中显示消息，“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">calculateTax</span>”用于计算价格的税费。我们使用严格相等运算符（<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">===</span>）而不是宽松相等运算符（<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">==</span>）来比较消息是否等于“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">Hello World</span>！”。我们使用<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">for</span>循环迭代数字，并使用数组的<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">forEach</span>方法迭代数字。我们还使用箭头函数定义了一个名为“<span class="s1" style="font-variant-numeric: normal; font-variant-east-asian: normal; font-variant-alternates: normal; font-kerning: auto; font-optical-sizing: auto; font-feature-settings: normal; font-variation-settings: normal; font-stretch: normal; line-height: normal; font-family: &quot;Helvetica Neue&quot;;">calculateTotal</span>”的函数，该函数计算价格和税费的总额。</p><p><br/></p>