Expand my Community achievements bar.

SOLVED

Add static html css page to aem and render from AEM sites | AEMasCS

Avatar

Level 4

Hi Team,

We are migrating to AEM from another CMS. We have a collection of static pages with HTML, CSS, and JavaScript that we plan to deploy as-is in AEM.

Currently, the pages are hosted on a client server and rendered through the domain, such as `www.ourdomain.au/static-page1`. We need to move these pages to AEM and render them under the same URL.

How can we render these static pages from AEM? Should we use an iframe component for this?

Additionally, how can we host these static pages in AEM?"

 

 

Thanks 

Geo 

Topics

Topics help categorize Community content and increase your ability to discover relevant content.

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi,

Firstly, you need to ensure that these pages stand on their own, meaning that the CSS and JS are part of the page itself so that you don’t face any reference issues.

You have three options:

  1. You could use the embed component to copy and paste the HTML directly into it. However, this may not work properly if there are elements or attributes blocked by XSS rules. Additionally, you will need to adjust the header and footer in AEM.

  2. If you embed the page as an iframe, similar to the first option, you will need to address the header and footer as well as any security considerations to include your pages within AEM. https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-include-static-html... 

  3. You could upload your pages to DAM or directly into the content tree and adjust the content-disposition filter as needed. Then, adjust the dispatcher rules to ensure the resource is loaded properly. You can learn more here:  https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-open-html-file-inli... https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/adding-a-html-page-not-par... 

Hope this helps.



Esteban Bustamante

View solution in original post

3 Replies

Avatar

Correct answer by
Community Advisor

Hi,

Firstly, you need to ensure that these pages stand on their own, meaning that the CSS and JS are part of the page itself so that you don’t face any reference issues.

You have three options:

  1. You could use the embed component to copy and paste the HTML directly into it. However, this may not work properly if there are elements or attributes blocked by XSS rules. Additionally, you will need to adjust the header and footer in AEM.

  2. If you embed the page as an iframe, similar to the first option, you will need to address the header and footer as well as any security considerations to include your pages within AEM. https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-include-static-html... 

  3. You could upload your pages to DAM or directly into the content tree and adjust the content-disposition filter as needed. Then, adjust the dispatcher rules to ensure the resource is loaded properly. You can learn more here:  https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-open-html-file-inli... https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/adding-a-html-page-not-par... 

Hope this helps.



Esteban Bustamante

Avatar

Community Advisor

Hi @georhe6 

Apart from @EstebanBustamante added :

 

If you're using a CDN or a load balancer, you can serve pages from the old CMS on the same domain while transitioning to AEM. Simply set up routing rules to direct traffic accordingly. Over time, you can migrate static pages to AEM, leveraging AEM's page components and client libraries.

Alternatively, create a basic AEM page component with a property for the original URL. You can then use a scheduler to pull content from the old CMS or fetch it dynamically in real-time, treating the old CMS as a third-party data source.

 



Arun Patidar

Avatar

Level 4

Old CMS is managed by a vendor and the contract will be over by next year. So we have to move the static pages .

Thanks,

Geo