主题所有配置项速查 | 一款简洁.美观.功能强大的vuepress主题

TIP

主题从V1.3.2版本之后，就对页面进行重大改变，将主题配置移到docs/.vuepress/config.js内，并且加入了多种功能，如自动生成文章目录，侧边栏等效果...

以下配置，没有特殊说明都是在docs/.vuepress/config.js ---> themeConfig内进行配置

必读

主题问题解决
部署

推荐阅读

主题增加新组件，新页面
修改主题默认样式
主题目录结构
主题写作技巧
主题bug
更新日志

环境安装

node安装教程

V1.12.xxx版本新增配置v1.12.xxx

homeTopText

String
首页置顶文字

sidebarDesc

String
侧边栏一句话描述

V1.11.xxx版本新增配置v1.11.xxx

afDianUrl

String
你的爱发电个人页面url，例如

randomSayApi

Object
随机一言接口，请注意，一定要保证该接口直接返回Text文本，一定要保证该接口直接返回Text文本，而不是返回json

实例

module.exports = {
    themeConfig: {
        //随机一言接口，请注意，一定要保证该接口直接返回Text文本，一定要保证该接口直接返回Text文本，而不是返回json
        randomSayApi: {
            method: 'GET',
            urlApi: 'https://v1.hitokoto.cn/?encode=text&c=a'
        },
    }
}

1
2
3
4
5
6
7
8
9

WARNING

请注意，如果你需要使用自己的随机一言接口，那么请确保该接口访问能够直接返回text文本，而不是json格式或者其他格式的对象

推荐使用hitokoto的随机一言接口

method

String
该随机一言接口请求方法

urlApi

String
随机一言api
如https://v1.hitokoto.cn/?encode=text&c=a

V1.10.xxx版本新增配置v1.10.xxx

该版本未有新增配置

V1.9.xxx版本新增配置v1.9.xxx

showPageMeta

Boolean
这是v1.9.0新增加的功能是否在文章页底部显示最后更新时间，贡献者，点击编辑,默认显示

V1.8.xxx版本增加配置新版本v1.8.xxx

showRecommend

Boolean

是否在文章页面展示文章推荐默认展示

articlePagination

Boolean

是否在文章页面展示下一页，上一页，默认展示

excludeTagv1.8.0已被移除

从v1.8.0之后，被移除，改用excludePath

excludePath

Array

在统计文章，标签，类别的时候，需要排除的路径，只针对于根目录下的路径
主题内置已经排除了以下path
['/','/about/','/mood/','/link/','/tag/','/archive/','/photo/','/aurora-coze/','/aurora-register/','/aurora-archive/','/aurora-music/','/404.html']，所以你如果想要排除的path在上面有，那么就不需要加入

点击查看图片

假如目前配置的为excludePath: ['/footer.html','/v1.3.0/','/plugin/']，文档的目录是上图那样，那么在根路径下(根路径就是md文件直接放在docs目录下)的footer.md会被直接排除，你不会在首页和tag页面看到该文章

TIP

因为该排出是通过准确匹配文章的URI进行排除的，只能排除通过localhost:[8080]/xxxx.html或者localhost:[8080]/v1.3.0/进行访问的md文件

如果你有一个README.md文件，位置为docs/v1.3.0/README.md或者docs/v1.3.0/readme.md，那么这个readme.md文件可以直接/v1.3.0/或者/v1.3.0/readme.html(会被重定向到/v1.3.0/)或者/v1.3.0/index.html(会被重定向到/v1.3.0/)进行访问，所以该配置项只支持排除放在docs目录下或者在docs的子文件夹中的readme.md或者README.md文件

记住所有文件名为readme.md或者README.md的文件，都可以直接通过XXX/进行访问

这里的XXX/并不是你在浏览器中输入localhost:[8080]/XXX/....

wave

showWave

Boolean

是否在首页展示波浪效果

code

wave: {
    showWave: true
}

1
2
3

bubble

Object

主题气泡配置项，该项只会影响顶部图片那里的气泡

view picture

showbubble下的配置项

Boolean

是否在顶部图片中显示气泡效果

bubbleNumber推荐0-1之间小数,不能为0

Number

气泡数量推荐0(不包括)到1之前的小数，

bubbleAlpha推荐0-1之间小数,不能为0

Number

气泡透明度 0到1之间的小数

alphaChangeSpeed越接近于0越好,不能为0

Number

透明度变化速度，越接近于0越好

size推荐0-1之间小数,不能为0

Number

气泡大小，推荐0到1之间的值

sizeChangeSpeed越接近于0越好,不能为0

Number

气泡大小变化速度越小越好

riseSpeed推荐0-1之间小数,不能为0

Number

气泡上升速度

color

String

气泡颜色，如果你想要设置为白色rgb(255,255,255)，那么这里需要传入请传入255,255,255

新版本v1.3.2-v1.6.2

TIP

这部分的配置是从v1.3.2到v1.6.2版本新增或者修改的配置项

sidebarAvatarv1.6.2

String

侧边栏头像，如果此项为undefine,那么将使用heroImg

原来

{
    text: '快速开始',
    link: '/readme/',
},
{
    text: "所有配置",
    link: '/home/config.html',
},

1
2
3
4
5
6
7
8

现在

{
    text: '快速开始',
    link: '/readme/',
    iconClass: 'aurora-0023pacman'
},
{
    text: "所有配置",
    link: '/home/config.html',
    iconClass: 'aurora-link'
},

1
2
3
4
5
6
7
8
9
10

新增自定义顶部导航栏icon图标

自定义导航栏的图标请查看自定义图标

about增加对html的支持

关于页面

