AEM CQ 6 - Adding Create Child Page to TouchUI Page Info Trigger


In Classic UI, there is a convenient option in Page tab of Sidekick to create a child page of current page (in Edit mode); Using this extension, we provide the same action on Touch UI Page Info Trigger.

Demo | Package Install

Please leave a comment if you find bugs


1) Login to CRXDE Lite (http://localhost:4502/crx/de) and create folder /apps/touch-ui-child-page

2) Create node /apps/touch-ui-child-page/clientlib of type cq:ClientLibraryFolder and add a String property categories with value cq.authoring.editor.hook

3) Create file (nt:file) /apps/touch-ui-child-page/clientlib/js.txt and add


4) Create file (nt:file) /apps/touch-ui-child-page/clientlib/create-child-page.js and add the following code

(function(document, $, page) {
    document.on("ready", function() {
        var trigger = $('#pageinfo-trigger');

        trigger.on('click', function(){
            var INTERVAL = setInterval(function(){
                var classicUI = $(".pageinfo-pageactions .classicui-switcher");

                if(classicUI && classicUI.length > 0){

                    var createChildPage = "<li class='coral-List-item experience-aem-create-child-page'>" +
                        "<i class='coral-Icon coral-Icon--add coral-Icon--sizeS' title='Create Child Page'></i>" +
                        "Create Child Page</li>";


                    document.fipo('tap', 'click', ".experience-aem-create-child-page", function () {
                        window.location = Granite.HTTP.externalize("/libs/wcm/core/content/sites/createpagewizard.html" + page.path);

})(jQuery(document), Granite.$,;

No comments:

Post a Comment