🎀博客园-awescnb插件-geek皮肤优化--浏览器ico图标修改

💖简介

通过js方式自定义修改博客园-awescnb插件-geek皮肤下浏览器ico图标

👉效果

📖图标准备

准备自定义的图标，上传至博客园个人的相册中
复制对应链接

⭐方案一：皮肤配置

使用皮肤官方配置
官方皮肤配置config中新增博客标题配置

    // 网站标题
    webTag: {
      enable: true,
      title: "丿似锦",
      favicon: "https://images.cnblogs.com/cnblogs_com/zktww/2418533/t_240828132413_logo-1.png",
    },

🌟方案二：自定义

自定义进行代码注入

定义自定义HTML：
博客园->管理->设置->页脚 HTML 代码
添加相关代码

  //更换ico图标
  function updateICO(){
    var link = document.querySelector("link[rel*='icon']") || document.createElement('link');
    link.rel = 'icon';
    link.href = "https://images.cnblogs.com/cnblogs_com/zktww/2418533/t_240828132413_logo-1.png";
    document.getElementsByTagName('head')[0].appendChild(link);
  }
  updateICO();

link.href修改为自定义的图标地址
document.querySelector返回匹配指定选择器的元素
document.createElement创建元素
document.getElementsByTagName获取HTML文档中具有指定标签名的元素
head中link引用外部资源，rel="icon"为图标资源

---

结束