about: [
    {
        bar: false,
        title: "我?",
        describe: [
            "这是关于页面支持html<a href='https://blog.cco.vin' target='_blank'>这是一个标签</a>",
            "目前是一名大三学生,CS专业,坐标西南边陲"
        ],
    }
    }

1
2
3
4
5
6
7
8
9
10

TIP

可以在describe中，写入html

friendLinks发生重大修改，影响运行

以前

friendLinks: [
    {
        //网站标题
        title: "XI溪",

        //站点链接
        url: "http://www.xiaoxuya.top",

        //站点logo
        logo: "https://www.xiaoxuya.top/img/logo.png",

        //站点描述
        describe: "人生若只是初见,何事秋风悲画扇",
    },
    {
        title: "左眼会陪右眼哭の博客",
        url: "http://qkongtao.cn/",
        logo: "http://qiniu.qkongtao.cn/2020/12/d11-e1628358435552.png",
        describe: "干嘛这么想不开，要在脸上贴个输字！",
    }
],

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

现在

friendLinks: [
    {
        title: '我的朋友',
        links: [
            {
                title: "xxx",
                url: "xxx",
                logo: "xxx",
                describe: "xxx",
                cover: 'xxx'
            }
        ]
    },
    {
        title: '大佬',
        links: [
            {
                title: "xxx",
                url: "xxx",
                logo: "xxx",
                describe: "xxx",
                cover: 'xxx'
            }
        ]
    },
    {
        title: '小伙伴',
        links: [
            {
                title: "xxx",
                url: "xxx",
                logo: "xxx",
                describe: "xxx",
                cover: 'xxx'
            },
        ]
    },
],

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38

TIP

以前友情链接页面，只能配置一个模块，也就是我的朋友，现在支持配置多个模块，friendLinks是一个数组对象，效果请查看配置之后的效果，友情链接地址/link

coverv1.6.0

String

配置友情链接的封面，如果没有指定，那么默认是白色背景

view

{
    title: "xxx",
    url: "xxx",
    logo: "xxx",
    describe: "xxx",
    cover: 'https://ooszy.cco.vin/img/blog-note/image-20211111084654046.png?x-oss-process=style/pictureProcess1'
}

1
2
3
4
5
6
7

siteInformationv1.6.0 发生更改

以前

siteInformation: {
    //站点标题
    title: "qsyyke",

    //自己站点链接
    url: "https://www.cco.vin",

    //自己站点logo
    logo: "https://ooszy.cco.vin/img/blog-public/avatar.jpg",

    //自己站点描述
    describe: "I do not follow,i lives is always all you want",

    //自己的头像
    email: "cqycco@gmail.com",
},

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

现在

siteInformation: {
    //站点标题
    title: "Aurora-theme",

    //自己站点链接
    url: "https://aurora.cco.vin",

    //自己站点logo
    logo: "https://ooszy.cco.vin/img/ico/yuan.png",

    //自己站点描述
    describe: "vuepress-theme-Aurora是一款简洁，美观，功能强大的静态主题",
    cover: 'https://ooszy.cco.vin/img/blog-note/image-20211106100103898.png?x-oss-process=style/pictureProcess1',

    //自己的头像
    contact: "email: cqycco@gmail.com, qq:2291308094",
    otherDescribe: [
        '申请友链请按照下面格式，在此页面留言，我看到就会进行添加',
        '博客名称    博客地址      博客描述      博客logo',
        '友链申请要求',
        '拒绝涉政/涉黄/太多广告/盈利性站点',
        '站点能正常访问',
        '这是一个html的测试<a href="https://blog.cco.vin" target="_blank">这是一个a标签</a>'
    ]
},

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

contactv1.6.0 新增

String

在自己的站点信息处，添加联系方式如
contact: "email: cqycco@gmail.com, qq:2291308094"
展示为//email: cqycco@gmail.com, qq:2291308094
contact: "如果几天我还未添加你站点，请联系我qq2291308094"
展示为//如果几天我还未添加你站点，请联系我qq2291308094

展示效果

otherDescribev1.6.0 新增

Array

自己站点的其他描述，主要是添加一些添加友联的要求，里面的每一个都支持html

view

siteInformation: {
    //站点标题
    title: "Aurora-theme",

    //自己站点链接
    url: "https://aurora.cco.vin",

    //自己站点logo
    logo: "https://ooszy.cco.vin/img/ico/yuan.png",

    //自己站点描述
    describe: "vuepress-theme-Aurora是一款简洁，美观，功能强大的静态主题",
    cover: 'https://ooszy.cco.vin/img/blog-note/image-20211106100103898.png?x-oss-process=style/pictureProcess1',

    //自己的头像
    contact: "email: cqycco@gmail.com, qq:2291308094",
    otherDescribe: [
        '申请友链请按照下面格式，在此页面留言，我看到就会进行添加',
        '博客名称    博客地址      博客描述      博客logo',
        '友链申请要求',
        '拒绝涉政/涉黄/太多广告/盈利性站点',
        '站点能正常访问',
        '这是一个html的测试<a href="https://blog.cco.vin" target="_blank">这是一个a标签</a>'
    ]
},

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

messagev1.6.0 html支持

message: [
    '该博客主题为Aurora,<a href="https://github.com/qsyyke/vuepress-theme-aurora">vuepress-theme-Aurora</a>',
    "主题交流群: 681602026，欢迎各位大佬进群交流",
]

1
2
3
4

showMoodEditv1.6.0 被移除

addMoodv1.6.0 被移除

showOnlineMoodv1.6.0 被移除

articleH2Iconv1.6.0 新增

String

