Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.
SOLVED

CSS not being applied to Layout Container in React SPA page

Avatar

Level 1

Hello everyone,

 

I'm currently running a React SPA sites with AEM 6.5.5 and trying to apply a custom CSS class into one of the Layout Containers in my template.  

 

Here are the steps I did:

1. Added the custom css class in the Layout Container's Policy

Adding the custom class in Template PolicyAdding the custom class in Template Policy

 

2. Subsequently applied itstep-2.PNG

 

However, the CSS class is not being registered to the layout container. actual-behavior.PNG

 

Has anyone encountered this behavior before? Or does React SPA not allow such CSS overriding through the console?

 

Any advice is really appreciated.

 

Thanks!

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi @cthio ,

 

I haven't tried this, but can you please try updating aem-react-editable-components version to 1.1.9 in ui.frontend/package.json and check once.

 

As per below thread this feature is available with this version. v1.1.9

 

https://github.com/adobe/aem-react-editable-components/issues/68 

View solution in original post

2 Replies

Avatar

Correct answer by
Community Advisor

Hi @cthio ,

 

I haven't tried this, but can you please try updating aem-react-editable-components version to 1.1.9 in ui.frontend/package.json and check once.

 

As per below thread this feature is available with this version. v1.1.9

 

https://github.com/adobe/aem-react-editable-components/issues/68 

Avatar

Community Advisor

Can you try to add in Default CSS classes field instead of creating Allowed Style if style needs to be applied from template but not from page.



Arun Patidar