Hexo站点搭建(二)

下载主题

可以直接从guthub上下载:

cd /home/HexoWeb
git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia

等待下载完成,如出现下载失败可重复命令!

主题配置

修改文件

先修改/home/HexoWeb下的_config.yml文件,主要修改一下几个,其他可根据需要更改:

title: //网站名
subtitle: //签名
description: //网站描述
keywords: //网站关键字
author: //作者
language: zh-CN //语言

url: //站点名

theme: yilia //所用主题

在文件最后加上:

jsonContent:
meta: false
pages: false
posts:
title: true
date: true
path: true
text: false
raw: false
content: false
slug: false
updated: false
comments: false
link: false
permalink: false
excerpt: false
categories: false
tags: true

修改主题配置文件

修改/home/HexoWeb/theme/yilia的_config.yml文件,主要修改了:

excerpt_link: //后面什么都不写

excerpt_link填写了后会出现两个阅读全文的按钮,虽然长得不一样,但是看起来不太好,索性就不填写。
其他都可以根据自己的需要来改。

模块下载

需要在/home/HexoWeb下安装模块

npm i hexo-ganarator-json-content --save
接下来做的就是根据自己爱好更改。

加入音乐播放器

H5的默认的音乐播放器不怎么好看,就去找了AplayerMetingJS两个配合使用
具体使用点击Aplyer文档MetingJS有详细的教程。
先将js资源加入到theme/yilia/layout/_partial/head.ejs的head标签中




在theme/yilia/layout/_partial/layout.ejs的第六行下加上:

<div class="aplayer"
data-id="网易云歌单ID"
data-server="netease" //可以更改为其他
data-type="playlist" //可以切换单曲或歌单
data-list-max-height="199px" //如果为歌单,规定歌单最大长度
data-list-folded="true" //歌单折叠
data-preload="auto" //歌单预载
data-loop="all" //歌单循环
data-autoplay=“false” //自动播放
style="top:23%;">

如果想在移动端也加上播放列表,需要在theme/yilia/layout/_partial/mobile-nav.ejs第二行加上上面的代码。

参考资料

yilia主题
Aplay文档
MetingJS

posted @ 2020-05-08 11:28  NephKis·浅暮  阅读(144)  评论(0)    收藏  举报