二级标签的前面图标，默认🌸,请从emoji-cheat-sheet直接复制

articleH3Iconv1.6.0 新增

String

三级标签的前面图标，默认🐳,请从emoji-cheat-sheet直接复制

articleH4Iconv1.6.0 新增

String

四级标签以四级标签之后的前面图标，默认⛄,请从emoji-cheat-sheet直接复制

展示效果

首页

点击查看配置

home

Boolean

true为首页，false反之
此项在docs/readme.md内配置，用于设置首页位置

logoColor

String

首页左上角Logo图旁文字颜色

logoTitle

String

左上角，logo旁标题文字

defaultBorderRadius

Number

默认的圆角，传入数字

defaultOpacity

Number

默认的透明度，传入0到1之间的小数，0表示全透明

isHomePageFollow

boolean

首页文章列表透明度是否跟随样式面板改变，true表示跟随，全白色,false表示不跟随

defaultBlur

Number

默认模糊度(0 到 1之间)

showFont

String

圆角等控制面板，字体切换的占位符文字，推荐一个字

faviconIco

String

网站顶部favicon图片链接，如https://ooszy.cco.vin/img/blog-public/ccds_64.ico
v1.3.2移除，改在config.js的head内配置

实例

module.exports = {
    ...
    head: [
        [
            "link",
            {
                href: "https://ooszy.cco.vin/img/ico/yuan.png",
                rel: "icon",
            },
        ],
    ],
}

1
2
3
4
5
6
7
8
9
10
11
12

customRandomSay

Boolean

是否自定义随机一言，true表示不会使用随机一言接口
默认使用的接口为:https://international.v1.hitokoto.cn/?c=b&max_length=45，感谢大佬提供的一言接口

customRandomValue

String

自定义一言文字，只有customRandomSay为true时有效

showHomeMood

Boolean

是否在首页显示心情，true开启，需要设置文字
v1.3.2已移除

mood

String

首页中间，心情文字
v1.3.2已移除

heroLogo

String

首页中间图片链接
v1.3.2已移除

heroImg

String

首页中间图片链接，默认https://ooszy.cco.vin/img/blog-public/avatar.jpg

logo

String

左上角logo图片

cancelIcoHref

String

圆角字体控制面板，取消按钮图片链接
v1.3.2已移除，改用阿里字体图标，如果修改，请f12，修改对应值，组件位置为docs/.vuepress/theme/lib/client/components/child/home/StyleMenu.vue

description

String

首页和非文章页面的description描述文字

keyword

String

首页和非文章页面的keyword，请使用,分割开

slideTime

Number

圆角控制面板，隐藏时间，单位毫秒

randomSaw

String

随机一言接口 https://international.v1.hitokoto.cn/?c=b&max_length=45

randomSawQuery

String

从随机一言接口中，如何获取值，如上面randomSaw接口，输入hitokoto(后续版本会优化此项)

method

String

随机一言请求接口方法

