Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn more

View all

Sign in to view all badges

SOLVED

Handling ClientLibs in Page Properties

aemninja
Level 4
Level 4

Hello Community - We are using static template in our project and we would like to load the clientlibs on need basis. i.e. In one page, I need to use 5 clientlibs and other page I will use only 1 clientlib. I wanted to configure the clientlib in the page properties so that it can easily configurable for individual pages created using the template. Not sure if someone has already done this approach and also need a suggestions on loading all the clientlibs available in the page properties to configure.

1 Accepted Solution
asutosh_jena
Correct answer by
Community Advisor
Community Advisor

Hi @aemninja 

 

I have seen this approach and you can configure the clientlibs at the page properties i.e. if you want any specific file to be loaded only for the specific pages you can do that at the page level using page properties. Just ensure the correct MIME type is selected while configuring the files on the page properties.

 

CSS:

<link rel="stylesheet" href="somefile.css" type="text/css"/>

JS:

<script type="text/javascript" src="somefile.js"></script>

View solution in original post

5 Replies
asutosh_jena
Correct answer by
Community Advisor
Community Advisor

Hi @aemninja 

 

I have seen this approach and you can configure the clientlibs at the page properties i.e. if you want any specific file to be loaded only for the specific pages you can do that at the page level using page properties. Just ensure the correct MIME type is selected while configuring the files on the page properties.

 

CSS:

<link rel="stylesheet" href="somefile.css" type="text/css"/>

JS:

<script type="text/javascript" src="somefile.js"></script>

View solution in original post

aemninja
Level 4
Level 4
@asutosh_jena - Thanks for your inputs. Is there a way to get the list of all the clientlibs to populate the dropdown or we can maintain a generic list with the clientlibs along with the MIME type and load the list in the dropdown for user selection?
asutosh_jena
Community Advisor
Community Advisor

Hi @aemninja 

 

You can keep a predefined list of clientlibs and load it based on the page. MIME type will be taken care by clientlib manager it self.

Just ensure to load the CSS in header section and JS in the footer section.

 

<sly data-sly-use.clientLib="/libs/granite/sightly/templates/clientlib.html" data-sly-call="${clientLib.css @ categories=populate from page properties}"/>
<sly data-sly-use.clientLib="/libs/granite/sightly/templates/clientlib.html" data-sly-call="${clientLib.js @ categories=populate from page properties}"/>

 

BrianKasingli
Community Advisor
Community Advisor

@aemninja,

You can create static templates for each page template. When a user creates a new page, depending on the static page template they have chosen, only then a unique combination of client libraries will be loaded. 

Arun_Patidar
Community Advisor
Community Advisor

You can include the clientlibs from page properties.

Just make sure you included using inheritance logic to avoid changes on every pages.

To get list of all the clientlibs or filtered list use https://helpx.adobe.com/experience-manager/6-3/sites/developing/using/reference-materials/javadoc/co...