分享好友 最新动态首页 最新动态分类 切换频道
CSDN 完全美化教程,根治 CSDN 肮脏的界面现状
2024-12-01 10:49
CSDN 完全美化教程,根治 CSDN 肮脏的界面现状 肮脏

CSDN 界面的现状已经到了惨不忍睹、不堪入目的程度了。混乱的侧边栏、不怀好意的悬浮栏、无处不在的广告。尤其是最下面的用券推广按钮,按钮样式如此嚣张更是让我感到非常的不爽。长期看着这样的界面,容易造成炫目、不适,长期以往就会增加工作压力、难以保持良好的心态,同时把眼睛贴在屏幕上分辨混乱的网页元素,长期以往也容易造成散光和近视。

但是另一方面,最然已经有 博客园 这样的优质平台了,由于 CSDN 通过某些手段占据了互联网上大多数的博客流量,因此如果你希望你的博客文章能够被一些需要博客提供的技术又只会使用百度搜索的大一新生看到的话,还是不得不使用 CSDN。

因此,有必要对 CSDN 的界面进行彻底的美化。

CSDN 完全美化教程,根治 CSDN 肮脏的界面现状

本文提供的美化方案是亮色主题的,如果你喜欢暗色化的配置,可以在本文提供的方案基础上进行个性化的修改和配置。

为了美化 CSDN 界面,你需要准备下面的工具

  • 钒磷氮工具,或者以下所有工具的镜像下载站点
  • AD Guard 浏览器插件
  • Stylus 浏览器插件
  • 油猴脚本(Tampermonkey)插件
  • 一张你喜欢的冷色调主题壁纸

其中,浏览器插件可以在你使用的浏览器的【扩展】功能里面找到。如果您还不知道怎么安装浏览器插件,可以参考知乎文章 手把手教你安装浏览器插件。

