Header dialog implementation

[Mani_kumar_]

Hi All,

We have a requirement to implement a header navigation all the configurations should be given by author dialog it is not like getting all child pages from the parent values should populate from the author dialog only.

We have some approach to implement it by having it in data page(global page for header configuration) but design of the dialog is complicated any idea or thoughts that can make our dialog design easy for the authors.

I am also attaching the screenshot for the header.

Thanks,

Mani Kumar K

[edubey · Accepted solution]

Hi Mani,

These type of menus or header depends on CSS/HTML/JS to a great extent. I hope you have all these things with you.

Second, As you can see, you have one main navigations on top. Then each main navigation is again having some sub navigations.

I would recommend you to implement using your own custom XTYPE having nested multifield. It will not restrict authors and will help them to author navigations with 2 level easily and any number of links.

[smacdonald2008]

AEM nav components are driven by JCR structure and CSS/JS. Creating a dialog fir a nav conponent may be possible using a menu plugin such as a JQuery plugin.

[srikanth_pogula]

Hi Mani,

Could you please let us know what approach did you take to implement this functionality?

I am looking to implement at similar requirement. Also is there any possibility to cache the entire navigation mega menu so that we need not repeat the steps to fetch the list of menu items on every page load? 

Thanks & Regards,

Srikanth Pogula.

[Mani_kumar_]

srikanth pogula wrote...

Hi Mani,

Could you please let us know what approach did you take to implement this functionality?

I am looking to implement at similar requirement. Also is there any possibility to cache the entire navigation mega menu so that we need not repeat the steps to fetch the list of menu items on every page load? 

Thanks & Regards,

Srikanth Pogula.

Hi Srikanth,

Can you please provide any screenshot of your header so that i can tell how exactly we can do it.

Thanks,

Mani Kumar K

[srikanth_pogula]

Hi Mani,

I have attached the screenshot here.

Primary navigation menu items are Services, Industries, Careers.

Under each primary nav item, there can be multiple Level 1 menu items, for example Audit, Consulting, Enterprise Risk etc...

Under each Level 1 menu item, there can be multiple Level 2 menu items, for example under Audit there are two Level 2 menu items a) Financial Transactions b)Regulatory, Forensics & Compliance

Thanks & Regards,

Srikanth Pogula.

[Mani_kumar_]

srikanth pogula wrote...

Hi Mani,

I have attached the screenshot here.

Primary navigation menu items are Services, Industries, Careers.

Under each primary nav item, there can be multiple Level 1 menu items, for example Audit, Consulting, Enterprise Risk etc...

Under each Level 1 menu item, there can be multiple Level 2 menu items, for example under Audit there are two Level 2 menu items a) Financial Transactions b)Regulatory, Forensics & Compliance

Thanks & Regards,

Srikanth Pogula.

Hi Srikanth,

So may be you can follow below implementation

1.Make datapage only with parsys (Header global configuration page) here you ll be configuring all the primary navigation ,level 1 and level 2 components.

2.Make a component where you will configure primary nav title(Services) and mention how may level-1 components required.

3.Based on the value configured populate(include) that many Level-1 components into the page.

4.Now Level-1 Component will contain a texfiled which is name of the level-1(Audit) and multifield(financial transactions)

In these way i think you can implement the header.

Read all the values from the datapage to actual header component.

Thanks,

Mani Kumar K

2.

[srikanth_pogula]

Thanks for the reply Mani. I will try out this approach.

Thanks & Regards,

Srikanth Pogula.