Mozilla浏览器的书签工具栏中没有显示Favicon图标



Favicon图标未显示在Mozilla浏览器的书签工具栏中

这是代码

<link rel="shortcut icon" href="images/favicon.png" type="image/x-icon" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" /> 
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="apple-touch-icon" sizes="192x192" href="/android-chrome-192x192.png">
<link rel="alternate" rel="apple-touch-icon" href="/android-chrome-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">

尝试使用<link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico">。其他原因可能是缓存

首先[CTRL]+[SHIFT]+[DEL]清除缓存,然后重新启动Firefox

用于下一步

<link rel="shortcut icon" href="http://yourdomain.com/images/favicon.ico?version=1" />

将favicon放在web服务器的根目录中,并称为favicon.ico.

请注意,在最近版本的Firefox中,收藏夹图标仅显示在选项卡图标和书签上,而不显示在地址栏图标中。

当我使用一个专门创建SVG收藏夹的过程,而不是使用可能用于SVG、PNG、JPG等文件类型的通用过程时,我也遇到了同样的问题。

你似乎是一些在线生成器上最喜欢的生成器包,比如这里。

首先单击此页面右上角的蓝色按钮,标题为选择您的Favicon图像

(不要点击下面的两个按钮中的任何一个,即标题为用随机图像演示创建SVG收藏夹的按钮。后一个按钮不会生成将显示在书签工具栏图标上的收藏夹图标,尽管它确实显示在网页选项卡上。蓝色按钮过程也适用于SVG收藏夹图标。(

单击蓝色按钮后,您接下来将通过文件系统导航到要使用的图像,例如网站徽标图像,例如logo.svg

经过一番折腾后,会打开一个选项页面。如果你的收藏夹在方面是合理的正方形,如果它有一个透明的背景,你可以接受这些配置的默认值。在页面底部单击蓝色按钮,生成您的传真&HTML代码

经过更多的搅动之后,会出现一个新页面,标题为安装您的Favicon

将显示的HTML代码片段复制并粘贴到索引页的最后一个条目之后。然后将图像和其他文件放在网站的根目录中,即存放index.html文件的同一文件夹中。

现在,您需要首先在浏览器上本地测试您的网站文件。打开网站的index.html页面,将书签拖动到书签文件夹中。

浏览器需要刷新、关闭,如果关闭时没有自动清除数据,则需要清除缓存+cookie。然后在网站书签上重新打开浏览器。从书签文件夹中刷新网站一两次。收藏夹图标现在应该会显示在书签工具栏上。

将网站中所有受影响的文件FTP到web服务器,并对实时网站重复先前的过程。

最新更新