SimpleMemory主题美化

先看下效果


一、开通博客园JS权限

注册账号后,进入管理>设置>勾选下面的JS权限,然后填写一下开通的理由等待管理员进行审核通过。

我这已经开通了,如下:

二、选择模板

在模板中选择初始的博客皮肤:(本博客搭建的主题,就需要使用SimpleMemory)

三、下载SimpleMemory主题资源

主题资源地址:https://github.com/BNDong/Cnblogs-Theme-SimpleMemory

四、开始美化

1. 把下载完的资源中dist文件夹中的simpleMemory.css中的内容复制到页面定制CSS代码


2. 设置主题侧边栏 —此处展示自用的侧边栏样式

把下载完的Cnblogs-Theme-SimpleMemory中的src>博客侧边栏.html中的内容复制到博客侧边栏公告

3. 不要勾选代码高亮中的行号

4. 点击保存

5. 最后在选项中勾选公告

到这里基本美化就完成了 ~~~///(^v^)\\\~~~

接下来就加上一个悬挂物件和看板娘

下面参考了ProsperousEnding这位博主的美化博客的文章

原文连接:
https://www.cnblogs.com/ProsperousEnding/articles/16595150.html

6.悬挂猫-在首页html添加

<!-- 悬挂的喵 -->
<script type="text/javascript" src="https://blog-static.cnblogs.com/files/fsh001/szgotop.js"></script>
<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/fsh001/szgotop.css" />
<div class="back-to-top cd-top faa-float animated cd-is-visible" style="top: -999px;"></div>

7.看板娘

  1. 在css中添加
/* 看板娘 */
#live2dcanvas {border: 0 !important;
}
  1. 在侧边栏中添加
