How to apply font for only one component?

5 replies
3004 views
Translate

Hi All,

I have a template which has many components. In that only one component i have to apply custom font.

could you please help me out? how to fix the issue?

Thanks,

Michael

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

kautuk_sahniAccepted solution

Employee

Hi

As mentioned by Praveen, components are modules, they can have their own JS and CSS.

So to implement CSS/JS only to the component,

Add CSS and JQuery files to a CQ:ClientLibraryFolder node

You add a CSS file and a JQuery framework file to a cq:ClientLibraryFolder node to define the style of the client JSP. The JQuery framework file that is added is named jquery-1.6.3.min.js.

To add CSS files and the JQuery framework to your component, add acq:ClientLibraryFolder node to your component. After you create the node, set properties that allow the JSP script to find the CSS files and the JQuery library files.

To add the JQuery framework, add a new node named clientlibs to your component (as discussed later). Add these two properties to this node.

Name	Type	Value
dependencies	String[]	cq.jquery
categories	String[]	jquerysamples

The dependencies property informs CQ to include the CSS and JQuery libraries in the page. The categories property informs CQ which clientlibs must be included.

After you create the Clientlibs folder, add a CSS file, and the JQuery library file, and two map text files.

And add the "<cq:includeClientLib categories="jquerysamples" />" to jsp to reflect the client libs changes.

Reference Link:- https://helpx.adobe.com/experience-manager/using/custom-sling-servlets.html

I hope this will help you.

Thanks and regards

Kautuk Sahni

kautuk_sahniAccepted solution

Employee

Hi

As mentioned by Praveen, components are modules, they can have their own JS and CSS.

So to implement CSS/JS only to the component,

Add CSS and JQuery files to a CQ:ClientLibraryFolder node

You add a CSS file and a JQuery framework file to a cq:ClientLibraryFolder node to define the style of the client JSP. The JQuery framework file that is added is named jquery-1.6.3.min.js.

To add CSS files and the JQuery framework to your component, add acq:ClientLibraryFolder node to your component. After you create the node, set properties that allow the JSP script to find the CSS files and the JQuery library files.

To add the JQuery framework, add a new node named clientlibs to your component (as discussed later). Add these two properties to this node.

Name	Type	Value
dependencies	String[]	cq.jquery
categories	String[]	jquerysamples

The dependencies property informs CQ to include the CSS and JQuery libraries in the page. The categories property informs CQ which clientlibs must be included.

After you create the Clientlibs folder, add a CSS file, and the JQuery library file, and two map text files.

And add the "<cq:includeClientLib categories="jquerysamples" />" to jsp to reflect the client libs changes.

Reference Link:- https://helpx.adobe.com/experience-manager/using/custom-sling-servlets.html

I hope this will help you.

Thanks and regards

Kautuk Sahni

Translate

Kautuk Sahni