Hello！博客&美化博客园主题

前言

无奈本人才疏学浅，又常常言帚忘笤，故创建此博客把一些折腾过的项目放在这里，做个记录。若有幸您看见了我的博客，不妥之处还望斧正。

由于博客园自带的主题都不怎么合胃口。于是，在百度上，发现了这个主题，并进行了更换。作为开博以来第一个折腾的项目，我觉得还是可以尝试记录一下的。

阅读文档

首先，奉上BNDong大佬该项目的GitHub，BNDong大佬该项目的博客园地址和该主题的说明书。在做事之前看一眼说明书是一个好习惯。

修改主题

参照BNDong大佬的步骤。

选择主题

选择博客皮肤SimpleMemory。

申请js权限

大概15min~2h才能通过审核。

粘贴 CSS 代码

在BNDong大佬的GitHub中，点击master，选择Tags，点击最新版。在下面的文件中，点击src选择style，复制base.min.css里面的内容(若需要修改则参照base.css进行修改)。

禁用模板默认css

开启公告

在博客园后台选项中开启公告

主题设置代码

代码填在这个下面的框框里。

要填写的代码

<script type="text/javascript">
    window.cnblogsConfig = {
    	//基础代码
        GhVersions    : 'v1.3.1', // 版本
        blogUser      : "userName", // 用户名
        blogAvatar    : "https://xxxx.png", // 用户头像
        blogStartDate : "2016-11-17", 
        	// 入园时间,年-月-日。入园时间查看方法：鼠标停留园龄时间上,会显示入园时间
        //基础代码
        
        //主页顶部
        homeTopImg    : [ //主页顶部图片可以是多张也可以单张,多张的话可以刷新改变
            "https://x1.jpg",
            "https://x2.jpg",
            "https://x3.jpg",
        ],
        homeBannerText: "好好学习,天天向上！", //主页顶部标语可固定
		homeBannerTextType: "one", //主页顶部标语也可自动获取随机刷新一句古诗词
        //主页顶部
        
        //主题仓库
        GhUserName: 'BNDong', //GitHub用户名
        GhRepositories: 'Cnblogs-Theme-SimpleMemory', //主题仓库名字
        //主题仓库
        
        //焦点与顶部title的标签
        webpageTitleOnblur: '(oﾟvﾟ)ノ Hi', //失去焦点时title的标签
        webpageTitleOnblurTimeOut: 500, //失去焦点,页面title变化的延时时间,单位毫秒
        webpageTitleFocus: '(*´∇｀*) 欢迎回来！',//获取焦点时title的标签
        webpageTitleFocusTimeOut: 1000, //获得焦点,页面title变化的延时时间,单位毫秒
        //焦点与顶部title的标签
        
        //网站图标
        webpageIcon: "https://xxx", //替换博客园title的小人
        //网站图标
        
        //日夜模式
        enable: true,       // 是否开启日/夜间模式切换按钮
    	auto: {             // 自动切换相关配置
        	enable: false,  // 开启自动切换
        	dayHour: 5,     // 日间模式开始时间,整数型,24小时制
        	nightHour: 19   // 夜间模式开始时间,整数型,24小时制
    	}
        //日夜模式
        
        //字体图标库扩展Css的Url
        fontIconExtend: "//at.alicdn.com/t/font_xxxxxxxxxx.css",
        //字体图标库扩展Css的Url
          
    	//菜单个人信息背景图片
    	menuUserInfoBgImg: 'https://xxx,jpg',
    	//菜单个人信息背景图片
 
    	//进度条颜色配置
    	progressBar: {
    		color   : '#77b6ff',
    	}
    	//进度条颜色配置
    
    	//页面加载loading
    	loading: {
        	rebound: {
             	tension: 16,
         	},
         	spinner: {
				id: 'spinner',
             	radius: 90,
			}
    	},
    	//页面加载loading    
            
    	//渲染banner动效
    	homeTopAnimationRendered: true, //是否渲染主页banner动效
		homeTopAnimation: {
			color   : 'random', //随机切换颜色
		},
    
		essayTopAnimationRendered: true, //渲染文章页动效
		essayTopAnimation: {
        	triW : 14, //宽度（我猜的）
        	triH : 20, //高度（我猜的）
    	},
        
    	bgAnimationRendered: true, //渲染页面背景动效    
    	backgroundAnimation: {
        	colorSaturation: "60%", //颜色饱和度（我猜的）
        	colorBrightness: "50%", //颜色亮度（我猜的）      
    	},
		//渲染banner动效
        
        //文章页
        essayTopImg: [ //文章页顶部图片 
        "https://xxx",
        "https://xxx"
    	],
        	//文章后缀    
        codeImgUrl   : '', // >= v1.1.5 左侧图片设置,不配置使window.cnblogsConfig.blogAvatar
    	aboutHtml    : '', // 关于博主,不配置使用默认
    	copyrightHtml: '', // 版权声明,不配置使用默认
    	supportHtml  : '', // 声援博主,不配置使用默认    
        //文章页
        
		//打赏 
		enable: false, // 是否开启打赏功能
    	wechatpay: '', // 微信支付二维码图片URL
    	alipay: '' // 支付宝支付二维码图片URL
        //打赏    
        
        //代码    
        codeMaxHeight: true, //限制代码框的最大高度
        codeLineNumber: true, //渲染代码行号
        essayCode: {
        	fontSize: "16px", //代码框字体
    	},
        essayCodeHighlightingType: "cnblogs", //博客园代码高亮样式
        
		//essayCodeHighlightingType: "highlightjs", //highlightjs渲染
        //essayCodeHighlighting: "xxx", //highlightjs渲染模式
            
        //essayCodeHighlightingType: "prettify", //prettify渲染
        //essayCodeHighlighting: "xxx", //prettify渲染模式        
        //代码    
        
        //页脚样式
        footerStyle: 2,
        iconFont: {  // v1.3.0 新增配置
        	icon:  "icon-xl", // iconfont 图标名称
        	color: "red",     // 图标颜色
        	fontSize: "16px"  // 图标大小
    	},
    	bottomText: {
        	left : "好好学习",
        	right: "天天向上",
        },
            
        bottomBlogroll: [ // 友情链接,[[链接名,链接]....]
        	["申请坑位", 'https://xxx'],
        	["申请坑位", 'https://xxx'],
        	["申请坑位", 'https://xxx'],
        	["申请坑位", 'https://xxx'],
        	["申请坑位", 'https://xxx'],
    	],    
        //页脚样式
        
        //控制台
		consoleList: [
			['xxx CNBlogs', 'https://xxx'],
			['xxx GitHub', 'https://xxx'],
			['xxx Email', 'xxx@xxx.com'],
		],
        //控制台
        
		//广告
         advertising: true,
        //广告
        
		//版本映射
		
		//版本映射
		isVersionMapping: true,
        //菜单配置
        menuCustomList: {
        	"title1": { // 标题
            	"data": [ // 列表数据 ['列表', '链接']
                	['我的博客1', 'https://www.cnblogs.com/bndong/'],
                	['我的博客2', 'https://www.cnblogs.com/bndong/'],
               		['我的博客3', 'https://www.cnblogs.com/bndong/'],
                	['我的博客4', 'https://www.cnblogs.com/bndong/'],
                	['我的博客5', 'https://www.cnblogs.com/bndong/'],
            	],
            	"icon": "icon-brush_fill", // 配置图标,参考文档：定制化/字体图标库
        	},
        
        	"title2": { // 标题
            	"data": [ // 列表数据 ['列表', '链接']
                	['我的博客6', 'https://xxx'],
                	['我的博客7', 'https://xxx'],
                	['我的博客8', 'https://xxx'],
                	['我的博客9', 'https://xxx'],
                	['我的博客10', 'https://xxx'],
            	],
            	"icon": "icon-brush_fill", // 配置图标,参考文档：定制化/字体图标库
        	},
    	},
        //菜单配置
        
        //自定义菜单导航
		menuNavList: [ // 列表数据 ['导航名称', '链接']
       		['我的博客1', 'https://xxx'],
        	['我的博客2', 'https://xxx'],
    	],
    	//自定义菜单导航
    }
</script>
<script src="https://cdn.jsdelivr.net/gh/BNDong/Cnblogs-Theme-SimpleMemory@v1.3.1/src/script/simpleMemory.min.js"></script>

关于图片

在博客园后台创建的相册里面上传图片，点击图片，然后右键复制图片地址。

创建相册

点击上传好的图片

右键获取图片地址

感谢

非常感谢BNDong大佬提供的主题，让我这样的小白也能创建了如此赏心悦目的博客。如果有幸您看见这篇博客，还望去BNDong大佬的博客页面和GitHub页面点一下star，这篇博客仅作为我更换博客主题过程的记录。再次奉上BNDong大佬该项目的GitHub以及BNDong大佬该项目的博客园地址。