而如果您的浏览器的扩展功能里面搜索不到上述插件(比如,如果您正在使用 360 浏览器极速版,或者百度上下载到的山寨版 Chrome,那么我建议您卸载现在正在使用的浏览器,并安装 Mozilla Firefox、Google Chrome 或 Microsoft Edge。

安装完插件之后,您应该可以看见在您的浏览器右上角出现了插件的图标。这些图标可以被隐藏到插件菜单里面(插件菜单本身也可以被隐藏和开启,也可以被单独显示出来。请记住这一点,因为在我们接续的操作当中还会遇到。

AD Guard 插件 是这个配置最基本的工具。AD Guard 是全球最先进的广告拦截器,能够帮你拦截互联网上大部分的弹窗广告,也能帮助你个性化地添加个人的广告过滤规则。

CSDN 完全美化教程,根治 CSDN 肮脏的界面现状

如果您是用的是 Microsoft Edge 或者 Google Chrome,那么 AD Guard 插件可以在您的浏览器的插件功能里面点击插件市场直接下载安装。但如果你和我一样使用的是 FireFox 浏览器,则比较麻烦。这是因为火狐浏览器因广告拦截被国内多家企业起诉,国内企业要求在 Firefox 上停止广告屏蔽(别问我为什么不起诉谷歌和巨硬,因此不得不停止向中国用户提供具有广告屏蔽功能的插件。您可能会想到使用插件压缩包进行安装,但是实际上这个功能在 Firefox 上也已经被禁止了。因此,如果您拥有全局钒磷氮的工具,可以自己解决;如果您没有相应的工具,可以考虑尝试一下 这个链接 提供的方法。

油猴脚本的配置比较简单,我们首先在自己的浏览器的插件市场下载安装即可

然后只需要打开 获取油猴脚本的官方网站,然后安装这个 「CSDNGreener」🍃CSDN广告完全过滤|免登录|个性化排版|最强老牌脚本|持续更新 的脚本。你可以在网站里面搜索这个脚本点击安装,或者也可以点击这里的链接跳转。

这个脚本下载安装之后,CSDN 最顶上的工具栏就会多出一个会自动隐藏得小绿叶子🍃图标。提供了很多个性化的功能,可以根据自己的喜好自行调节。

CSDN 完全美化教程,根治 CSDN 肮脏的界面现状

像是您之前找到的冷色调壁纸,这个时候可以设置为您的 CSDN 背景。

配置插件本体

Stylus 同样也是一个浏览器插件,允许用户通过书写 CSS 样式,自行定义任何网站网页的样式。下载安装的方法与其他插件基本一致。

安装样式

这个插件安装脚本的网站是 UserStyles.world,访问这个网站可能会需要使用钒磷氮工具。而需要安装的样式是这个 Fluid-csdn 圆角与毛玻璃设计,集成了未登录复制破解,点击链接即可访问。

需要注意的是,在进行样式的安装之前,您需要首先打开 UserStyle 的 UserCSS 功能,因为这个脚本使用了 UserCSS 进行编写。我不是很理解这个 UserCSS 到底是什么,但是根据我的无端揣测,这应该是一种由 UserStyle 针对具体实际情况扩展的 CSS。

具体的开启方法是:首先在您的浏览器界面框右上角找到 Stylus 的小图标,点击,打开 Stylus 的主菜单;找到右下角的设置按钮,点击进入设置界面。

CSDN 完全美化教程,根治 CSDN 肮脏的界面现状

Stylus 的设置界面大概就像下面这样。你安装过的脚本将会显示在界面的右侧,而左侧是一些基本的设置选项。勾选下图中标记出来的这个选项,确保其已经被勾选亮起。这代表你已经启用了 UserCSS。

CSDN 完全美化教程,根治 CSDN 肮脏的界面现状

同时,通过点击右侧的脚本,你可以具体查看样式的规则,甚至对其中的内容作出个性化的修改和调整。

按照样式作者的要求添加 AD Guard 规则

根据该样式作者的声明,样式需要配合给出的 AD Guard 用户自定义规则使用。这些规则被黏贴在样式主页的 里面。您可以从中复制下来,然后粘贴到 AD Guard 的用户自定义规则里面。

具体的方法是:首先在您的浏览器界面框右上角找到 AD Guard 的小图标,点击,打开 AD Guard 主菜单;找到主菜单右上角的设置按钮,点击进入设置界面。

CSDN 完全美化教程,根治 CSDN 肮脏的界面现状

在紧接着弹出的菜单左侧选项卡里面找到 用户过滤器,点击之后就能看到下面的界面。最中央的这个 Code Mirror 就是给你输入自定义规则的。把你之前复制的内容粘贴进去,理论上就完成了这部分内容的配置。

CSDN 完全美化教程,根治 CSDN 肮脏的界面现状

但是……请等一下,还有一些问题需要处理

到目前为止,还没有完结。经过本人实际测试之后发现:如果直接采取这些配置,那么 这个样式的作者是默认帮你屏蔽了评论区和私聊窗口的消息回复功能的 做得真干净啊……

所以如果你还是想保留 CSDN 基本的完整的功能、与社区里 素质并不是太高但是仍然确实诚心诚意来学习技术 的小伙伴们激情互动的话,就需要在原作者的样式定义和用户屏蔽规则定义里面进行修改。修改之后的样式文件和 AD Guard 定义规则,因为比较长,被我放在文末的【附件】部分里面了。你可以滚动到下面去复制,然后黏贴覆盖你原来粘贴进去的 AD Guard 规则,以及 UserStyle 样式。

以下是我具体修改的地方

我首先先声明一下:原作者定义的样式修改了 CSDN 页面顶端的顶栏,把它加宽了一倍。这样虽然在大屏幕上看着确实很爽,但是笔记本的小屏幕上属实挺折磨的。我把这段内容也给修改了。

 

还有就是通过注释这行内容,解锁了私信里面的聊天回复功能

 

最后就是在 AD Guard 的自定义规则里面修改的,显示 CSDN 的评论区按钮、点赞按钮等。

 

这个是我参考了 黑山雁 老师的博客 使用浏览器插件 Stylus 美化 CSDN 页面效果 弄的,大家可以看看原文——他的原文里面提供了更多的配置。同时 他的博客 里面有很多高质量文章,大家可以去读读看。

简单地:在 Stylus 里面新建样式,复制下面的 CSS 代码黏贴进去就好了。保存并启用脚本样式——理论上 Stylus 会自动给保存的文件命名的。

 

如果你已经完成了上述的配置,看到的效果应该像是下面这样的。

CSDN 完全美化教程,根治 CSDN 肮脏的界面现状

这年头写个博客不容易,你甚至还需要和你的博客平台斗智斗勇。但是国内博客这块 CSDN 的生态位确实也代替不了。没办法,希望 CSDN 以后能良心一点,别再搞界面负优化了。

经过修改后的 AD Guard 插件规则

 

经过修改后的 fluid-csdn 样式

最新文章
宅家新姿势—威联通NAS安装套件版Emby搭建家庭影音服务器
创作立场声明:最近一直在折腾威联通的NAS,也折腾出了一些小心得,网上关于威联通系统的相关教程较少,所以新的一年,准备开一个新系列,写写威联通系统的介绍、配置技巧等,是分享也是记录。在阿文菌等各位大佬的影响下开始研究Emby这款
【原创】解锁社交媒体SEO:获取海量流量的密钥
  在当今数字化时代,社交媒体已成为人们日常生活的重要组成部分,同时也是企业和个人获取流量、提高品牌知名度的重要渠道。社交媒体SEO(搜索引擎优化)作为一种优化社交媒体平台的方法,旨在提高网站在搜索引擎和社交媒体上的排名和流量
AI文案创作神器:让你的营销更有感染力
在快节奏的互联网时代,营销信息的传递速度超乎想象,但要让你的内容在众多信息中脱颖而出,并非易事。一篇优秀的营销文案不仅仅要传达产品信息,更要打动人心,引发共鸣。而今,AI技术的崛起为文案创作注入了新的活力,句无忧——这款集违
如何有效利用百度购买关键词排名提升网站流量
青衣网络-www.ra0.cn:如何有效利用百度购买关键词排名提升网站流量目录:1. 理解百度关键词购买机制2. 确定目标关键词的策略3. 关键词竞价与优化技巧4. 监控和调整关键词表现5. 避免常见错误和陷阱6. 结语正文:理解百度关键词购买机制在
经验:百度收录规则与机制:运营专家分享亲身经历,提升收录率的秘诀
随着信息化时代的飞速发展,百度收录成为了每一位内容创作者难以避免的难题。本人身为一名具有丰富经验的运营专家,深谙百度收录规则与机制。今日在此,愿将亲身经历与众共享,期盼能为同业者带来有益的启示。百度收录的意义与现状首先要明
微信视频号链接地址怎么提取?4套方法都能用。
3. 点击链接中的保存视频按钮即可将视频保存到您的设备,或者直接提取视频号视频的链接。建议:选择在线视频下载器时,请确保选择合法可靠的网站,以避免安全风险。同时,在选择视频格式和质量时,根据您的需求考虑下载速度和存储空间。方
最新Q/W防洪跳转页面/微信小程序跳转到未备案域名
wwthyn.lanzoup.com/iJJ3f1hpcq2j使用教程: 1.上传插件网站根目录 2.打开khyy文件夹 修改index.php文件中的链接(url前面的0是跳转时间,可自行设置) echo 'html head     meta http-equiv="refre
苹果cms模板_我的主题网【第二十五套】精简宽屏大气苹果CMSv10模板DIY系列拆分版...
苹果cmsv10下载地址:https://www.mytheme.cn/maccms/243.html这款苹果cmsv10模板依然是DIY系列样式,优化重构了前期同系列的不足,添加了更流行的元素和设计风格,这是我们完全自主开发没用任何css框架且只针对影
SEO高手秘籍,网站搜索引擎脱颖而出之道
SEO优化高手通过深入理解搜索引擎算法,精准关键词研究,优化网站结构、内容和外部链接,提升网站质量和用户体验,从而让你的网站在搜索引擎中排名靠前,吸引更多流量。掌握这些技巧,让你的网站脱颖而出。探秘SEO优化基本原理精通SEO优化
相关文章
推荐文章
发表评论
0评