博客园-->设置
通过“设置”可以使用JavaScript、CSS、HTML对博客进行个性化设置。主要包括“页面定制CSS代码”、“博客侧边栏公告”、“页首Html代码”和“页脚Html代码”。
页面定制CSS代码
主要配置都是在这里执行。先选取一个基础模板，我选择的是SimpleMemory。
下面是我的个性化页面定制CSS代码：
说明
- 可以通过浏览器自带的调试工具（F12），查看想要调整的元素的具体样式，获取到css的id或者class，再在“页面定制CSS代码”中添加想要修改的样式
- 如果修改的样式不生效，可以先通过调试工具查看，当前元素应用的CSS样式在哪个配置文件中，再根据情况修改，可以通过在样式后面添加"!important"提高自己添加的样式的优先级
- 如果看到喜欢的博客园模板样式，可以通过右键->源代码：注意有一句： 类似这个样子的css引用。其中skins/xxx，xxx就是模板名
- 超链接的hover样式在有的调试工具中无法直接查看，需要注意，如果修改了a:hover没有生效，要注意检查样式文件中hover样式的优先级
博客侧边栏公告
在该部分可以编辑侧边栏。
此处可以使用统计工具网站（需要注册），直接将生成的代码复制到此处。
<div align="left">访问次数：<a href="http://www.amazingcounters.com/"><img border="0" src="http://cc.amazingcounters.com/counter.php?i=3223265&c=9670108" alt="AmazingCounters.com"></a></div>也可以添加一些超链接，如“管理页面”
<div align="left"><a href="https://i.cnblogs.com/Configure.aspx">博客管理</a></div>说明
- 该模块需要申请（支持JS代码）权限，一般一天左右可以通过审核
- 可以将网站的说明等信息都写在此处
页首Html代码
在该模块，添加了文章目录自动生成的脚本，以及通过JS自定义了导航栏。
<!--引入js库，用于实现文章自动生成目录索引begin-->
<link type="text/css" rel="stylesheet" href="http://files.cnblogs.com/files/miangao/maodian.css">
<script src="http://files.cnblogs.com/files/miangao/maodian.js"></script>
<script src="http://files.cnblogs.com/files/miangao/bootstrap.min.js"></script>
<!--引入js库，用于实现文章自动生成目录索引end-->
<script>
/*通过选项，去除控件失效，直接根据id移除*/
$(function(){
$("a").remove("#blog_nav_admin"); /*删除管理栏目*/
$("div").remove("#sidebar_links1226849"); /*删除侧边栏链接*/
$("div").remove("#sidebar_postarchive"); /*删除随笔档案*/
//添加导航，直接复制下面一行，修改链接和文字
$("#navList").append('<li><a id="liuyan" class="menu" rel="nofollow" href="http://www.cnblogs.com/z00377750/">首页</a></li>');
});
</script>说明
- 博客园自带的“选项”可以进行一些基本的个性化配置，但是有时候不是完全生效。如导航栏的“管理”项，这时，可以先通过浏览器调式工具找到对应标签的id，通过js脚本的remove动作予以去除。
- 该生成文章目录的插件有一点瑕疵，在个人首页上，往下拖动时也会出现一个空白的索引，影响美观，希望后续可以优化。
##博客园-->选项
选项中提供了基本的个性化配置
参考列表：
① 为自己的博客园添加目录锚点和返回顶部
② 博客园博客美化相关文章目录
③ 如何自定义博客园代码高亮主题，同时分享自己使用的黑色主题
④ 博客园自定义样式