Adobe 如何更改AEM 6.3'；触摸屏？

我在AEM 6.1的经典UI中有一个项目，在这里我可以将默认的拖动组件或资源标签覆盖为自定义标签，就像这样：

我已经创建了一个自定义的parsys组件。让我们把它命名为custom/parsys我用sling:resourceSuperType指向foundation/components/parsys

我分别创建了自定义/parsys/new

我通过添加以下行覆盖了new.jsp：

String-emptyText=currentStyle.get（“cq:emptyText”，”）；
if（StringUtils.isNotBlank（emptyText））{
editConfig.setEmpty（true）；
editConfig.setEmptyText（emptyText）；
}

现在，我可以通过/etc/designs/custom结构设置每个parsys的放置区标签，从而轻松地自定义它。所以每个帕西斯基本上都明确地告诉作者它接受了什么样的组件。除了parsys内部的传统组件的可用性之外，这为编辑人员处理包含许多不同段落的复杂页面结构（通常相互嵌套）增加了巨大的价值

现在，我正在使用触控UI的AEM 6.3中工作，在某种程度上已经发生了很大的变化，不允许我简单地移植上述解决方案。谷歌搜索这个问题没有帮助不幸的是，6.3非常新鲜，有针对wcm/foundation/components/parsys和/或foundation/components/parsys的旧版本的解决方案，但不适用于最新版本。有人已经解决了这个问题吗

---

更新：我用经典UI解决方案创建了一个示例项目。因此，这里我们有下面的和相应的配置。当按照AEM 6.3构建和部署时，可在以下项下进行检查并产生所需的行为：

---

上述方法不适用于触摸屏用户界面。Adobe在其i18n文件的“新建”部分将其硬编码为“拖动组件到此”

替代解决方案：-

• 找到一种覆盖帕西斯的方法
• 使用选择器方法，修改它与Inspectable.js的交互，在这里，您可以提供新的组件特定消息，同时包括parsys，可以通过使用选择器，例如

---

通过将TechNiks的建议与我以前的方法相结合，我创建了一个有效的解决方案。它还不是完美的，因为它必须假设段落资源总是在适当的位置。此外，它还创建了许多（可能是冗余的）请求调用，但从表面上看，它以我希望的方式工作，在设计中使用简单的配置，并且它证明了这是可以做到的。对于优化，需要更多的深度挖掘（我不会很快这么做，这就是为什么我已经发布了当前版本）。 以下是我采取的主要步骤：

我使用自己的parsys叠加组件

我为它提供了一个配置选择器，从它的设计中获取cq:emptyText

我覆盖了Inspectable的函数haspholder以请求配置的值

---

有关详细信息，您只需查看，主要提交内容是。

我今天收到了相同的功能请求，阅读您的帖子，并提供了更简单的解决方案：

1.通过自定义属性数据占位符提示，使用cq:htmlTag配置在组件中定义自定义占位符文本

<jcr:root xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0"
jcr:primaryType="nt:unstructured"
data-placeholder-hint="Drag and drop your fancy components here."/>

与：

if（this.dom.hasClass（newComponentClass））{
//开始覆盖：自定义parsys文本提示
//如果通过属性数据占位符提示使用组件的配置cq:htmlTag设置，则显示自定义文本提示
var editableEl=this.dom.parents（“.cq可编辑dom[数据占位符提示]，.cq可编辑dom[数据占位符提示]”）。first（）；
如果（EditableL.length>0）{
var placeholderHint=editablel.data（'placeholderHint'）；
var elClasses=this.dom.attr（“类”）.split（“”）；
对于（var i=0；i

3.如果您的组件中有多个parsys，并且您希望为每个parsys显示不同的占位符，则使用选择器包括@TechNiks答案中所述的parsys组件，但继续按照1中所述配置占位符提示，只需使用选择器作为后缀

基本上是通过数据属性数据占位符提示设置占位符消息，然后从JS读取它（如果已设置），否则显示默认消息

编辑我编辑了我的帖子，以便根据要求支持多个parsys占位符。它基本上遵循与上述选择器相同的理念，但是使用我的简单性和灵活性来配置和显示消息，而无需在覆盖文件中硬编码消息。

AEM Parsys使用

占位符元素上的
数据文本
属性
填充
Parsys下拉文本
，如
蓝色
中所示：

这些是默认的占位符样式（我们将使用parsys组件的附加/自定义CSS覆盖
内容
属性）：

这是我们组件上的自定义/附加编辑器CSS：

结果是：

注意：最好使用
数据路径
属性进行样式设置，而不是使用
数据文本
属性：
祝你好运。。。
    if (this.dom.hasClass(newComponentClass)) {
        return newComponentPlaceholderText;
    }

    if (this.dom.hasClass(newComponentClass)) {
        // START OVERLAY: custom parsys text hint
        // show custom text hint if set with the component's configuration cq:htmlTag via the property data-placeholder-hint
        var editableEl = this.dom.parents(".cq-Editable-dom[data-placeholder-hint],.cq-Editable-dom [data-placeholder-hint]").first();
        if(editableEl.length > 0) {
            var placeholderHint = editableEl.data('placeholderHint');
            var elClasses = this.dom.attr("class").split(" ");
            for(var i = 0; i < elClasses.length; i++) {
                var placeholderHintSelector = editableEl.data("placeholder-hint-" + elClasses[i]);
                if(placeholderHintSelector) {
                    placeholderHint = placeholderHintSelector;
                    break;
                }
            }
            if(placeholderHint) {
                return Granite.I18n.get(placeholderHint);
            }
        }
        // END OVERLAY: custom parsys text hint
        return newComponentPlaceholderText;
    }

<jcr:root xmlns:jcr="http://www.jcp.org/jcr/1.0" xmlns:cq="http://www.day.com/jcr/cq/1.0"
jcr:primaryType="nt:unstructured"
data-placeholder-hint="Drag and drop your fancy components here (default message)."
data-placeholder-hint-mypar1selector="Drag and drop your fancy components here (mypar1selector message)." />

div[data-path='/content/aemarch13/home/jcr:content/NavbarNav/*']:before {
   content: 'Drop it here.'
}