# preview
WARNING
Don't use yarn yet, as the vue-router dependency issue will cause path errors, pending an official fix.
# installation
$ npm i vuepress-theme-yur
# total configuration
const head = require("./config/head"); // Introducing the head configuration
const themeConfig = require("./config/themeConfig"); // Introduce theme configuration
const plugins = require("./config/plugins"); // Introducing plug-in configurations
module.exports = {
base: "/", // Base path for deploying the site
evergreen: true, // IE is not supported, use true to reduce package file size.
theme: "yur", // Using the vuepress-theme-yur theme
head, // head configuration
themeConfig, // Theme Configuration
plugins, // Plugin Configuration
markdown: {
lineNumbers: true // Code Block Display Line Numbers
},
host: "localhost", // In development mode, visit the domain name
port: 2234, // Access ports in development mode
dest: "public" // Packet output directory
};
# head configuration
module.exports = [
['meta', {
name: 'google-site-verification', // Custom meta
content: ''
}],
['link', {
rel: 'icon',
href: '/20171231/favicon.ico'
}],
['script', {
src: '/20171231/4.js' // Introducing a custom js file
}],
];
# Plugin Configuration
Provided that the plug-in is installed
module.exports = [
"serve", // Local preview of the packaged site
['@vuepress/medium-zoom', { // Click on the image to enlarge the plug-in
selector: '#markdown img',
options: {
margin: 5
}
}],
]
# Theme Configuration
const links = require('./links') // Introduce Links configuration
module.exports = {
lang: 'zh-CN', // Current website language: en zh-CN
logo: '/20171231/logo48.png', // Website logo
nameplate: {
title: "Yur",
width: "36px",
height: "26px"
},
postCover: [ // Random cover of the article
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/1039d85f155ebe572ff56f90a626b7a1.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/56e0e59e0ab812163e669e6ed52f7fa3.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/bae275e9f50a46e61498e227df586eb9.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/fb03a35ac8a7ca43a69b89c298b2165a.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/766bb99cdfea168a5611d5ed3ee87e6a.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/abea283e65f3460e6f33383dceec550b.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/b49fa49c69ff125aff9a08b177f94cec.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/bc8cd22dd19d42b85dfa8abc871215bf.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/6f6ca5b0cb3bc43e5895911cc40a343d.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/259d10ede304468d1c12df2f49ed2afd.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/d4650c2a40868b84eda513bca9d13513.jpg',
'https://cdn.jsdelivr.net/gh/cnguu/pic@master/20171231/banners/eb92164f38952ef26315499f112b963a.jpg',
],
reward: [ // Reward QR code images
'https://static.xmt.cn/ca717dde8ae14ea7ab3c8c74b8711414.png',
'https://static.xmt.cn/acc7d3d02b0c4a35a3735268cbb2cce0.png',
],
links, // Pages with Links Open
about: true, // Open the About page
cdn: 'https://cdn.jsdelivr.net/gh/cnguu/cnguu.github.io@master/', // This is configured with jsdelivr and does not guarantee that other cdn is available.
hostname: "https://blog.cnguu.cn", // Generate sitemap
locales: { // Language localization, see details at: https://cdn.jsdelivr.net/gh/cnguu/vuepress-theme-yur@master/yur/plugins/Translation/locales/en.js
title: 'Stars so bright',
description: 'Writing life with you',
},
menuCategories: [ // Category Configuration
{text: 'Program', link: 'program'},
{text: 'Life', link: 'life'},
{text: 'Tool', link: 'tool'},
{text: 'Other', link: 'other'},
],
crisp: 'xxx' // Customer chat
}
# crisp
Register account, add site, get assigned ID: Crisp (opens new window)
# Links Configuration
module.exports = [
{
title: 'GitHub',
subtitle: 'Dating platform',
link: 'https://github.com/',
logo: '200x200',
},
{
title: 'cnguu',
subtitle: 'A handsome and sunny boy.',
link: 'https://github.com/cnguu',
logo: 'https://avatars2.githubusercontent.com/u/10758182?s=460&u=178859c532a5a229f2ea59b7a260dffd556489ab&v=4',
},
]
# Theme Style
Style variables (opens new window)
Languages supported by the code block:PrismJs (opens new window)
# Home page banner
Add to the frontmatter of the home page file
---
banner: xxx
---
# Frontmatter page of Links
---
layout: Links
title: My Links
meta:
- name: description
content: My Links
- name: keywords
content: My Links
---
# Frontmatter page of About
---
layout: About
title: About me
meta:
- name: description
content: About me
- name: keywords
content: About me
---
# Frontmatter page of Post
title: Test
meta:
- name: description
content: Test
- name: keywords
content: t,e,s,t
created: 2020/02/10
updated: 2020/02/30
tags:
- GitHub
- Fork
banner: Cover link, no default random cover
# icon
- register iconfont (opens new window)
- Create a new project and add your favorite icons.
- head import CDN link for Symbol (can also be downloaded for local use)
module.exports = {
head: [
['script', {src: '//at.alicdn.com/t/font_xxx.js'}]
]
}
- Using in MarkDown
<Icon name="github" />
<Icon name="man" color="#39c5bb" />
<Icon name="woman" size="2em" />
parameters | explain |
---|---|
name | Icon name |
color | Icon color |
size | Icon size (recommended unit of use: em) |