如何为你的网站添加ICON小图标?

原创 彭淇  2017-08-07 10:50:23  阅读 2030 次 评论 1 条

可能有很多朋友不知道什么是网站ICON小图标,其实网站ICON小图标就是显示在标题前面的小图标。比如飞翔勿扰博客上面标题前面的这个图标就是ICON图标。不明白的朋友可以看图。

如何为你的网站添加ICON小图标?  视觉差 博客 信息 第1张

看完图后知道什么是ICON小图标了吧!下面我将为大家讲一下如何制作你网站的ICON小图标。


如何制作网站ICON小图标?

第一步:利用PS或者是AI软件,新建一个长度和宽度相等的图像图层。

第二步:制作图像内容。图像内容可以参照自己的制定,如果自己有特定象征意义的LOGO,就用自己的LOGO。比如飞翔勿扰博客的ICON图标是一个“PQ”字。

第三步:保存图片为PNG格式。

第四步:百度搜索,ICON在线制作,会出现很多制作软件,可以任意选择一个。也可以在在线工具中选择ICO工具

第五步:打开ICON在线制作软件,在线制作网站ICON小图标,选择目标尺寸和源图片之后,点击“在线生成favicon.ico图标”。

第六步:下载制作好的ICON小图标后,重命名为favicon.ico之后,用FTP上到网站根目录即可。如下图所示:

第七步:在上传完成之后,在浏览器地址栏输入“http+冒号+双斜杠+你的域名+斜杠+favicon.ico” ,查看文件是否上传成功。

在制作好一个漂亮的网站ico小图片后,下一步就开始让ico小图标在搜索结果中显示。

如何让ico图标在搜索结果中显示?

第一步:找到网站的index页面文件,把以下代码加入你的网页里与之间。

加入的代码是:


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


    第二步:刷新浏览器,并清除缓存,就可以看到你的logo图标就会出现在浏览器的标签上了。


本文地址:https://www.pengqi.club/blog/118.html
版权声明:本文为原创文章,版权归 彭淇 所有,欢迎分享本文,转载请保留出处!

发表评论


表情

评论列表

  1. 彭淇
    彭淇 【站务管理】  @回复

    [code][S19]好羞射,文章真的好赞啊,顶博主![/code]