6

如何更改 CSS 文件的顺序以在主题的 CSS 之前加载模块的 CSS？以下是一些代码示例：

在主题的local.xml中添加了主题的 CSS 文件（在所有页面上加载）：

<default>
    <reference name="head">
        <action method="addItem">
            <type>skin_css</type>
            <name>css/theme.css</name>
        </action>
    </reference>
</default>

在模块的 XML 布局文件中添加了扩展的 CSS 文件（仅在类别页面上加载）：

<catalog_category_layered>
    <reference name="head">
        <action method="addItem">
            <type>skin_css</type>
            <name>css/extension.css</name>
        </action>
    </reference>
</catalog_category_layered>

这是我在类别页面上加载的 CSS 文件的顺序，扩展的 CSS 在主题的 CSS 之后加载：

  • /default/mytheme/css/styles.css
  • /default/mytheme/css/theme.css
  • /default/mytheme/css/ extension.css

我想要实现的目标：扩展的 CSS 在主题的 CSS 之前加载。
我怎样才能强制这个 CSS 文件的顺序：

  • /default/mytheme/css/styles.css
  • /default/mytheme/css/ extension.css
  • /default/mytheme/css/theme.css

我注意到，如果我安装了许多扩展，则某些扩展的 CSS 在主题的 CSS 之前加载，而其他一些扩展的 CSS 在主题的 CSS 之后加载。我认为它与 Magento 中模块的顺序有关，但我不明白如何影响前端 CSS（或 JavaScript）文件的顺序。

4

2 回答 2

8

这里有两件事我将首先详细说明：1) 加载布局 XML 文件的顺序和 2) 处理布局句柄的顺序。

1 -布局 xml 文件按加载扩展的顺序加载。扩展是按字母顺序加载的（当服务器读取 app/etc/extensions 中的文件时），但是当存在模块依赖关系时，将首先加载另一个模块依赖的模块。Magento 实际上循环遍历所有这些 XML 文件两次以实现此目的。第一次读取所有扩展，第二次按依赖顺序加载它们/然后所有剩余的按字母顺序加载。然而， local.xml是一种特殊情况，并且总是最后加载，因此它的指令优先于任何扩展的布局指令。

现在我知道你在想什么“如果 local.xml 是最后加载的，为什么扩展的 CSS 文件会在之后加载？” 嗯，这是由于以下...

2 -处理布局句柄的顺序。在这种特殊情况下，这就是让您受益的原因。尽管 local.xml 是在扩展的布局文件之后加载的，但这是因为扩展的目标是“catalog_category_layered”布局句柄。此布局句柄在布局句柄“默认”之后处理。正因为如此，您遇到了在主题的 CSS 文件之后加载的扩展的 CSS 文件。

那么解决方案是什么？很简单，虽然有点烦人。在您的 local.xml 文件中，您只需要定位此布局句柄并首先删除您的主题的 CSS 文件，然后重新添加它。

这应该为您解决问题：

<catalog_category_layered>
    <reference name="head">
        <action method="removeItem">
            <type>skin_css</type>
            <name>css/theme.css</name>
        </action>
        <action method="addItem">
            <type>skin_css</type>
            <name>css/theme.css</name>
        </action>
    </reference>
</catalog_category_layered>

您的站点将在此布局句柄内按照扩展程序的说明处理这些说明。因此，您的 CSS 文件也会在之后加载。

于 2014-10-10T00:22:19.303 回答
0

也许这有帮助

主题优先级/优先级

于 2013-05-07T13:42:57.787 回答