animeOption: { baseURL: https://api.vvhan.com/api/acgimg?type=json, method: get, timeout: 5000, query: imgurl }

isFitter

Boolean

默认是否启用毛玻璃效果，true表示开启

homePageLazyLoadingImg

String

首页文章列表懒加载图片地址

文章

点击查看文章配置

lazyLoadingImg

String

文章懒加载占位符图片链接，如https://ooszy.cco.vin/img/blog-public/ljz.gif

defaultTitleColor

String

文章顶部标题颜色，如#8093f1
v1.3.2已移除

coverUrl

String

首页文章列表图片地址,详细配置说明，请点击此处click me

社交

点击查看社交配置

socials

Array

数组对象

点击查看实例

module.exports = {
   	...
    themeConfig: {
        socials: [
            {
                //社交链接
                aHref: "tencent://message/?uin=2291308094",
                // imgSrc: "https://ooszy.cco.vin/img/ico/qq.svg", 从v1.3.2开始久移除次配置，以前版本用于社交ico图标配置

                //true为在首页显示，反之
                isHome: true,

                //是否显示此社交信息,如果为false，尽管isHome=true，sidebar=true，也不会显示
                show: true,

                //是否在侧边栏显示
                sidebar: true,

                //使用阿里图标 使用的是阿里图标库，我也挑选部分图标，请进入http://ico.cco.vin/theme查看
                symbol: '#icon-qq',

                //鼠标移入此图标时，显示的图片，适用于微信等通过二维码添加好友
                // showImgSrc: "https://ooszy.cco.vin/img/blog-public/wechat.jpg",
            },
            {
                aHref: "javascript:;",
                //imgSrc: /assets/img/ico/wechat.svg,
                showImgSrc: "https://ooszy.cco.vin/img/blog-public/wechat.jpg",
                isHome: true,
                show: true,
                symbol: '#icon-weixin',
                sidebar: true
            },
            {
                aHref: "https://github.com/qsyyke/",
                isHome: true,
                show: true,
                sidebar: true,
                symbol: '#icon-github-fill'
            },
            {
                aHref: "https://stackoverflow.com/",
                isHome: true,
                show: true,
                symbol: '#icon-stackoverflow',
                sidebar: true
            },
            {
                aHref: "https://space.bilibili.com/483962286",
                isHome: true,
                show: true,
                sidebar: true,
                symbol: '#icon-bilibili-1'
            },
            {
                aHref: "https://music.163.com/#/user/home?id=1411050784",
                isHome: true,
                show: true,
                symbol: '#icon-wangyiyunyinle',
                sidebar: true
            },
            {
                aHref: "mailto:2291308094@qq.com",
                isHome: true,
                show: true,
                sidebar: true,
                symbol: '#icon-email'
            }
        ],
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71

aHref

String

社交链接地址

imgSrc

String

社交图片地址
v1.3.2已移除

isHome

Boolean

是否在首页显示，true表示会在首页显示，其他页面也会显示，为false，首页不会显示，其他页面会显示

show

Boolean

是否显示此社交，控制全局

Boolean

是否在侧边栏展示，手机侧边栏无效

symbol

String

社交图标使用的是阿里图标库，目前只添加一些常用彩色图标，后期会添加，图标地址http://aurora-font.cco.vin/

点击查看配置

symbol值就填上面的#aurora-Email，那么社交图标便会使用此图标进行显示

socialMaxLength

Number

社交展示的最大个数

showImgSrc

String

鼠标移动到图标上面，需要显示的图片链接，适用于微信二维码这种

关于页面

点击查看关于页面

about

Array

关于页面数组对象

点击查看实例

module.exports = {

    themeConfig: {
        about: [
            {
                bar: false,
                title: "我?",
                describe: [
                    "目前是一名大三学生,CS专业,坐标西南边陲",
                    "喜欢安静,不喜社交",
                    "喜欢听音乐,什么类型都可",
                    "喜欢技术,coding",
                    "目前正在学习java后端",
                    '最喜欢的电影是"忠犬八公的故事",梦想以后独居也能有一只"Hachi"',
                    "主题是我自己开发的，前端太菜了，如果有bug，希望大家多多包涵`Σ(￣□￣||)` ",
                    "有点懒",
                    "目前除了编程没有什么兴趣爱好",
                    "正在追的番有《百妖谱》,《致不灭的你》,《少年歌行》,《鬼灭之刃》,《关于我转生变成史莱姆这档事》...",
                    "喜欢小说，喜欢的作者是--十月流年，最喜欢的小说《至尊修罗》,《一念永恒》,《星辰变》",
                ],
                tag: [
                    "coding",
                    "社恐",
                    "番剧",
                    "电影",
                    "安静",
                    "音乐",
                    "小说",
                    "宅",
                    "懒",
                ],
                showTag: true,
            },
            {
                bar: false,
                title: "大三规划",
                describe: [
                    "做项目",
                    "软考二级",
                    "英语四级",
                    "想找实习",
                    "复习数据结构",
                    "驾照",
                    "做点什么有意义的事",
                ],
                tag: ["大家加油呀`Σ(￣□￣||)` ..."],
                showTag: true,
            },
            {
                bar: false,
                title: "未来规划",
                describe: ["后端工程师", "赚money"],
                tag: ["忘记过去，展望未来"],
                showTag: true,
            },
            {
                bar: true,
                title: "技  能",
                describe: [
                    {
                        name: "java",
                        score: 70,
                    },
                    {
                        name: "HTML5",
                        score: 87,
                    },
                    {
                        name: "javascript",
                        score: 82,
                    },
                    {
                        name: "css",
                        score: 73,
                    },
                    {
                        name: "python",
                        score: 50,
                    },
                    {
                        name: "redis",
                        score: 59,
                    },
                    {
                        name: "mysql",
                        score: 82,
                    },
                    {
                        name: "vue",
                        score: 60,
                    },
                    {
                        name: "spring",
                        score: 71,
                    },
                    {
                        name: "springMVC",
                        score: 77,
                    },
                    {
                        name: "springBoot",
                        score: 71,
                    },
                ],
                showTag: false,
            },

            {
                showTag: false,
                bar: true,
                title: "掌握框架",
                describe: [
                    {
                        name: "spring",
                        score: 79,
                    },
                    {
                        name: "springMVC",
                        score: 81,
                    },
                    {
                        name: "springBoot",
                        score: 82,
                    },
                    {
                        name: "mybatis",
                        score: 82,
                    },
                    {
                        name: "vue",
                        score: 60,
                    },
                    {
                        name: "dubbo",
                        score: 61,
                    },
                ],
            },
            {
                bar: true,
                showTag: false,
                title: "掌握技能",
                describe: [
                    {
                        name: "jetbrains",
                        score: 75,
                    },
                    {
                        name: "linux",
                        score: 68,
                    },
                    {
                        name: "git",
                        score: 78,
                    },
                    {
                        name: "Ctrl C V",
                        score: 100,
                    },
                ],
            },
            {
                title: "关于主题",
                describe: [
                    "theme-ccds主题是我自己独立开发，是一款基于vuepress，对默认主题进行了大量修改，我以前使用的是wordpress的博客主题，但是我对PHP不了解，想改成自己想要的主题，太难了，最近在学vue，正好看到可以使用vuepress来搭建 博客，就将默认主题改成现在这个样，并且喜欢vuepress的最主要原因是，它可以 直接将本地的markdown文档进行编译部署，我原来博客，我记了几个月的笔记，不太想再慢慢从本地复制到WordPress进行发布，以至于博客几个月没有发布文章了，虽然有技术可以解决，但还是喜欢vuepress，简直是懒癌福音，如果你喜欢的话，可以在我的GitHub进行下载，使用文档可以查看https://theme-ccds.cco.vin，该主题已将所有的配置进行抽离，你现在看到的所有信息，都抽离在了一个配置文件中，但是目前还并不能做到开箱即用，如果使用的人多了，我可以进行修改，并且我自己也写了几个组件，包括文章页面看到的顶部图片，友情链接，海报分享功能等等 ，可以在你想使用的地方，直接使用这些组件就可以，该主题我加入了vuex，对前端不太了解，有很多css不对的地方，请大家多多包涵，Thanks♪(･ω･)ﾉ",
                ],
            },
            {
                bar: false,
                title: "更新日志",
                describe: [
                    "开发永不止步......",
                    "2021.9.12 增加相册功能，解决已知bug",
                    "2021.9.9 增加海报分享功能",
                    "2021.9.5 重新修改文章SEO自动配置，使用新规则，解决从tag页面进入文章页面，懒加载失效问题",
                    "2021.9.4 重新初始化仓库",
                    "2.21.8.10 -- 2021.9 主题开发",
                ],
                tag: ['想求个star`(⌒▽⌒)`'],
                showTag: true,
            },
            {
                title: "主题后续计划及闲话",
                bar: false,
                tag: [],
                showTag: false,
                describe: [
                    "为说说页面增加随时发布，随时修改功能",
                    "增加每日计划打卡功能",
                ],
            },
        ],
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194

bar

Boolean

此项是否展示为条状如果为true，请正确设置

title

String

标题

showTag

Boolean

是否显示标签，true表示显示

describe

Array

字符串数组或者对象数组，如果length为1，不会显示编号，一行展示
如果为对象数组，会以条状展示，属性有name,score

name

String

条状描述文字

score

Number

条状展示值，最终会将其转化为百分数，表示条状长短

背景

randomWallpaper

String

PC端，随机背景地址
v1.3.2已移除

randomWallpaperMb

String

手机端随机背景地址
v1.3.2已移除

homePageImgApi

String

首页文章列表封面图及文章页面，标签页面，说说页面，友情链接页面顶部图片(顶部图片仅在customTopImg没有配置以及customTopImg ---> custom: false情况下生效，否则顶部图片将使用自己设置的图片)api接口
默认https://api.ixiaowai.cn/api/api.php

homeWps

Array

PC端网站背景图片数组，从v1.3.2开始，移除使用随机图片接口作为背景图片，改用自己设置

配置

module.exports = {
    themeConfig: {
        ....
        homeWps: [
                    'https://ooszy.cco.vin/img/blog-note/illust_74502138_20211008_183343.png',
                    "https://picoss.cco.vin/animate/wall/404901.png",
                    "https://picoss.cco.vin/animate/wall/734386.png",
                    "https://picoss.cco.vin/animate/wall/5332.png",
                    "https://picoss.cco.vin/animate/wall/6202.png",
                ],
    }
}

1
2
3
4
5
6
7
8
9
10
11
12

homeWpsMobile

Array

手机端网站背景图片

配置

module.exports = {

    themeConfig: {
        homeWpsMobile: [
            "https://ooszy.cco.vin/img/blog-note/881770.jpg",
            "https://ooszy.cco.vin/img/blog-note/109136.jpg",
            "https://ooszy.cco.vin/img/blog-note/929842.jpg",
        ],
    }
}

1
2
3
4
5
6
7
8
9
10

customTopImg

Object

定制顶部图片,为null，将使用随机图片接口，默认为https://api.ixiaowai.cn/api/api.php

配置

module.exports = {

    themeConfig: {
        customTopImg: {
            //是否启用定制顶部图片，控制全局，如果关闭，那么将使用随机图片，随机图片接口可以自己设置
            custom: true,

            //文章顶部图片，数组，每次从数组中随机选择一张
            page: [
                "https://picoss.cco.vin/animate/wall/555260.png",
                'https://picoss.cco.vin/animate/wall/404901.png',
                'https://picoss.cco.vin/animate/wall/734386.png'
            ],
            //友情链接页面
            friend: [
                "https://picoss.cco.vin/animate/wall/669.png",
                'https://picoss.cco.vin/animate/wall/5332.png'
            ],
            //标签页面
            tag: [
                "https://picoss.cco.vin/animate/wall/763311.png"
            ],
            //心情页面
            mood: [
                "https://picoss.cco.vin/animate/wall/5849.png"
            ],
        },
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

custom

Boolean

是否定制顶部图片，为FALSE，将使用默认随机图片接口

friend

Array

友情链接页面顶部图片数组

mood

Array

说说页面顶部图片数组

字体和颜色

randomColor

Array

随机颜色字符串数组，文章推荐，tag页面，关于页面条状背景色...，并不会控制字体颜色

点击查看代码

module.exports = {

    themeConfig: {
        randomColor: [
            "#ffcad4", "#d8e2dc", "#8d99ae", "#b8f2e6", "#84c7d0", "#aed9e0", "#00b4d8",
            "#caf0f8", "#fbc4ab", "#fdc5f5", "#84dcc6", "#a9def9", "#fcf6bd", "#f0a6ca",
            "#b9faf8", "#42a5f5", "#ff9800", "#b39ddb", "#6d45bb", "#b388ff", "#1565c0",
            "#26c6da", "#5e548e", "#90f1ef", "#5b5f97", "#bbe6e4", "#42bfdd", "#72ddf7",
            "#8093f1", "#9ed8d8", "#7ea8be", "#ef90b3", "#b892ef", "#c0b9dd", "#c0d9dd",
            "#75c9c8", "#ded9e2", "#b5e2fa", "#62b6cb", "#5fa8d3", "#0fa3b1", "#b5e2fa",
            "#5fa8d3", "#62b6cb", "#b892ff",
        ],
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14

maxFontColorArr

Number

圆角控制面板，切换颜色最大个数，也控制这字体最大个数

fontColor

Array

字体随机颜色字符串数组，请传入颜色值

fontFamily

Array

字体字符串数组

WARNING

如果想要使用自己新引入的字体，请在docs/.vuepress/config.js --->head内引入自己的css样式

然后在fontFamily数组中，加入引入的字体名称，如果字体文件太大的话，网站加载速度会受到影响

友情链接

点击查看友情链接页面

friendLinks

Array

数组对象，所有友情链接在此处进行配置

title

String

标题

url

String

朋友站点地址

logo

String

朋友站点logo图

describe

String

朋友站点描述

点击查看代码

module.exports = {

    themeConfig: {
        friendLinks: [
            {
                //网站标题
                title: "XI溪",

                //站点链接
                url: "http://www.xiaoxuya.top",

                //站点logo
                logo: "https://www.xiaoxuya.top/img/logo.png",

                //站点描述
                describe: "人生若只是初见,何事秋风悲画扇",
            },
            {
                title: "左眼会陪右眼哭の博客",
                url: "http://qkongtao.cn/",
                logo: "http://qiniu.qkongtao.cn/2020/12/d11-e1628358435552.png",
                describe: "干嘛这么想不开，要在脸上贴个输字！",
            },
            {
                title: "[ Blog We]",
                url: "https://blogwe.com/",
                logo: "https://blogwe.com/favicon.ico",
                describe: "博客大全-做最好的博客导航！",
            },
            {
                title: "I Am I",
                url: "https://5ime.cn",
                logo: "https://cdn.jsdelivr.net/gh/5ime/img/avatar.jpg",
                describe: "永远相信美好的事情即将发生",
            },
            {
                title: "Davinci的红茶馆",
                url: "https://davincievans.top/",
                logo: "https://cdn.jsdelivr.net/gh/DavinciEvans/Imgs-bed@master/gallery/avatar.jpg",
                describe: "You are all stardust.",
            },
            {
                title: "皮皮凛の小窝",
                url: "https://owomoe.net/",
                logo: "https://cdn.jsdelivr.net/gh/AyagawaSeirin/Assets/img/logo.jpg",
                describe: "永远相信美好的事情即将发生~",
            },
            {
                title: "月月月子喵",
                url: "https://haozi.moe",
                logo: "https://haozi.moe/css/images/logo_christmas.png",
                describe: "可爱的月子酱",
            },
            {
                title: "疫情在线捐款系统",
                url: "http://yq.vipblogs.cn/",
                logo: "https://ooszy.cco.vin/img/blog-public/avatar.jpg",
                describe: "基于echarts的疫情捐款系统",
            },
            {
                title: "疫情在线捐款系统后台登录",
                url: "http://admin.vipblogs.cn/",
                logo: "https://ooszy.cco.vin/img/blog-public/avatar.jpg",
                describe: "该捐款系统后台登录",
            },
        ],
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68

siteInformation

Object

自己站点描述信息

url

String

自己站点url

logo

String

自己站点logo图片地址

describe

String

自己站点描述信息

ico图标(v1.3.2已移除)

ico

Object

友情链接，关于页面，还有圆角控制面板ico图标地址
v1.3.2已移除

linkIco

String

友情链接图标地址
v1.3.2已移除

也就是这一坨

aboutIco

String

关于页面，图标地址
v1.3.2已移除

homeWelcome(v1.3.2已移除)

Array

字符串数组，圆角，字体控制面板，背景切换和开启毛玻璃效果图标，源码中，是通过数组顺序进行使用的，传入时，请注意顺序

字符串数组，标签中，需要排除的链接分割文字，如
module.exports = {

       themeConfig: {
           excludeTag: ["note"],
       }
}
1
2
3
4
5
6
如果有有一个文章url为https://blog.cco.vin/note/spring/springboot.html，那么在标签列表中，不会显示note，但会显示spring

split

String 如~

tag页分割符

页脚

点击查看页脚配置

Array

字符串数组，页脚显示的HTML，支持传入HTML，对于首页，会选择数组中的第一个和第二个显示

点击查看代码

module.exports = {

    themeConfig: {
        footer: [
            "Copyright © by qsyyke All Rights Reserved.",
            "<a target='_blank' href='http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=53060202000142' style='display:inline-block;text-decoration:none;height:20px;line-height:20px;'><img src='' style='float:left;'/><p style='float:left;height:20px;line-height:20px;margin: 0px 0px 0px 5px;'>滇公网安备 53060202000142号</p></a>",
            "<a href='https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral'>本网站由<img style='height: 24.1px;width: 55.3px;' src='https://ooszy.cco.vin/img/blog-note/%E5%8F%88%E6%8B%8D%E4%BA%91_logo5.png?x-oss-process=style/pictureProcess1'>提供CDN加速服务</a>",
        ],
    }
}

1
2
3
4
5
6
7
8
9
10

isShowFooter

Boolean

是否显示页脚，控制全局

isShowRunTime

Boolean

是否显示运行时间

startRunTime

String

网站开始时间，请注意格式，如8/7/2021 12:22:00

prefixRuntime

String

运行时间描述，如小破站已运行

keyRule

Number

如果没有设置key值，那么就截取描述作为key，keyRule就是截取多少个字
v1.3.2已移除

isShowThemeCopyright

Boolean

是否显示主题版权信息，默认显示，你可以设为false关闭(小小心愿，此项能否保留(｀・ω・´))

广告(v1.3.2已移除)

message

String

广告文字描述，如目前博客还没开发评论，支持html

isShowMessage

Boolean

是否显示广告，控制全局

广告(v1.3.2已移除)

adsenseArr: [
  {
    position: center,
    adsenseMessage: 官网用户专享3,
    script: <a href="https://baidu.com">这是中间3</a>,
    adsenseBackgroundImg: /img/33.jpg,
  },
]

insertAdsenseRule: 17
#每一页文章中，最大广告数
adsenseLength: 3

1
2
3
4
5
6
7
8
9
10
11
12

文章推荐

点击查看文章推荐配置

recommendPageLength

Number

文章推荐的最大个数，默认为30

recommendNoTitle

String

推荐列表标题为空时，就会使用这个进行代替，默认是╮(￣▽￣)╭

tagNoTitle

String

tag页，没有标题时，代替文字默认: 暂时还没有标题哟

打赏

赞赏配置

donate

Object

donateImg

Array

赞赏付款二维码地址，推荐放置两张

articlePage

Boolean

文章页面是否显示打赏

aboutPage

Boolean

关于页面是否显示打赏

donateProduct

Array

产品列表

name

String

产品名

img

String

产品图片地址

price

Number

价格

prefix

String

价格前缀，如$,￥

onlineList

Boolean

是否显示在线支付

donateList

Array

对象数组，用户打赏列表

点击查看代码

module.exports = {

    themeConfig: {
        donate: {

            //赞赏页面，支付二维码，推荐放置两张图片链接
            donateImg: [
                "https://ooszy.cco.vin/img/blog-public/wxpay.png",
                "https://ooszy.cco.vin/img/blog-public/zfbpay.jpg",
            ],

            //是否在文章页面显示赞赏 默认显示
            articlePage: true,

            //是否在关于页面显示 默认显示
            aboutPage: true,

            //显示在赞赏页面的信息
            donateProduct: [
                {
                    //名字
                    name: "奶茶",

                    //图片地址
                    img: "https://ooszy.cco.vin/img/blog-public/nc.jpeg",

                    //价格
                    price: 18,

                    //前缀
                    prefix: "quot;,
                },
                {
                    name: "全味奶茶",
                    img: "https://ooszy.cco.vin/img/blog-note/image-20210911233612031.png?",
                    price: 11,
                    prefix: "￥",
                },
            ],

            //是否显示在线支付的订单信息，如果需要开启，请自己写支付接口，自己修改源码，默认关闭
            onlineList: true,

            //用户赞赏列表数组
            donateList: [
                {
                    //用户名
                    name: "qsyyke",

                    //赞赏信息
                    msg: "文章写的非常好",

                    //用户头像
                    img: "https://ooszy.cco.vin/img/blog-public/nc.jpeg",

                    //打赏金额
                    price: 11,

                    //金额前缀
                    prefix: "￥",
                },
                {
                    name: "初尘",
                    msg: "主题太棒了",
                    img: "https://ooszy.cco.vin/img/blog-public/nc.jpeg",
                    price: 7,
                    prefix: "￥",
                },
            ],
        },
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72

评论配置

comment

Object

评论相关配置

showComment

Boolean

是否显示评论
控制全局

placeholder

String

评论区占位符如在这里留下你的脚印吧...
v1.3.2使用Waline作为评论，已移除该项，后续版本会添加

appId(v1.3.2已移除)

String

appKey(v1.3.2已移除)

String

avatar

String

头像显示默认，请看相关配置头像配置 | Waline

pageSize(v1.3.2已移除)

Number

每页评论展示数目
后续版本会再次添加

visitor(v1.3.2已移除)

Boolean

是否开启文章统计
v1.3.2已移除，后续版本会再次添加

recordIP

Boolean

是否记录用户IP地址
v1.3.2已移除，后续版本会再次添加

adminUsername

String

管理员用户名
v1.3.2已移除，后续版本会再次添加

设置之后，如果评论区的用户名中，存在此值，那么就会在用户名后面加上UP标识，但是这样也会存在一个问题，如果用户使用这个用户名评论或者恢复，那么也就相当于管理员回复，无后端不好控制

点击查看代码

#评论配置
comment: {
  showComment: true,
  #占位符
  placeholder: 在这里留下你的脚印吧...,
  appId: LwdW7EDeTGFUjTfUToF9WjEh-gzGzoHsz,
  appKey: yGiWpb4TbwSz5ihpfloV1gDX,
  #头像显示
  avatar: robohash,
  # 每页评论数量
  pageSize: 3,
  #是否开启访问量
  visitor: true,
  # 是否记录评论者ip
  recordIP: true,
  # 是否自动获取用户qq头像，需根据qq号码
  adminUsername: qsyyke
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

serverURL

String

serverURL地址，请点击进行评论相关配置
快速上手 | Waline

TIP

当在Waline官网配置完成之后，请将serverURL添加至此

emojis

Array

自定义表情 | Waline
主题默认加入哔哩哔哩表情，不推荐设置太多，v1.3.2在此处存在一个bug，设置表情太多，选择表情的时候，会将表情做放大处理

海报

poster

Object

海报相关配置

description

String

海报底部博客描述

author

String

作者

preBlog

String

博客前缀

suffixBlog

String

博客后缀

avatar

String

头像，推荐奖此头像放入docs/.vuepress/public下，否则可能会出现跨域问题

点击查看代码

module.exports = {

    themeConfig: {
        poster: {
            //博客描述
            description: "I do not follow,i lives is always all you want",

            //作者
            author: "qsyyke",

            //博客前缀
            preBlog: "qsyyke",

            //海报博客名称后缀
            suffixBlog: "のblog'",

            //头像，请放置在docs/public目录下，或者请保证此图片链接能够跨域访问，否则头像不能正常显示
            avatar: "/avatar.png",
        },
    }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21

postImgApi

String

生成海报的顶部图片api接口，请注意，该接口需要直接返回图片地址，不能有跨域问题，设置之前，可以先使用ajax看是否存在跨域

侧边栏

sidebarTag

String

侧边栏标签部分是显示分类，还是标签，默认是显示分类

sidebarTag: "tag" 显示分类

sidebarTag: "categories" 显示标签

mobileCutText

String

手机端侧边栏文字

点击查看详情

sidebarCatalogLevel

Number

自动生成文章侧边栏等级

TIP

假如一文件夹如docs/home/config/note.md

此sidebarCatalogLevel: 1，那么在浏览器中打开localhost:8080/home/config/note.html时，将只会为config文件夹内的md文件生成侧边栏，

如果sidebarCatalogLevel: 2，那么会为home和config文件夹内的md文件，自动生成侧边栏

不推荐此值太大，不然文章侧边栏数量太多，不美观

latestPageSize

Number

首页侧边栏最新文章的数量，推荐值为6

githubUrl

String

侧边栏Github链接

pageSize

Number

首页文章列表数目，默认为4

showMoodEdit

Boolean

是否开启在线添加说说功能，如果需要，请自己写后台，修改源码，目前在主题内部暂未加入组件位置docs/.vuepress/theme/lib/client/components/child/AddMood.vue

showOnlineMood

Boolean

是否展示从网络上请求回来的说说如果启用，请自己写后台服务，修改源码，目前暂未在主题中加入，期望在将来能够实现，组件位置docs/.vuepress/theme/lib/client/components/Mood.vue

mobilePageSidebar

Boolean

手机端，是否在页面的底部显示侧边栏列表，默认开启，如果需要开启，请将此值设置为FALSE

额外功能

showAddMood

Boolean

是否显示在线增加说说功能，目前只能我自己使用，在后续版本中，会进行更改

# V1.12.xxx版本新增配置v1.12.xxx

# homeTopText

# sidebarDesc

# V1.11.xxx版本新增配置v1.11.xxx

# afDianUrl

# randomSayApi

# method

# urlApi

# V1.10.xxx版本新增配置v1.10.xxx

# V1.9.xxx版本新增配置v1.9.xxx

# showPageMeta

# V1.8.xxx版本增加配置新版本v1.8.xxx

# showRecommend

# articlePagination

# excludeTagv1.8.0已被移除

# excludePath

# wave

# showWave

# bubble

# showbubble下的配置项

# bubbleNumber推荐0-1之间小数,不能为0

# bubbleAlpha推荐0-1之间小数,不能为0

# alphaChangeSpeed越接近于0越好,不能为0

# size推荐0-1之间小数,不能为0

# sizeChangeSpeed越接近于0越好,不能为0

# riseSpeed推荐0-1之间小数,不能为0

# color

# 新版本v1.3.2-v1.6.2

# sidebarAvatarv1.6.2

# navbar配置项被修改过

# about增加对html的支持

# friendLinks发生重大修改，影响运行

# coverv1.6.0

# siteInformationv1.6.0 发生更改

# contactv1.6.0 新增

# otherDescribev1.6.0 新增

# messagev1.6.0 html支持

# showMoodEditv1.6.0 被移除

# addMoodv1.6.0 被移除

# showOnlineMoodv1.6.0 被移除

# articleH2Iconv1.6.0 新增

# articleH3Iconv1.6.0 新增

# articleH4Iconv1.6.0 新增

# 首页

# home

# logoColor

# logoTitle

# defaultBorderRadius

# defaultOpacity

# isHomePageFollow

# defaultBlur

# showFont

# faviconIco

# customRandomSay

# customRandomValue

# showHomeMood

# mood

# heroLogo

# heroImg

# logo

# cancelIcoHref

# description

# keyword

# slideTime

# randomSaw

# randomSawQuery

# method

# isFitter

# homePageLazyLoadingImg

# 文章

# lazyLoadingImg

# defaultTitleColor

# coverUrl

# 社交

# socials

# aHref

# imgSrc

# isHome

# show

# sidebar

V1.12.xxx版本新增配置v1.12.xxx

homeTopText

sidebarDesc

V1.11.xxx版本新增配置v1.11.xxx

afDianUrl

randomSayApi

method

urlApi

V1.10.xxx版本新增配置v1.10.xxx

V1.9.xxx版本新增配置v1.9.xxx

showPageMeta

V1.8.xxx版本增加配置新版本v1.8.xxx

showRecommend

articlePagination

excludeTagv1.8.0已被移除

excludePath

wave

showWave

bubble

showbubble下的配置项

bubbleNumber推荐0-1之间小数,不能为0

bubbleAlpha推荐0-1之间小数,不能为0

alphaChangeSpeed越接近于0越好,不能为0

size推荐0-1之间小数,不能为0

sizeChangeSpeed越接近于0越好,不能为0

riseSpeed推荐0-1之间小数,不能为0

color

新版本v1.3.2-v1.6.2

sidebarAvatarv1.6.2

navbar配置项被修改过

about增加对html的支持

friendLinks发生重大修改，影响运行

coverv1.6.0

siteInformationv1.6.0 发生更改

contactv1.6.0 新增

otherDescribev1.6.0 新增

messagev1.6.0 html支持

showMoodEditv1.6.0 被移除

addMoodv1.6.0 被移除

showOnlineMoodv1.6.0 被移除

articleH2Iconv1.6.0 新增

articleH3Iconv1.6.0 新增

articleH4Iconv1.6.0 新增

首页

home

logoColor

logoTitle

defaultBorderRadius

defaultOpacity

isHomePageFollow

defaultBlur

showFont

faviconIco

customRandomSay

customRandomValue

showHomeMood

mood

heroLogo

heroImg

logo

cancelIcoHref

description

keyword

slideTime

randomSaw

randomSawQuery

method

isFitter

homePageLazyLoadingImg

文章

lazyLoadingImg

defaultTitleColor

coverUrl

社交

socials

aHref

imgSrc

isHome

show

sidebar