hexo主題 Vue是一款基于Hexo框架的開源博客主題,采用了現代化的前端技術,支持多種自定義配置及個性化樣式。
使用Vue主題,需要先安裝Hexo框架,并在博客配置文件_config.yml中指定Vue主題。Hexo框架支持Node.js環境,因此需要先安裝Node.js,具體安裝方法可以參考官網文檔。
npm install -g hexo-cli
hexo init blog
cd blog
npm install
hexo server
啟動Hexo后可以訪問http://localhost:4000,如果沒有報錯則表示配置成功。接著可以通過git clone方式下載Vue主題,并將主題文件解壓到博客根目錄下themes目錄中。
cd themes
git clone https://github.com/nexmoe/hexo-theme-vue
cd hexo-theme-vue
npm install
啟動開發服務器,調試主題樣式及效果。
npm run dev
修改主題配置文件_config.yml,自定義網站信息及個性化風格。
# Site
title: Your Site Title
subtitle: Your Site Subtitle
description: Your Site Description
keywords: Your Site Keywords
author: Your Site Author
language: zh-CN
timezone: Asia/Shanghai
# URL
url: https://example.com
root: /
# Theme
theme: hexo-theme-vue
# Menu
menu:
home: / # 默認主頁
categories: /categories
tags: /tags
archives: /archives
about: /about
# Typography
font:
family: 'Helvetica Neue', 'Helvetica', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif
size: 16px
# Comment
comment:
type: valine
appid: YourLeancouldAppId
appkey: YourLeancouldAppKey
notify: false # 評論回復郵件提醒(需開啟 LeanCloud 短信服務)
verify: false # VERIFY_ORIGIN 自定義站長驗證碼(需開啟 LeanCloud 短信服務)
# Busuanzi
busuanzi:
enable: true
position: footer
# Analytics
google_analytics: UA-XXXXXXXXX-X
# Social
social:
github: https://github.com/YourGithubLink
weibo: https://weibo.com/YourWeiboLink
zhihu: https://www.zhihu.com/people/YourZhihuLink
Hexo主題Vue可以滿足不同類型的博客需求,支持多種博客特性及個性化配置。使用Vue主題可以讓你的博客更加易于維護和升級,同時具備更強的交互性和用戶體驗,值得一試。
上一篇css3是前端嗎
下一篇html 斜體字怎么設置