menu - 更改 Gantry v4 菜单颜色

Question

我似乎无法弄清楚如何更改菜单颜色或为 Joomla 的 Gantry 4 中的菜单栏添加背景。厌倦了默认的灰色或深灰色。

我可以通过 .less 文件而不是菜单本身来更改字体和选择。

Gantry 网站上的文档过于笼统。

先感谢您。

score 1 · Accepted Answer

还要检查：menu-light.less&menu-dark.less在less\目录中。

RocketTheme 的人不建议编辑编译后的 CSS（但正如 @Adriana 所指出的那样，它工作得很好）。

score 1 · Accepted Answer

嗨，您可能注意到 joomla 的 Gantry 框架使用Less来真正了解如何更改模板上的内容，您首先必须了解 less 是如何工作的，即使 Gantry 会为您编译较少的文件。少它太棒了，所以值得。基本上，您使用代码以更经济的巧妙方式定义 css，然后将其编译成更高效的 css 文件

如果您像我们的朋友所说的那样更改已编译的文件，那根本没有意义，因为一旦您再次编译（并且您将），这些文件将被覆盖，您的所有工作都会丢失。

我会给你方向，你会发现它并不像看那么难。

1- 在模板管理器 - 样式 - 菜单样式下检查您在龙门模板上选择的菜单。

2- 在您的 less 文件夹中，您将看到每个菜单样式的 less 文件，其中包含主要变量，例如 menu-dark.less 尝试理解变量和颜色并更改它们以查看是什么。

3-在同一个文件夹中，您有 menu.less 并且使用前一个文件中的变量完成了魔术。您会看到，例如定义第一级菜单，您将拥有如下内容：

&.l1 {
    > li.active {
        background: @menuActiveBack;

这样 menuActiveBack 变量将是级别 1 的活动 li 的背景值。

4-最后一部分将是 menu-hovers.less，我认为它过于复杂，因为不需要有不同的文件来进行悬停，但它确实存在。

您可以控制 CSS 压缩、编译等待时间和调试头，以及在 Extensions → Template Manager → gantry → Advanced → Less Compiler 中使用 Clear Cache 按钮手动清除缓存。

希望它有助于开始......

快乐编码，

爱德华多

score 0 · Accepted Answer

使用 FireBug 或类似工具来查找默认 CSS 样式。

创建一个文件/templates/gantry/css/gantry-custom.css并添加您自己的 CSS 以覆盖默认 CSS。

这是一种比编辑编译或其他模板更少或 css 文件更好的方法，这些文件可以在编译期间或更新模板时被覆盖。

score 0 · Accepted Answer

我花了大约半个小时来浏览“css-compiled”文件夹中的“menu”css文件。

你可以找到所有的 css 来改变 Gantry 默认菜单的背景和颜色。我也在使用 Gantry v4。

到这里：

Joomla>模板>龙门>css-compiled>menu-675c76.....

4 回答 4