CQ5 中的组件样式选项卡中缺少下拉菜单

Question

在 TextImage 组件中，样式选项卡丢失了编辑组件时显示的 css 选择下拉列表。它现在只显示一个空白区域。它应该有一个图像对齐下拉菜单（左或右是您的选择）。这不再出现。

这个选项卡是 xtype componentstyles (String)，所以我不知道它在哪里引用下拉值的来源。我的 CQ5 本地实例工作正常。

我不能只添加一个 xtype 选择并为其提供值，因为添加到 JSP 代码的 css 位于组件的 .jsp 特定页面之外

Answer 1

看起来componentstyles xtype 是由与页面关联的 CQ 设计驱动的。设计存储在 /etc/designs 下，并通过页面的页面属性对话框（cq:designPath 属性）分配

让我们看一下 Geometrixx 网站上的一个例子。如果导航到英文主页@/ content / geometrixx / en.html并将 TextImage 组件的实例添加到页面，您会注意到组件对话框中的样式选项卡是空的。现在导航到“发现 Geometrixx”页面@/ geometrixx / en / company / discover_geometrixx.html并检查 TextImage 组件的两个预先存在的实例之一。样式选项卡包含您提到的图像下拉菜单！

那么“发现页面”和“主页”页面上的实例有什么区别？答案就在设计定义中。如果您打开 CRXDE Lite 并导航到内容页面模板（“发现 Geometrixx”页面采用的）的 Geometrixx 设计页面，您将看到以下节点：

/etc/designs/geometrixx/jcr:content/contentpage/par/textimage
/etc/designs/geometrixx/jcr:content/contentpage/par/textimage/cq:styles
/etc/designs/geometrixx/jcr:content/contentpage/par/textimage/cq:styles/imagealign
/etc/designs/geometrixx/jcr:content/contentpage/par/textimage/cq:styles/imagealign/image_left
/etc/designs/geometrixx/jcr:content/contentpage/par/textimage/cq:styles/imagealign/image_right

主页模板（“主页”页面采用的）的设计缺少此定义。

如果您想继续使用开箱即用的 TextImage 组件，似乎您需要在该组件可以使用的所有段落系统和模板上设置此设计配置。因此，例如，如果您希望 TextImage 组件在添加到主页模板的par段落系统时可以使用这些样式，您可以将类似的样式节点添加到：

/etc/designs/geometrixx/jcr:content/homepage/par/textimage/cq:styles

或者，您可以只覆盖组件和/或创建自己的组件。然后对于这个自定义组件，您可以创建自己的独立于设计的样式对话框。您可以通过检查保存的 JCR 属性并在渲染脚本中设置适当的 CSS 类名称来模拟开箱即用的行为。