博客园主题设置

博客园主题

有童靴问我的博客园主题如何设置的，我的主题也是从别的博主那获得的，但是时间已经过去很久了，我已经忘记那个博主的博客地址
特此记录一下我的设置，仅供大家参考

1、博客皮肤

博客皮肤 ： SimpleMemory
同时需要开通JS权限

2、博客侧边栏公告

<script src="https://guangzan.gitee.io/awescnb/index.js"></script>
<script>
  $.awesCnb({
    theme: {
      name: 'geek',
     
      avatar: '{头像的地址}',
       headerBackground: 'https://i.ibb.co/pJnrPdH/350.jpg',
      
   },
 
   signature: {
    enable: true,
    contents: [
   "欢迎来到Neo的个人站",
    ],
},  
 
    tools: {
        enable: true,
        initialOpen: true,
        draggable: false,
    },
 
notice:{
    enable:true,
    text:['你好'],
},
 
lock: {
    enable: true,
    background: 'https://pic.cnblogs.com/avatar/2165871/20210221123040.png',
    strings: [
        '<i>Powered by</i> webpack.',
        '&amp; Theme in awescnb',
        '你好',
    ],
 
},
 
github: {
    enable: true,
    color: '#ffb3cc',
    url: ' {你的github地址}',
},
 
gitee: {
    enable: true,
    color: '#C71D23',
    url: '{你的gitee地址}',
},
highLight: {
    dark: 'atomOneDark',
    light: 'atomOneLight',
},
lineNumbers: {
    enable: true,
},
 
catalog: {
    enable: true,
    position: 'left',
},
topProgress: {
        enable: true,
        page: 'all',
        agent: 'pc',
        background: '#FFB3CC',
        height: '5px',
    },
darkMode: {
    enable: true,
    autoDark: false,
    autoLight: true,
},
click: {
    enable: false,
    auto: false,
    colors: ['#FF1461', '#18FF92', '#5A87FF', '#FBF38C'],
    size: 30,
    maxCount: 50,
},
live2d: {
    enable: false,
    page: 'all',
    agent: 'pc',
    model: 'tororo',
    width: 150,
    height: 200,
    position: 'left',
    gap: 'default',
},
 
 
 
  })
</script>

3、页面订制CSS代码

勾选禁用模板默认CSS

@keyframes spin3D {
    from {
        transform: rotate3d(0.5, 0.5, 0.5, 360deg);
    }
    to {
        transform: rotate3d(0deg);
    }
}
#loading {
    height: 100%;
    background-color: #1d2630;
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 99999999;
}
.spinner-box {
    width: 300px;
    height: 300px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: transparent;
}
.leo {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}
.blue-orbit {
    width: 165px;
    height: 165px;
    border: 1px solid #91daffa5;
    animation: spin3D 3s linear 0.2s infinite;
}
.green-orbit {
    width: 120px;
    height: 120px;
    border: 1px solid #91ffbfa5;
    animation: spin3D 2s linear 0s infinite;
}
.red-orbit {
    width: 90px;
    height: 90px;
    border: 1px solid #ffca91a5;
    animation: spin3D 1s linear 0s infinite;
}
.white-orbit {
    width: 60px;
    height: 60px;
    border: 2px solid #fff;
    animation: spin3D 10s linear 0s infinite;
}
.w1 {
    transform: rotate3D(1, 1, 1, 90deg);
}
.w2 {
    transform: rotate3D(1, 2, 0.5, 90deg);
}
.w3 {
    transform: rotate3D(0.5, 1, 2, 90deg);
}
 

4、页首html代码

<div id="loading">
    <div class="spinner-box">
        <div class="blue-orbit leo"></div>
        <div class="green-orbit leo"></div>
        <div class="red-orbit leo"></div>
        <div class="white-orbit w1 leo"></div>
        <div class="white-orbit w2 leo"></div>
        <div class="white-orbit w3 leo"></div>
    </div>
</div>

5、页脚html代码

留空

END