更改 Gantry v4 菜单颜色

Question

3

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

我可以通过 .less 文件更改字体和选项，但不能更改菜单本身。

Gantry 网站上的文档太笼统了。

提前感谢您。

- user2295585

4个回答

1

此外，请查看less\目录中的menu-light.less和menu-dark.less。RocketTheme的工作人员不建议编辑已编译的CSS（但正如@Adriana指出的那样，这很有效）。

- rdwilson713

0

我花了一段时间，大约半个小时浏览“css-compiled”文件夹中的“menu”CSS文件。

您可以找到所有用于更改Gantry默认菜单背景和颜色的CSS。我也在使用Gantry v4。

请前往此处：

Joomla>模板>gantry>css-compiled>menu-675c76.....

- Adriana Adrie Silva

0

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

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

这比编辑编译或其他模板less或css文件更好，因为它们可能会在编译期间或模板更新时被覆盖。

- Neil Robertson

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- open-ecommerce.org · Accepted Answer

嗨，Gantry框架是为Joomla设计的。你可能已经注意到它使用Less。要真正理解如何更改模板上的内容，你首先需要学习less的工作原理，即使Gantry为你编译了less文件。Less非常棒，值得学习。基本上，你可以使用代码以更聪明的方式定义CSS，这样可以更加经济高效地编译成CSS文件。

如果像我们的朋友们所说的那样更改编译后的文件，这毫无意义，因为只要再次编译（而你肯定会），这些文件就会被覆盖，所有的工作都将丢失。

我将给你指引，你会发现这并不难。

1- 检查你在Gantry模板下选择的菜单，可以在“模板管理器”-“样式”-“菜单样式”中找到。

2- 在你的less文件夹中，你将看到每个菜单样式的less文件，例如menu-dark.less，尝试理解变量和颜色，并进行更改以了解其含义。

3- 在同一文件夹中，你有menu.less，其中使用来自前一个文件的变量完成魔法。你将看到，例如定义菜单的第一级，你将拥有以下内容：

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

因此，menuActiveBack变量将成为一级菜单中活动li的背景值。

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

您可以在扩展程序→模板管理器→gantry→高级→Less编译器中控制CSS压缩、编译等待时间和调试标头，还可以手动清除缓存，使用“清除缓存”按钮。

希望这对您有所帮助....

Happy coding,

Eduardo