问题
我正在 Liferay 主题中实现一个 css 组件库,将 css 添加到 custom.css 文件中。我在实现导航更改时遇到了一个问题,该导航当前使用标签库 liferay-ui:navigation
来生成导航并设置导航样式(使用 init.jsp
和page.jsp
在导航标签库中)。 taglib 在自定义导航 Hook 中被调用为:
<liferay-ui:navigation
bulletStyle="<%= bulletStyle %>"
displayStyle="<%= displayStyle %>"
...etc
/>
这会生成以下 html:
<div class="nav-menu nav-menu-style-dots" id="aui_3_4_0_1_406">
<ul class="layouts level-1" id="aui_3_4_0_1_405">
...list items
</ul>
</div>
标签库 page.jsp
中的相关行是:
<div class="nav-menu nav-menu-style-<%= bulletStyle %>">
和
sb.append("<ul class=\"layouts level-");
组件库不使用 Liferay 生成的类名,并且该库在多个应用程序中使用,并非全部内置在 Liferay 中。
选项
为了解决这个问题,我认为我有两个选择:
- 更改组件库中的 css 类以匹配 Liferay 生成的类。我不喜欢这个选项,因为这意味着不同的应用程序中会有不同的 css 类,每个类都做同样的事情。此外,它还消除了拥有组件库的好处。
- 找到一些覆盖标签库的方法,例如creating a custom hook或修改我现有的导航 Hook 。我更喜欢此选项,因为它使组件库保持完整并且更易于维护。
问题
是否可以使用钩子(Hook)或其他方法(可能是 alloy-ui)覆盖 liferay-ui 导航标签库以覆盖 page.jsp
中的上述行?
最佳答案
是的,可以用 jsp-hook 覆盖 taglib 实现(我刚刚用我的 custom navigation 应用程序的出色更新测试了它,正是你提到的 jsp)。但是,如果你能用 css 解决你的问题,我发现这是更可取的解决方案。 CSS 的侵入性要小得多,即使您现在有两个不同的 CSS 选择器做同样的事情,另一种方法是让一个 JSP 钩子(Hook)和一个 CSS 更改来做出选择。
将 JSP 更改留给实际结构所需的更改(如果可能),并尽可能使用 CSS。您的主题是自定义 CSS 的自然位置 - 恕我直言,它最好在那里维护。
关于java - 覆盖 liferay-ui 导航标签库,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28945691/