AEM Applying CSS and JS difficulty

[Karl515]

Ok so I've been following this series

Getting Started with AEM Sites Chapter 3 - Client-Side Libraries and Responsive Grid

and I can't get part 3 to work. after the clean install. nothing happens to my page.

I can see that my files were successfully install in crx but don't know why it's not working(affecting my page).

I'm still in the process of understanding how aem integrate it's css to it's page.

[arunpatidar]

Hi,

You can check below link to understand ClientLibs(JS and CSS)

Using Client-Side Libraries

[Karl515]

Thanks for the response. now I'm stuck again with
as to

What is missing from the prev tutorial for css to work?

[Karl515]

the tutorial introduced another way which is processor. But what is the proper way to do it? the AEM way?

What I've understand so far.

     UI.apps - goes in apps

     UI.content - goes in conf.

     Client libs holds the css/js files for neatness(but we can also do it the old fashion way.)

     you need to add something in the node properties for it to connect.

     But what is missing in the series tutorial that it's not working smacdonald2008​

     need your help Sir

Crap AEM is nightmare especially when tutorials are not working

[Ravi_Pampana]

Can you check whether you are adding categories property to node having

jcr:primaryType

Name

cq:ClientLibraryFolder

You can refer to OOB clientlibs in AEM 6.4 /libs/clientlibs/granite/backbone and make changes similar to it

Screenshot of above mentioned folder

[Karl515 · Accepted solution]

I see!. Thanks!

it's a maven create clientlibs and it states nt:folder. Is there a way to edit this? cuz AEM Tutorials said the it's recommended to created a project from a maven architecture and it generates nt:folder clientlibs

[arunpatidar]

Hi,

Can you paste the command which you used to create maven project? I used archetype 11 and 12, I didn't see that issue.

[Karl515]

Hi and thanks for the response.

I'm using

as instructed here

Getting Started with AEM Sites Chapter 1 - Project Setup

[Karl515]

it creates it's sub folder as CQ:clientlibraryfolder

but following this guide

Getting Started with AEM Sites Chapter 3 - Client-Side Libraries and Responsive Grid

I wasn't able to apply css as stated.

[arunpatidar]

Hi,

I tried to create project using above and I can see the ClientLibs folder ClientLibs-base.

To get other clientlibs you need to install anther package

• The AEM project archetype creates /apps/clientlibs/clientlib-base automatically. The below zip includes the source for the additional client libraries:

  • clientlib-author
  • clientlib-dependencies
  • clientlib-site
• DOWNLOAD

  Get file