如何在 AEM 中使整个站点的页脚组件保持不变?

How to make footer component constant through out the whole site in AEM?

站点结构与我的 aem 项目中的 like this 相同。

对于页脚组件,我使用以下代码:-

<div class="ftrsection" data-sly-repeat="${currentPage.listChildren}">
                <h3 data-sly-test.child="${item.title}" >${child}</h3>      
                <ul class="footermenu">
                    <li data-sly-repeat.subpage="${item.listChildren}">
                        <a href="${subpage.path}.html" title="${subpage.title}" class="">${subpage.title}</a> 
                    </li>        

                </ul>
            </div>

当我在主页中时,它在代码的第一行将其作为当前页面,并在页脚中完美显示站点层次结构 as this

但是当我在内部页面(这里是探索页面)时,它会将其视为当前页面并显示我不想要的页脚 as this。我希望它在整个站点中保持不变。如何让它保持不变?

您可以创建一个 Java 使用对象(例如 Footer.java,它允许您始终为您的网站获取正确的根页面。然后您可以像这样调用它:

data-sly-use.footer=“Footer” data-sly-repeat=“${footer.rootPage.listChildren}”

已解决。不得不创建一个助手 class 来找到正确的根。

文件:Footer.java

package com.csmpl.bbsr.me.core.models;

import java.util.*;
import java.util.Iterator;
import com.day.cq.wcm.api.Page;
import com.day.cq.wcm.api.PageFilter;

import com.adobe.cq.sightly.WCMUsePojo;

public class Footer extends WCMUsePojo{
    private List<Page> items = new ArrayList<Page>();
    private Page rootPage;

    // Initializes the navigation
    @Override
    public void activate() throws Exception {
        rootPage = getCurrentPage().getAbsoluteParent(2);

        if (rootPage == null) {
         rootPage = getCurrentPage();
        }
        
        Iterator<Page> childPages = rootPage.listChildren(new PageFilter(getRequest()));
     while (childPages.hasNext()) {
   items.add(childPages.next());
     }
    }

    // Returns the navigation items
    public List<Page> getItems() {
        return items;
    }
    // Returns the navigation root
    public Page getRoot() {
        return rootPage;
    }
}

然后必须访问页脚的 htl 中的 class,例如:

<div  class="ftrsection" data-sly-use.footer="com.csmpl.bbsr.me.core.models.Footer" data-sly-repeat="${footer.root.listChildren}">
                <h3 data-sly-test.child="${item.title}" >${child}</h3>      
                <ul class="footermenu">
                    <li data-sly-repeat.subpage="${item.listChildren}">
                        <a href="${subpage.path}.html" title="${subpage.title}" class="">${subpage.title}</a> 
                    </li>        

                </ul>
            </div>

它奏效了。希望能帮助到你。 :)