<script type="text/javascript">L2Dwidget.init({"model": {//模型为初音jsonPath: "https://unpkg.com/live2d-widget-model-hijiki@1.0.5/assets/hijiki.model.json","scale": 1},"display": {"superSample": 2,"width": 250,"height": 400,"position": "right","hOffset": 110,"vOffset": -30},"mobile": {"show": true,},"react": {"opacityDefault": 1,//不透明度,可调"opacityOnHover": 0.2}});
</script>
<!--
其他可选的模型:
初音未来:https://unpkg.com/live2d-widget-model-miku@1.0.5/assets/miku.model.json
黑猫:https://unpkg.com/live2d-widget-model-hijiki@1.0.5/assets/hijiki.model.json
萌娘:https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json
白猫:https://unpkg.com/live2d-widget-model-tororo@1.0.5/assets/tororo.model.json
狗狗:https://unpkg.com/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json
小可爱:https://unpkg.com/live2d-widget-model-z16@1.0.5/assets/z16.model.json
小可爱:https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json
-->
  1. 最后在页面首页html添加
<!-- 看板娘模型 -->
<script type="text/javascript" charset="utf-8"  src="https://files.cnblogs.com/files/liuzhou1/L2Dwidget.0.min.js"></script>
<script type="text/javascript" charset="utf-8"  src="https://files.cnblogs.com/files/liuzhou1/L2Dwidget.min.js"></script>

这样就有了蓝板娘和悬挂猫了

最后,这些都可以自己设置,本质还是html和js

博客园SimpleMemory主题美化相关推荐

  1. python博客主题_博客园SimpleMemary主题美化教程

    修改cnblogs的主题为SimpleMemary 我的博客->设置->博客皮肤->SimpleMemary 编辑CSS 打开下面的地址,将样式代码粘贴到页面定制CSS框内 http ...

  2. 博客园SimpleMemory皮肤的页面美化--感谢BNDong大佬

    1. 前言说明 本博客的博皮样式设计者是BNDong大神,在此表示衷心的感谢!为了让更多人的博客园更加的美观大方,本人特此参考设计者BNDong关于博客样式的文章,写了这更加通俗易懂的文章,让更多喜欢 ...

  3. 博客园美化(10)博客园 SimpleMemory 博客皮肤设置(简单简洁)

    之前调整了两个样式的,好看是好看,用着不方便,把不需要的全都删掉了 样式效果就是现在的 使用方法 一.开通博客园的JS权限 管理>设置>勾选JS权限,等待审核通过. 二.选择模板 JS权限 ...

  4. html%3c arial%3e,【博客园】样式美化+网站统计访问+添加网易云背景音乐

    该样式对应的皮肤:SimpleMemory,请记得更换. 还有目录生成代码默认是生成h2,h3的,需结合自己的需要替换为h1,h2的. 我参考别人的教程,对博客园样式做了修改.后来忽然被原创发消息:说 ...

  5. 个人博客园CSS样式美化

    博客侧边栏公告 <!--公告栏时钟控件--> <embedwmode="transparent"src="https://files.cnblogs.c ...

  6. 博客园自定义主题样式

    题记 对于有强迫症的童鞋来说,一个长得不美观或者不能满足我们日常的审美需求的页面,总会有想要改造它的冲动,好吧,让我们来调试下博客园提供的默认主题样式,让页面更加清爽宜人,简洁大气. Section ...

  7. 博客园kubrick主题

    http://www.cnblogs.com/SkinUser.aspx?SkinName=kubrick [名称]kubrick [标题]kubrick [发布日期]2007/1/1 0:00:00 ...

  8. 博客园自定义主题 皮肤

    https://www.cnblogs.com/jingmoxukong/p/7826982.html?utm_source=gold_browser_extension 我是参考的这个博主,取舍一些 ...

  9. 博客园自定义主题代码

    发一下好看的 要开通js权限 , 皮肤用simple memory , 最好禁用模板 侧边栏: <!DOCTYPE html> <html> <style> /*最 ...

最新文章

  1. 使用Python查询国内 COVID-19 疫情
  2. SQL中删除重复的行(重复数据),只保留一行 转
  3. 20145313张雪纯《信息安全系统设计基础》第11周学习总结
  4. CStringArray 字符串数组的使用 以及调试时怎么Dump出其中的内容
  5. 宁德时代机器人编程开发_高通发布5G机器人开发平台,内置强大AI算力。各大厂商竞相发布机器人处理平台,万物互联的时代即将到来...
  6. matlab 0到正无穷求和,1/k!k从0到无穷求和是多少
  7. vue 第六天(条件判断)
  8. python 批量提取 mkv 视频文件内嵌 srt 字幕
  9. 传智播客黑马程序员_Hanselminutes播客48-适用于极客和程序员的入门棋盘游戏
  10. 基于 vue+JsPlumb 实现大数据流水线拓展流程工作台(vue-flow-topology)
  11. VMware Esxi 下载地址
  12. 有关微信小程序云数据库修改数据的坑
  13. Android 复制 粘贴 剪贴板的使用 ClipboardManager
  14. 解析淘口令获取商品id,包含有效时间
  15. STM32_SPI通信_与传感器芯片通信的SPI优化之路
  16. 疫情已经结束,快递行业现状如何
  17. python实现图像差异性分析(标记并记录差异点)
  18. 真爱如血第七季/全集True Blood迅雷下载
  19. PC 机与单片机通信(RS232 协议)
  20. layui提交成功之后刷新当前页、关闭当前页、刷新父页、重载父页数据表格

热门文章

  1. 我们成功给OpenCV添加了三维点云降采样算法!
  2. DirectX11 输入设备——DirectInput检测鼠标、键盘状态
  3. 从零搭建一个机器人仿真的平台
  4. 2023最新SSM计算机毕业设计选题大全(附源码+LW)之java基于java的中小企业物料需求计划管理系统wiik1
  5. 什么东西改善睡眠最有效,促进睡眠的东西推荐
  6. VSCode 跳转到函数定义及跳转回之前的位置
  7. vue单页面 回退页面 keeplive 缓存问题
  8. GeoServer发布ArcMap配图
  9. JSP/Servlet工作原理
  10. Axure中如何引入自定义javascript