Contao：下拉导航中的Teasers

Question

我需要进行下拉列表导航，其中对于每个父导航项，在下拉区域中我显示子页面+3个图像，其标题链接到其他页面。

我需要像“自定义导航”这样的内容。模块，可选择图像（或添加自定义类，并从页面获取图像）。

我可以用这个扩展吗？如果没有，更容易/更快地更改/扩展核心模块，还是应该创建一个新模块？

谢谢！

示例（＆＃39; Kollektion＆＃39;菜单项悬停。灰色区域是子菜单容器）

Answer 1

我不知道允许将图像包含在导航菜单中的特定链接的扩展名。但是如果你愿意用CSS样式做，那么我就是这样做的：

任何页面都可以有多个自定义CSS类，它们确实适用于导航（除非导航模板已经以不再使用的方式进行了更改）。输入这些CSS类的位置位于“编辑”页面视图的底部，位于专家设置下。添加所需的任何CSS类，然后编辑样式表以使它们看起来正确。

如果这三个页面不应该是当前页面的子页面，而是引导到其他页面的子页面，则可以使用“内部重定向”页面类型。

除了常规样式之外，CSS可能是这样的：

.level_2 li {
    float: left;
    clear: left; /* this is to stack them on top of one another*/
}

.level_2 li.special_class {
    display: inline-block;
    vertical-align: top;
}

.level_2 li.special_class:before {
    display: block;
    content: '';
    width: /* the intended image width */
    height: /* the intended image height */
}

.level_2 li.special_class.foo {
    background-image: url('foo');
}

.level_2 li.special_class.bar {
    background-image: url('bar');
}

...

请记住，这不应该是一个完整的解决方案，而是一个可以建立自己的原则。您可能希望向旧浏览器（或不是）等添加向后兼容性。

Answer 2

我认为有一个扩展允许你这样做。点击此链接Navigation with images

也可能是Navigations-Bild

其中任何一个都应该给你你想要的东西，但有一点造型