将favicon添加到JSF项目并在<link>中引用它

Question

如何将一个favicon添加到JSF项目并在<link>元素中引用它？

我试过如下:

<h:head>
    <link rel="icon" type="image/x-icon" href="images/favicon.ico"/>
    ...
</h:head>

但是,它没有显示任何图标.

Answer 1

亲属href相对于当前请求URI.可能它解决了无效的URL.您需要在上下文路径前加上它,使其变为相对于域根目录.

此外,rel最好是shortcut icon让它在旧版浏览器中工作.

如果使用.ico文件,您还需要确保它是一个真实的 .ico文件,而不是一些.bmp重命名的文件.ico.您可以根据多种图像格式在此处生成一个.但是,您也可以只使用.png或.gif文件.

总而言之,只要文件位于

WebContent
 |-- images
 |    `-- favicon.ico
 :

那应该这样做:

<link rel="shortcut icon" type="image/x-icon" href="#{request.contextPath}/images/favicon.ico"/>

但是,如果您已将其作为JSF资源放在/resources文件夹中,如下所示

WebContent
 |-- resources
 |    `-- images
 |         `-- favicon.ico
 :

这将使它可以访问<h:graphicImage name="images/favicon.ico">,然后这应该这样做:

<link rel="shortcut icon" type="image/x-icon" href="#{resource['images/favicon.ico']}"/>

Answer 2

我使用了以下内容,它适用于IE和Chrome

<link rel="shortcut icon" href="#{resource['images/favicon.ico']}" type="image/x-icon" />

Answer 3

由于 JSF 使用资源作为存储图像文件夹的容器，因此您可以执行以下操作；

<link rel="shortcut icon" type="image/x-icon" href="#{request.contextPath}/resources/images/favicon.ico"/>