CODEWITHSUNDEEP
cssjsf-2font-face
Felipe Wagner
Felipe Wagner

Reputation: 148

JSF Custom font with CSS

I am trying to add a custom font to my _template.html, but it is not rendering the font, only plain text. I tried the solution found here, but did not solve my problem.

My custom font file is in WebContent/Resources/fonts/HelveticaNeueLTStd-LtEx.otf

My CSS file is in WebContent/Resources/css/Font.css

Font.css:

@font-face {
font-family: "Martinelli Logo";

src: url("#{resource['fonts/HelveticaNeueLTStd-LtEx.otf']}");
font-weight: normal;
font-style: normal;

body{
font-family: "Martinelli Logo";
}
}

Obs.: I already tried with only src: url('fonts/HelveticaNeueLTStd-LtEx.otf');, with no luck.

_template.xtml:

<h:body>
<h:outputStylesheet library="css" name="css/Font.css" />
Hello World in custom font!
<h:body />

Upvotes: 1

Views: 3019

Answers (1)

Felipe Wagner
Felipe Wagner

Reputation: 148

The final solution: apparently my browser (Chrome) was loading old cached CSS, so I wasn't being able to see the updates I was developing on my styles. Just cleaned Chrome's cache and everything was working perfectly. I just need to figure how to change that behavior on the browser, since I don't want to clean it for every change on my CSS.

Biggest facepalm ever.

EDIT:

Found the solution by opening Devtools -> Settings -> Checked Disable cache (while DevTool is open)

Now I can edit my CSS and refresh the page to normally see the results. Thanks.

Upvotes: 1

Related Questions