【问题标题】:Editing a child theme in Magento在 Magento 中编辑子主题
【发布时间】:2017-11-07 22:08:07
【问题描述】:

我通过将文件添加到 C:\xampp\htdocs\magento\app\design\frontend\Magento\themename 来创建了一个子主题

我有一个 theme.xml 文件、一个 registration.php 文件、web 文件夹、媒体文件夹和一个 Magento_Theme 文件夹。

我的问题如下:

这个子主题使用 C:\xampp\htdocs\magento\vendor\magento\theme-frontend-blank 结构。例如,对于我的主页,我将如何更改头文件。它有一个顶部菜单、一个搜索和一个徽标。我怎样才能重新安排这个?甚至是主页。我将如何为此进行新的布局,可能有 3/5 列的正常内容和 2/5 的最新产品内容(例如)。

任何方向都会很棒!

【问题讨论】:

    标签: php magento themes magento2


    【解决方案1】:

    更改标题

    覆盖徽标:将 vendor\magento\module-theme\view\frontend\templates\html\header.phtml 复制到 app\design\frontend\Magento\themename\Magento_Theme\templates\html\header.phtml 并根据需要进行修改。

    覆盖顶部菜单:将vendor\magento\module-theme\view\frontend\templates\html\topmenu.phtml 复制到app\design\frontend\Magento\themename\Magento_Theme\templates\html\topmenu.phtml 并根据需要进行修改。

    覆盖搜索框:有点不同。将vendor\magento\module-search\view\frontend\templates\form.mini.phtml 复制到app\design\frontend\Magento\themename\Magento_Search\templates\form.mini.phtml 并根据需要进行修改。

    参考:

    创建布局

    1. 创建文件app\design\frontend\Magento\themename\Magento_Theme\page_layout\new-layout.xml,内容如下:

      <?xml version="1.0" ?>
      <layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_layout.xsd">
          <update handle="2columns-left"/>
      </layout>
      
    2. 创建文件app\design\frontend\Magento\themename\Magento_Theme\page_layout\layouts.xml,内容如下:

      <page_layouts xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/PageLayout/etc/layouts.xsd">
          <layout id="new-layout">
              <label translate="true">My New Layout</label>
          </layout>
      </page_layouts>
      
      1. 编写CSS文件来声明宽度:

        .page-layout-new-layout .column.left {
            width: 60%;
            float: left;
            -ms-flex-order: 1;
            -webkit-order: 1;
            order: 1;
        }
        
        
        .page-layout-new-layout .column.main {
            width: 40%;
            float: right;
            -ms-flex-order: 2;
            -webkit-order: 2;
            order: 2;
        }
        
      2. 清除缓存

    参考:

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2016-03-30
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多