Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.

Integrate third party Js / CSS/HTML on a AEM page

Avatar

Level 4

Hi  gurus, 

Ima trying to tackle a use case where a different team creates a app/widget which comprises of some js/CSS/HTML. This widget has to be displayed on a AEM page.

 

I do not want to go via the route of iframe so thinking of other possibilities. One approach I'm inclined to is ask the third party team to upload the artefact combining full JS CSS and HTML in some shared location. From AEM we pull down this artifact and just refer it on a page via custom AEM component. ( by referring to path where the artifact is downloaded in repository .. may be DAM)

 

Has any one tried similar implementation before ?or do you see any other better approaches ? Greatly appreciate for guiding me towards right direction

 

Cheers

3 Replies

Avatar

Community Advisor

Hi,

If you do consider bootstrap custom html, css and js.

Then you would find these results & much more [1] [2]

[1] http://help-forums.adobe.com/content/adobeforums/en/experience-manager-forum/adobe-experience-manage...

[2] https://github.com/smithstone-oss/aem-bootstrap

Regards,

Peter

Avatar

Level 4

Thanks for your reply. I'm not sure if my the above mentioned links help me in my case. Above principles seems good for creating layout container components. 

What I'm trying to achieve is to create a widget container like component  which just leverages third party j s,  CSS and HTML located from dam and embed that widget on a AEM content page. 

The widget here is but a self contained angular app and an example of that can be a service locator app which shows all service stations in a particular city. 

Please do let me know if I have overlooked and missed your point. 

Cheers

Avatar

Community Advisor

While possible, embedding .html and css as well as js from DAM does not sound right.

Benefit's from AEM you get once you start building components and templates.

In your case 'service locator app' would be just an AEM component that 'leverages third party js, CSS and HTML'.

It should not be a problem to add third party js/css either as resource from different domain or component owned client library.

Yes, it might take you a bit longer than uploading data to DAM, but it would give you benefits or allow someone else who would adopt your code understand what's happening just by looking at component rather then trying to understand how you hacked you third party data into DAM.

Regards,

Peter