1

I create a XHTML page with <h:outputStylesheet name="vendor/font-awesome/css/font-awesome.min.css" /> so it loads the icon automatically like thiscase of i class="fa fa-truck"

I'd like to add the favicon fa-truck to my XHTML page, I download the icon and use this:

 <link rel="icon" type="image/x-icon" href="#{resource['icons/truck.png']}" />

But, I'm looking for another solution without download the icon, I'd like to load it from class="fa fa-truck". So, I'd like that link rel="icon" type="image/png" uses this class directly without download or compress or convert, exactly like i does. In other meaning it's possible to replace href by class ? like this:

It's possible ?. Could you please help me ?. Thanks a lot.

Jasper de Vries
  • 19,370
  • 6
  • 64
  • 102
Nerimen
  • 21
  • 1
  • 6
  • If you're not keen on latest versions of FontAwsome, you can use the built in version of FontAwsome in Primefaces. Currently `Primefaces-6.1` ships with `FontAwsome-4.6.1`. You can enable this feature by setting a `context-param` `primefaces.FONT_AWESOME` to `true` at your `web.xml` – Kishor Prakash May 11 '17 at 07:07
  • Hello @KishorPrakash, thanks for your reply. I added to web.xml ` primefaces.FONT_AWESOME true ` and I added on my XHTML `` but the favicon won't change, could you please help me ?. Thanks a lot. – Nerimen May 11 '17 at 08:47
  • Possible duplicate of [Use Font Awesome Icon As Favicon](http://stackoverflow.com/questions/18156240/use-font-awesome-icon-as-favicon) – Jasper de Vries May 11 '17 at 10:12

3 Answers3

3

No, it's not possible to use a FontAwesome (or any other font that happens to contain icons) character as is as a favicon.

From the W3C documentation:

the format for the image you have chosen must be 16x16 pixels or 32x32 pixels, using either 8-bit or 24-bit colors. The format of the image must be one of PNG (a W3C standard), GIF, or ICO.

So you need to convert the character to a supported image file.

See also:

Jasper de Vries
  • 19,370
  • 6
  • 64
  • 102
1

You can compress truck.png https://tinypng.com/

And after u can convert to base64 https://www.base64-image.de

<link rel="icon" type="image/png" href="data:image/png;base64,...."/>
moon93
  • 129
  • 3
  • 11
  • Hello Sir @moon93, thanks for your reply, but It seems that I won't describe enough my problem. I create a XHTML page with `` so it loads the icon automatically like the case of `` . Now, I'd like that `` does. In other meaning it's possible to replace **href** by **class** ?. Have you please any idea. Thanks a lot. – Nerimen May 11 '17 at 00:47
1

You might want to:

Community
  • 1
  • 1
philippe_b
  • 38,730
  • 7
  • 57
  • 59