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. Test6 October 2016 at 04:05

    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 overri...
Post a Comment
Read more

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 wa...
1 comment
Read more

Mediator Design Pattern

Mediator design pattern is  a pattern used to communicate between  related  object using mediator , the communication happens  in such way that either party is not aware of the underlying communication mechanism. So as a classic example  is our BSE and NSE stock exchange , the exchange facilitates with different stock offerings and they don't hold any stocks with them , it is broker which offers to sale or buy to NSE or BSE and which facilitates the buying or selling of the share . So here BSE and NSE are the mediator which provides hooks for different brokers zerodha, sharekhan... to register and perform the trade , one broker offers to sale certain shares to and other broker buys the same , and this task is performed by the mediator silently without bothering each other. Please follow the UML diagram for the same. Here we have Colleague object which is nothing but the abstract broker and then we have different implementation of broker's like sharekhan...
Post a Comment
Read more