A Template is used to create a Page and defines which components can be used within the selected scope. A template is a hierarchy of nodes that has the same structure as the page to be created but without any actual content.
1. What is Dialog, Design Dialog, and cq:dialog?
cq:dialog - It is the dialogs for the touch-optimized UI(editor.html).
It uses the Granite UI framework.
The node name is cq:dialog.
jcr:primaryType = nt:unstructured, sling:resourceType = cq/gui/components/authoring/dialog for cq:dialog
2. Difference between parsys and iparsys.
parsys – It is a placeholder called “Paragraph System”, where we can drag and drop or add other components or scripts at the page level.
iparsys - The inherited paragraph system is a paragraph system that also allows you to inherit the created paragraphs from the parent. it is similar to parsys except that it allows to inherits parent page “paragraph system” at the template level. You can also cancel paragraph inheritance at a level at any time. It has two checkbox options to cancel/disable the inheritance.
Cancel Inheritance - If selected, the components in this paragraph system are not passed down to the child pages.
Disable Inheritance - If selected, components of this paragraph system on this page are not inherited from the parent page.
3. Explain the overlaying concept in AEM.
Overlaying - The intention of overlaying a default component is to alter the appearance or behavior of a component globally, for all relative references to the component. It relies on the nature of sling to resolve to the /apps folder before searching in the /libs folder. Thus the path to the component is identical to the path to the default component, except it is in the /apps folder and not the /libs folder. More on overlaying watch this video
Creating a custom component manually by creating all necessary nodes and setting the value of “sling:superResourceType” property as “/libs/foundation/components/image”. By doing this you inherit all the features of an image component, even after the upgrade you still inherit the features of the image component. For more information watch this video
4. Why we need to include global.jsp if we are creating a component in jsp?
The JSP script file global.jsp is used to provide quick access to specific objects (i.e. to access content) to any JSP script file used to render a component. Therefore global.jsp should be included in every component rendering JSP script where one or more of the objects provided in global.jsp are used. For more information check this link
5. What is the use of EditConfig node in creating a component?
The edit behavior of a component is configured by adding a cq:editConfig node of type cq:EditConfig below the component node (of type cq:Component) and by adding specific properties and child nodes. For more information check this link
6. What is parbase?
Parbase is a key component as it allows components to inherit attributes from other components, similar to subclasses in object-oriented languages such as Java, C++, and so on. For example, when you open the /libs/foundation/components/text node in the CRXDE Lite, you see that it has a property named sling:resourceSuperType, which references the parbase component. The parbase here defines tree scripts to render images, titles, and so on so that all components subclassed from this parbase can use this script.
Users do not need access to the parbase.
7. Difference between sling:resourceSuperType and sling:resourceType.
sling:resourceSuperType: It is used to achieve inheritance in cq. When set, it inherits the specified component to this component.
sling:resourceType: It is a path, which locates the script to be used for rendering the content. The path used can be absolute or relative.
8. What is the listeners' node?
We can have listeners node under dialog/widget in the AEM component. Listeners is nt:unstructured type node. We can add events (like load content, focus, etc) as property into listeners node. Example
cq:dialog - It is the dialogs for the touch-optimized UI(editor.html).
It uses the Granite UI framework.
The node name is cq:dialog.
jcr:primaryType = nt:unstructured, sling:resourceType = cq/gui/components/authoring/dialog for cq:dialog
2. Difference between parsys and iparsys.
parsys – It is a placeholder called “Paragraph System”, where we can drag and drop or add other components or scripts at the page level.
iparsys - The inherited paragraph system is a paragraph system that also allows you to inherit the created paragraphs from the parent. it is similar to parsys except that it allows to inherits parent page “paragraph system” at the template level. You can also cancel paragraph inheritance at a level at any time. It has two checkbox options to cancel/disable the inheritance.
Cancel Inheritance - If selected, the components in this paragraph system are not passed down to the child pages.
Disable Inheritance - If selected, components of this paragraph system on this page are not inherited from the parent page.
3. Explain the overlaying concept in AEM.
Overlaying - The intention of overlaying a default component is to alter the appearance or behavior of a component globally, for all relative references to the component. It relies on the nature of sling to resolve to the /apps folder before searching in the /libs folder. Thus the path to the component is identical to the path to the default component, except it is in the /apps folder and not the /libs folder. More on overlaying watch this video
Creating a custom component manually by creating all necessary nodes and setting the value of “sling:superResourceType” property as “/libs/foundation/components/image”. By doing this you inherit all the features of an image component, even after the upgrade you still inherit the features of the image component. For more information watch this video
4. Why we need to include global.jsp if we are creating a component in jsp?
The JSP script file global.jsp is used to provide quick access to specific objects (i.e. to access content) to any JSP script file used to render a component. Therefore global.jsp should be included in every component rendering JSP script where one or more of the objects provided in global.jsp are used. For more information check this link
5. What is the use of EditConfig node in creating a component?
The edit behavior of a component is configured by adding a cq:editConfig node of type cq:EditConfig below the component node (of type cq:Component) and by adding specific properties and child nodes. For more information check this link
6. What is parbase?
Parbase is a key component as it allows components to inherit attributes from other components, similar to subclasses in object-oriented languages such as Java, C++, and so on. For example, when you open the /libs/foundation/components/text node in the CRXDE Lite, you see that it has a property named sling:resourceSuperType, which references the parbase component. The parbase here defines tree scripts to render images, titles, and so on so that all components subclassed from this parbase can use this script.
Users do not need access to the parbase.
7. Difference between sling:resourceSuperType and sling:resourceType.
sling:resourceSuperType: It is used to achieve inheritance in cq. When set, it inherits the specified component to this component.
sling:resourceType: It is a path, which locates the script to be used for rendering the content. The path used can be absolute or relative.
8. What is the listeners' node?
We can have listeners node under dialog/widget in the AEM component. Listeners is nt:unstructured type node. We can add events (like load content, focus, etc) as property into listeners node. Example
Listeners will trigger load content events and show "Hello World" in the popup.
9. What is a sling:include, c:import, cq:include?
sling:include - This is the include tag of the Sling JSP Tag library. This tag knows about Sling and also supportsRequestDispatcherOptions.
cq:include - This tag is Communiqué specific extension of the Sling JSP Tag library include tag. IIRC it supports callings scripts in addition to just including renderings of resources.
c:import - I assume this is the import tag of the Standard Tag Library. This tag is documented at http://java.sun.com/products/jsp/jstl/1.1/docs/tlddocs/c/import.html and does not know about Sling directly.
But -- assuming -- this tag is using a RequestDispatcher to dispatch the request, this tag will also pass Sling and the Sling resource resolver. For more information check this link
10. How to include the component into a page?
In Sightly -
< div data-sly-resource="${@path='mycomponent', resourceType='foundation/components/mycomponent'}">
In JSP -
< cq:include path="mycomponent" resourceType="foundation/components/mycomponent" />
11. Difference between jcr:primaryType and jcr:mixinTypes
There are two categories of node types, primary and mixin. Every node has a primary node type assigned to it upon creation. In addition, a mixin node type may be added to a node later in its lifecycle.
The primary node type of a node usually defines node structure (i.e., allowed and required child nodes and properties) related to the problem domain being modeled. For example, a node used in storing content about business contacts might have the primary type myapp:Contact which defines properties such as myapp:givenName, myapp:familyName, and so forth.
Mixin node types usually specify additional properties or child nodes related to a capability being added to the node. These capabilities may include generic repository-level functions as in the case of the built-in mixins mix:versionable and mix:lockable, for example, or domain-level capabilities such as a (hypothetical) myapp:Emailable mixin type that adds the property myapp:emailAddress to a node.
There are two categories of node types, primary and mixin. Every node has a primary node type assigned to it upon creation. In addition, a mixin node type may be added to a node later in its lifecycle.
The primary node type of a node usually defines node structure (i.e., allowed and required child nodes and properties) related to the problem domain being modeled. For example, a node used in storing content about business contacts might have the primary type myapp:Contact which defines properties such as myapp:givenName, myapp:familyName, and so forth.
Mixin node types usually specify additional properties or child nodes related to a capability being added to the node. These capabilities may include generic repository-level functions as in the case of the built-in mixins mix:versionable and mix:lockable, for example, or domain-level capabilities such as a (hypothetical) myapp:Emailable mixin type that adds the property myapp:emailAddress to a node.
12. How to include sidekick into a page?
init.jsp should be included in our jsp or script file to display sidekick.
Note: We should include init.jsp into the base page. So that it will appear in all pages which are overriding it.For more on sidekick watch this video
13. Explain widget and Xtype in AEM?
widget - Adobe Experience Manager (AEM) uses the ExtJS widgets library, which provides the highly polished user interface elements that work across all the most important browsers and allows the creation of desktop-grade UI experiences. These widgets are included within AEM and, in addition to being used by AEM itself, can be used by any website built using AEM. For more on widgets check this link
xtype - In the ExtJS language, an xtype is a symbolic name given to a class. For more on xtype check this link
init.jsp should be included in our jsp or script file to display sidekick.
Note: We should include init.jsp into the base page. So that it will appear in all pages which are overriding it.For more on sidekick watch this video
13. Explain widget and Xtype in AEM?
widget - Adobe Experience Manager (AEM) uses the ExtJS widgets library, which provides the highly polished user interface elements that work across all the most important browsers and allows the creation of desktop-grade UI experiences. These widgets are included within AEM and, in addition to being used by AEM itself, can be used by any website built using AEM. For more on widgets check this link
xtype - In the ExtJS language, an xtype is a symbolic name given to a class. For more on xtype check this link
14. How to create custom xtype?
https://helpx.adobe.com/experience-manager/using/creating-custom-xtype.html
https://helpx.adobe.com/experience-manager/using/creating-custom-xtype.html
Dropdown list, Checkbox and Radio button have same xtype i.e selection. But they have different type select, checkbox and radio respectively.
16. Difference between allowedPaths, allowedChildren and allowedParents?
allowedPaths - Path of a page that is allowed to be based on this template.
allowedChildren - Path of a template that is allowed to be a child of this template.
allowedParents - Path of a template that is allowed to be a parent of this template.
17. What is the ranking at the time of creating template?
ranking - Rank of the template. Used to display the template in the User Interface.
18. Suppose you have created the page using "mytemplate" template. After the creation of page, what will happen to the page if someone deleted the "mytemplate" template?
There will be no effect on the page because when page will be requested it will check the sling:resourcetype property of the page not the template. Check sling resolution concept
19. What is componentGroup, cq:isContainer and cq:noDecoration property ?
componentGroup - Group under which the component can be selected in the Sidekick.
cq:isContainer - Checks if this component is a container component. For example a paragraph system component.
cq:noDecoration - If true, the component is not rendered with automatically generated div and css classes.
20. If I don't want to show my component in sidekick. Which property I should add in component?
Add componentGroup property in component. In componentGroup property add .hidden as a value.
21. What will happen if I add another component path into sling:resourceType property of a component?
Suppose We have component A and component B
In component A, added sling:resourceType property and as value component B path
when you include the component A into the page, AEM will render component A
But when you drag and drop component A into parsys of the page, AEM will render component B
22. What is sling resource merger?
Sling framework bundle (org.apache.sling.resourcemerger) gives us flexibility to have merged view on multiple other resources. The exact merging mechanism depends on the resource picker implementation (i.e. Overlay or Override).
By this Sling Resource Merger, It is possible to
1. remove existing resource/properties from the underlying resources,
2. modify existing properties/child resources of the underlying resources
3. add new properties/child resources we can achieve the above using the following properties.
1. sling:hideProperties (String or String[]) — Specifies the property, or list of properties, to hide.The wildcard * hides all.
2. sling:hideResource (Boolean) — Indicates whether the resources should be completely hidden, including its children.
3. sling:hideChildren (String or String[]) — Contains the child node, or list of child nodes, to hide. The properties of the node will be maintained. The wildcard * hides all.
4. sling:orderBefore (String) — Contains the name of the sibling node that the current node should be positioned in front of.The goal of using Sling Resource Merger :- ensure that customization changes are not made in /libs.
reduce the structure that is replicated from /libs. more
23. We have mycomponent component and under mycomponent we have files mycomponent.jsp, mycomponent.html and mycomponent.html.html. Suppose we are including this component into a page, while file will be rendered?
If we have mycomponent.jsp, mycomponent.html and mycomponent.html.html under mycomponent component. AEM will render mycomponent.html.html file.
If we have mycomponent.jsp and mycomponent.html under mycomponent component. AEM will render mycomponent.html file.
24. How can we reuse a part of a dialog in another dialog?
A specific widget with the label cqinclude exists which allows for inclusion of existing dialog elements in other dialog definitions. The generic JSON format is used on the client side to construct the actual dialog. Following is an example which uses the cqinclude widget to include an existing tab from an existing dialog:
{
"jcr:primaryType": "cq:Widget",
"xtype": "cqinclude",
"path": "/libs/replication/components/agent/tab_extended.infinity.json"
}
The path property needs to point to a dialog-resource that is to be included in JSON format.
25. Can you create a page without using template in AEM?
Yes, we can create a page without using template in AEM.
26. You are working with two components: Component A and Component B. Component B has a slightly different behavior than component A. What is the best way to reuse the default script of component A in component B?
Set a property in component B called sling:resourceSuperType with the path to component A and omit the default script in component B
27. You want to create a custom widget. In which type of folder should you create the custom widget?
Create a folder under your project folder in /apps with the nodeType = cq:ClientLibraryFolder and set property sling:resourceType = widgets/clientlib
28. How can you configure a CQ component to allow an Author to edit content without opening a dialog?
Create and configure the /cq:editConfig/cq:inplaceEditing node under the component node.
29. You want to add a new tab to the page properties dialog. What should you do?
Copy the page properties dialog from the foundation/page component, add a new tab node specifying the cq:Panel node to render the new tab.
30. You have a page and want to create a child page. Which property has the highest priority to determine which templates can be used?
cq:allowedTemplates
31. You have created two templates, tempA and tempB. In the property allowedChildren of tempA you include tempB. You create a pageA based on tempA and add a property cq:allowedTemplates with a list of templates, but excluding tempB. Can you select tempB to create a page as child of pageA?
No, tempB needs to be added to the property cq:allowedTemplates of pageA to accomplish that.
32. How do you get the current rendering mode within a CQ component script?
WCMMode.fromRequest(request);
33. What is Scaffolding?
With scaffolding we can create a form (a scaffold) with fields that reflect the structure we want for our pages and then use this form to easily create pages based on this structure.
Note: More on Scaffolding watch this video
No comments:
Post a Comment
If you have any doubts or questions, please let us know.