avatar
custom page template AEM AEM

Control UI template and add/delete node in config folder in JCR.

In node root, we have id="main-container". Thus, you can check generated HTML code from browser.

As you can see screenshot above, root node will defined in /structure/.content.xml. Let now move to open .context.xml and remove.

<root
    jcr:lastModified="{Date}2021-11-02T12:23:56.062-06:00"
    jcr:lastModifiedBy="admin"
    jcr:primaryType="nt:unstructured"
    sling:resourceType="flagtick/components/content/container"
    id="main-container"
    layout="responsiveGrid">
    <experiencefragment-header
        jcr:lastModified="{Date}2021-11-02T11:17:32.773-04:00"
        jcr:lastModifiedBy="admin"
        jcr:primaryType="nt:unstructured"
        sling:resourceType="flagtick/components/content/experiencefragment"
        fragmentVariationPath="/content/experience-fragments/flagtick/us/en/site/header/master"
        id="header"/>
        ...
</root>

But, you can use JCR UI to delete node and test before moving source code and modify.

Now, helloworld component will be dragged and dropped into container node. If you can refer components in ui.app folder.

/conf/flagtick/settings/wcm/templates/letter-page/structure

In here Package Manager, you use the Filter as above to update changes from conf folder in JCR.

You can create component named sample-component. And you can integrate the component into conf/flagtick/settings/wcm/templates/letter-page/structure/.content.xml.

<root
    jcr:lastModified="{Date}2021-11-02T12:23:56.062-06:00"
    jcr:lastModifiedBy="admin"
    jcr:primaryType="nt:unstructured"
    sling:resourceType="flagtick/components/content/container"
    id="main-container"
    layout="responsiveGrid">
    <container
        jcr:lastModified="{Date}2021-12-01T16:02:42.032-03:00"
        jcr:lastModifiedBy="admin"
        jcr:primaryType="nt:unstructured"
        sling:resourceType="flagtick/components/content/container"
        layout="responsiveGrid">
        <contribution-verification
            jcr:lastModified="{Date}2021-12-01T16:16:00.128-03:00"
            jcr:lastModifiedBy="admin"
            jcr:primaryType="nt:unstructured"
            sling:resourceType="flagtick/components/content/subfolder/sample-component"
            enableUserNameTitle="true"
            textIsRich="true"
            editable="{Boolean}true"/>
    </container>
</root>

Reference the way how to create a new component named sample-component in here.

You need to login to do this manipulation!