Skip to main content
How to create  help  button in dialog in AEM/CQ.

In our project we have to create Authoring Guide for each of the components developed .All the Authoring elements required a help button to be incorporated in each of the dialog's.

AEM provide's this feature oob , we can provide an help button on dialog's on click of this button provide the target  to page to be opened in the property.




Solution

1.Login to CRX  de.
2.Create a Component
3.Create Dialog within the Component
4.Create a property in the Dialog "helpPath" the type should be String and give value any existing page path , clicking of the help button should open the page in the window.




Comments

  1. Nice info sir.... :D
    Will use this in future.... keep us updated!
    If u have time look into my blog as well ;)

    ReplyDelete

Post a Comment

Popular posts from this blog

Handle bar & AEM server side integration

In AEM 6.0 version, as part of social communities’ project AEM implemented a handlebar script files in place of JSP scripts.  As part of this project AEM SCF community implemented a handle bar engine which in turn uses handlebars.java(jknack) library to compile and execute handlebar templates. Example: Let’s say I have a component called helloworld and the path of component  is  /apps/mysite/components/content/helloworld. Below three steps we need to do to implement header component. 1.       Register a HBS component To register HBS component we need to implement SocialComponentFactory interface and then we need to override methods. In “getSupportedResourceType” method we need to return component path to register it to handlebar engine.  Once we register a component json response will automatically available to handlebar script file. Example: The key aspect is to override getSocialComponent method(Resource).

How to remove hardcoding .html from pathfield in AEM/CQ

In our project we have a pathfield in quite a lot of dialog for various custom components which refers/links to pages. After getting the value of this pathfield in the sightly template we were  adding the html extension manually on it. e.g.                 <a class="navbar-brand" href="${properties.homepagePath @ context='unsafe'}">${properties.headerAuthTitle}</a> We can avoid hardcoding the path by adding property in dialog link  linkPattern The  pathfield  xtype has a config option called  linkpattern . This allows you to configure the widget to automatically add an extension  in case the browsefield is used  to select the link. If a user types the text , the extension is not added. Use this option to add '.html' and all internal links will have .html appended (assuming the content authors always use the pathfield's browse option to select the link [which they should be doing ] ). This way the backend code doesn't hav

Proxy Design Pattern

We use this Pattern when we require don't want to give a direct access to object under some scenario and rather offer a surrogate object  or proxy object which  provides the functionality in place of the real object. There could be several scenario where we would want this kind of functionality. The  real object  has some sensitive operation which would be risky to expose. The real object creation is memory extensive so we want to control the behavior of its creation. The real object is remotely located and rather we want to interact through a local copy using proxy which is actually   aware of it location. So lets look at the UML diagram of the same. So here we have Subject interface which is implemented by both the Proxy and RealObject  and proxy object has  reference to the real object , now the client will  instantiate Proxy object to perform some action and , proxy object will delegate the call to RealSubject to perform the same.