关键词：
感想
因为受到友人启发，部署了个 静态页面，想着太单调了，要不连博客园的修一修，就去网上翻找了一下，果然给我发现了，
但是在DIY的中途，遇到一大堆问题，因为是几年前的源码了，很多链接已经噶了。
首先这个DIY页面的作者是这位小姐姐
ps.不知道怎么称呼
首先这个DIY-->启发来源于这位樱花庄的白猫<--
然后我是看三位前辈的教程来弄的，这位 齐木z前辈 以及这位 亮亮前辈在CSDN的帖子，还有前面的姐姐页面效果的话，可以参考一下 我的博客园
我一开始是不打算写这个博客的，因为也不太会写，还弄不明白很多东西，比如文章啊随笔啊，什么区别，然后我在查看
源码的时候发现了这么一行注释
我当时很诧异，内心真的是百感交集，现在姐姐以及不更新DIY了，但是大学生每年都有，民间码农也遍地开花，看见很多人都出现了和我一样的问题，那我就写个解决办法，也顺便宣传一下这个主题吧，没办法，学生党嘛，等工作了我再来打赏作者吧，好了，开始教程吧
准备工作
- 主要还是两点
- 拥有博客园的博客权限
- 拥有博客园的js权限
js获取权限的办法很多，点我查看= =
1.点击账号设置跳转-->后继续点击博客设置
2.点击设置
3.进行如下设置
因为代码是基于Custom这个皮肤进行的二创
下载资源包
- 页面定制CSS代码 ——> page.css
- 博客侧边栏公告 ——> sidebar.html
- 页脚 ——> foot.html
开始教学
1.首先找到food.html文件，把里的代码复制到页脚HTML里面，这个不需要修改
2.然后找到page.css文件，把里面的代码复制到页面定制CSS代码里面，这个也基本上不需要修改，到现在为止，已经完成一半了
3.找到main.js文件，这个组件很多，我建议打开编译器，通过 Alt+左键 与 ctrl+左键 进行查看
其中这个地方是进行背景修改的
背景文字分别在main.js文件与sideber.html下
可以通过Ctrl+F查找关键字 Welcome进行修改
同理，左上角名字logo也可以通过同样的方式
在sideber.html文件下有一个纪念日的代码，将你的账号日期填进去可以有纪念日时间你可以点击此处查看你的入园时间
4.上传main.js
修改完毕以后摁下Ctrl+S，点击设置旁的文件，拖拽或选取上传
此时我们还没有main.js的链接，我们接着点击上传好的main.js文件，然后在网址栏复制链接
5.找到sideber.html文件，将链接复制到替换栏
最后把siderber.html文件内容复制到***博客侧边栏公告
摁下ctrl+s键，恭喜你，学会了如何DIY自己的博客主页
总结
- 如果想详细了解原理的话点击跳转原作者
- 最后希望大家能给予原作者一些标注，因为我发这个博客的原因是很多二次发表的都del掉了作者，虽然有时候嘴上说着面向Github的CV程序员，但也只是调侃，盗亦有道，更何况我们是借鉴前辈大佬们辛苦夜以继日写的代码，而非是盗，我不是站在道德的制高点上指指点点，我只是觉得，这应该是一种尊重，言尽于此，祝大家来年不出bug，新年快乐。Over
常见问题
1.上方工具栏堆叠一块，就像这样
那是因为你勾选了禁用默认css模板,取消勾选即可解决
2.如何修改网易云音乐or网易云音乐不显示
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/aplayer@1.10.0/dist/APlayer.min.css">
<script src="https://blog-static.cnblogs.com/files/zouwangblog/APlayer.min.js"></script>
<script src="https://unpkg.com/meting@1.2/dist/Meting.min.js"></script>
<div id="player" class="aplayer aplayer-withlist aplayer-fixed" data-id="填入id" data-server="netease" data-type="playlist" data-order="random" data-fixed="true" data-listfolded="true" data-theme="orange"></div>
修改此行内的data-id 即可,id获取方式为在网页端打开网易云音乐，跳转歌单，在链接末端就有
不显示的原因应该是配置的问题，有时候会显示，有时候不显示，我麻了
3.看板娘不显示
api 噶了，百度自己在git上部署一个看板娘就好了
博客园代码高亮美化教程(代码片段)
先简单展示下效果吧：首先需要导入js代码，在侧边栏公告处将以下代码复制进入：<scripttype="text/javascript">!function()varq=null;window.PR_SHOULD_USE_CONTINUATION=!0;(function()functionS(a)functiond(e)varb=e.charCodeAt(0);if(b!==9 查看详情
美化你的博客|来看这篇指导教程(代码片段)
前言好的博客主题不仅美观大方，而且能促进主人书写的愿望，博主也是个喜欢折腾的人，前前后后对自己现在的博客整容过很多次，动过很多次刀，很多人看我博客都说“博主，你的主题666”。其实我很抱歉啊，因为这主题并... 查看详情
博客园主题美化配置（awescnb)(代码片段)
...题为awescnb系列主题中的geek主题 Awescnb文档Awescnb作者博客配置步骤一、准备工作申请js权限（参考链接：https://www.cnblogs.com/maczhen/p/14372738.html) 二、博客配置1.基本配置、代码高亮修改博客默认主题为Custom其他默认 2.博... 查看详情
博客园主题样式修改教程(代码片段)
实现代码高亮那怎么使用呢？我是先向博客园申请了js代码的权限，申请入口还是在刚刚那个【设置】里：我这里是批准了所以显示支持js代码，你们要想实现这个代码高亮，那就得先申请（希望博客园的管理员别打我—..&mdas... 查看详情
博客美化(代码片段)
...r/cnblogs-theme-silence介绍Silence是一款界面简洁、运行高效的博客园主题，主要面向于经常混迹博客园的朋友。简单概括其几个主要特点：专注阅读、精致漂亮的UI；事无巨细的部署文档；兼容移动端浏览器；源码结构清晰、易扩展... 查看详情
博客园美化教程大集合（超详细，看这篇就够了）(代码片段)
阅读目录： 1. 前言 2.定制自己的博客0.美化整体效果1.准备工作2.自定义个性化导航栏3.添加顶部博主信息4.添加顶部滚动公告5.为博客文章添加目录导航6.添加分享功能按键7.定制推荐和反对按键的炫酷样式8.添加快速... 查看详情
博客园美化操作(代码片段)
之所以写这篇文章的原因了主要就是博客园的默认样式太单一，而且很多人都在用，就想与众不同一样，不做大多数 准备工作想要美化自己的博客园默认界面，首先需要申请js权限 步入正题当你的这一步做完之后就可以... 查看详情
博客园细节美化，打磨(代码片段)
原作者感谢@Summertime-Wu巨佬写出这样漂亮简洁的主题，本蒟蒻是在原主题的基础上改的。原主题地址：https://www.cnblogs.com/summertime-wu/p/9356736.html。我的优化添加forkmeongithub角标，节省菜单空间在页首代码中添加了以下内容：<divcla... 查看详情
博客园个人界面美化（初入博客园）(代码片段)
刚入博客园，小白也要有一个“高大上”的个人博客页面啊，鼓捣了一下午，感觉自己棒棒的，叉腰得瑟个人感觉Simple的主页样式很美观，大气，哈哈首先，在博客园后台管理的设置里，申请js代码的权限（默认是没有打... 查看详情
博客园界面美化(代码片段)
博客园界面美化0x00.写在前面皮肤作者：@SevenNight皮肤作者博客：SevenNight修改人：@Ryanjie修改人：Ryanjie前几天无意之中看到了一款特别好看（每个人的眼光都不一样）的博客皮肤“verdant”，皮肤的作者是@SevenNight。当时感觉这款... 查看详情
博客园的美化(代码片段)
前言第一次写博客想从美化页面开始。页首html代码这里引入的是来自https://www.cnblogs.com/jingmoxukong/p/7826982.html的css文件1<!--自定制样式文件-->2<linkrel="stylesheet"href="https://files.cnblogs.com/files/jingmoxukong/cnblog.min.cs 查看详情
博客园美化(代码片段)
闲着没事对博客皮肤做了些美化，主要是css，js写了些小功能css部分：整体采用蓝色简洁风，有些部分我不用，所以没优化，比如标签，日历，相册，头部固定在顶部，侧边栏固定250px;右边内容主体自适应，支持，收藏和关注按... 查看详情
美化博客园(代码片段)
设置与我联系侧边栏公告代码<atarget="_blank"href="http://wpa.qq.com/msgrd?v=3&uin=xxxxxxxxxxx&site=qq&menu=yes"> <imgalign="absmiddle"border="0"src="http://wpa.qq.com/pa?p=2:xxxxxx 查看详情
[博客美化]博客园syntaxhighlighter代码高亮(代码片段)
...ndowsLiveWriter/OpenLiveWriter代码着色太繁琐了，仅仅为了实现博客代码着色功能就要下载新软件和搞一堆配置。Win10用户只能使用OpenLiveWriter。Web端能干的事干嘛多搞功夫。如果不愿意网页登陆账号只想通过OLW软件编辑全文并且发布... 查看详情
博客园美化-darkgreentrip(代码片段)
1、第一步，样式的形成与博客皮肤的选择有很大关系本文选择darkgreentrip2、代码插入2.1页面定制CSS代码```Objective-C#homemargin:0auto;width:95%;/原始65/min-width:980px;/页面顶部的宽度/background-color:rgba(245,245,245,0.7);padding:30px;margin-top:0px; 查看详情
纯css打造bilibili样式博客主题
...，我都在思考如何减少不必要的JS代码，仅通过CSS来实现博客园主题美化。CSS有很多魔法代码，例如:before，iconfont，order，等等，利用好这些技巧，也能实现很好美化效果。这一次带来的是仿制BiliBli制作的纯CSS博客园主题，希望... 查看详情
博客园美化(代码片段)
侧栏字体更改1.catListTitle2font-weight:bold;3line-height:1.2;4margin-top:21px;5margin-bottom:10.5px;6border-left:10pxsolid#008000;7padding:10px010px14px;8text-align:left;9font-family:微软雅黑;1011#profile_blo 查看详情
博客园美化代码备份(代码片段)
#Header1_HeaderTitlefont-family:"华文行楷";font-size:62px;font-weight:bold;padding-top:15px;padding-bottom:5px;padding-left:20px;padding-right:0px;text-align:center;Header2_HeaderTitlefont-fa 查看详情