Hexo 博客Next 搭建与美化主题

Stella981
• 阅读 517

========================================================================================
将页面部署到GitHub或者Coding
========================================================================================

1.进入GitBash
ssh-keygen -t rsa -C "@qq.com"
默认会在家目录生成:C:\Users\.ssh
复制pub中的内容到github

2.测试连通性,邮箱地址不用改
ssh -T git@github.com

3.此时你还需要配置
git config --global user.name "" //你的github用户名,非昵称
git config --global user.email "@qq.com" //填写你的github注册邮箱

4.部署代码命令如下

cd public/

git init
git add .

git commit -m "MyBlog"
git remote add origin https://github.com/用户名/项目名称.git
git push -f origin master

========================================================================================
自动化页面部署到 GitHub
========================================================================================
hexo g &
cd public &
git config --global user.name "xxxxxx" &
git config --global user.email "@qq.com" &
git init &
git add . &
git commit -m "Blog" &
git remote add origin https://github.com/xxxxxx.github.io.git &
git push -f origin master &
echo "push master GitHub " &
del /s /f /q .git &
rd /s /q .git &

========================================================================================
替换底部标签#号为图标
========================================================================================
修改 \themes\next\layout\_macro\post.swig
搜索 rel="tag"># 将 # 换成

========================================================================================
给站点添加版权声明
========================================================================================
1.新建配置文件,并写入以下内容: \themes\next\layout\_macro\my-copyright.swig

{% if page.copyright %}

{% endif %} \--------------------------------------------------------------------------------------------- 2.在目录 \\themes\\next\\source\\css\\\_common\\components\\post下新建my-post-copyright.styl并写入内容:

.my_post_copyright {
box-shadow: 10px 1px 10px #989898;
padding: 10px;
text-shadow: 1px 1px 1px #FFF;
font-size: 16px;
font-family: 'Microsoft Yahei';
border-left: solid 5px #3199E4;
background: #F3F3F3;
border-bottom-left-radius: 10px;
border-top-left-radius: 10px;
border-bottom-right-radius: 50%;
border-top-right-radius: 10px;
}
.my_post_copyright p{margin:0;}
.my_post_copyright span {
display: inline-block;
width: 5.2em;
color: #1d1f21;
font-weight: bold;
}
.my_post_copyright .raw {
margin-left: 1em;
width: 5em;
}
.my_post_copyright a {
color: #808080;
border-bottom:0;
}
.my_post_copyright a:hover {
color: #a3d2a3;
text-decoration: underline;
}
.my_post_copyright:hover .fa-clipboard {
color: #000;
}
.my_post_copyright .post-url:hover {
font-weight: normal;
}
.my_post_copyright .copy-path {
margin-left: 1em;
width: 1em;
+mobile(){display:none;}
}
.my_post_copyright .copy-path:hover {
color: #808080;
cursor: pointer;
}

---------------------------------------------------------------------------------------------
3.修改配置文件: \themes\next\layout\_macro\post.swig 修改(335行)

{% if theme.related_posts.enable and (theme.related_posts.display_in_home or not is_index) %}
{% include '../_partials/post/post-related.swig' with { post: post } %}
{% endif %}

#------------------------------------------------------------

{% if not is\_index %} {% include 'my-copyright.swig' %} {% endif %}
#------------------------------------------------------------ {#####################} {### END POST BODY ###} {#####################} \--------------------------------------------------------------------------------------------- 4.修改\\themes\\next\\source\\css\\\_common\\components\\post\\post.styl文件,在最后一行增加代码: @import "my-post-copyright";

========================================================================================
给站点添加订阅
========================================================================================
1.首先安装插件: npm install hexo-generator-feed

2.在本地hexo根目录下的_config.yml文件中,添加以下配置

# Extensions
## Plugins: http://hexo.io/plugins/
#RSS订阅
plugin:
- hexo-generator-feed
#Feed Atom
feed:
type: atom
path: atom.xml
limit: 20

========================================================================================
添加CNZZ站长统计代码
========================================================================================
vim \themes\Next\layout\_partials\footer.swig

========================================================================================
给网站底部添加运行时间
========================================================================================
在 /themes/Next/layout 文件夹下找到你的 footer 文件,即脚布局文件,在对应的位置添加代码

本站已运行:

========================================================================================
neat 博文压缩功能,npm install hexo-neat --save (主页config.yml添加以下内容)/与live2D冲突
========================================================================================
neat_enable: true
# 压缩html
neat_html:
enable: true
exclude:
# 压缩css
neat_css:
enable: true
exclude:
- '**/*.min.css'
# 压缩js
neat_js:
enable: true
mangle: true
output:
compress:
exclude:
- '**/*.min.js'
- '**/jquery.fancybox.pack.js'
- '**/index.js

========================================================================================
# 是否开启看板娘Live2D插件
========================================================================================
live2d:
enable: true
scriptFrom: local
model:
use: live2d-widget-model-ela
scale: 1
hHeadPos: 0.5
vHeadPos: 0.618
display:
superSample: 2
width: 300
height: 290
position: left
hOffset: 0
vOffset: -10
mobile:
show: true
scale: 0

========================================================================================
另类文献
========================================================================================
#cnblogs_post_body h2 {
font-size: 28px;
font-weight: bold;
background-color: #5531e4;
border-radius: 5px;
color: #fff;
padding-left: 8px;
text-shadow: 1px 1px 1px #000;
}
#cnblogs_post_body h3 {
background: #005f96;
border-radius: 100px 6px 100px 6px;
box-shadow: 0 0 0 1px #5F5A4B, 1px 1px 6px 1px rgba(10, 10, 0, 0.5);
color: #FFFFFF;
font-family:"微软雅黑", "宋体", "黑体", Arial;
font-size: 15px;
font-weight: bold;
height: 30px;
line-height: 20px;
margin: 12px 0 !important;
padding: 5px 0 5px 10px;
text-shadow: 2px 2px 3px #222222;
}
#MySignature {
border: solid 1px #169fe6;
padding: 10px;
background: rgba(47, 180, 220, 0.24) url(//images.cnblogs.com/cnblogs_com/grenet/226272/o_o_o_info.png) no-repeat scroll 15px 50%;
padding-left: 80px;
}
#MySignature div{line-height: 25px;}

点赞
收藏
评论区
推荐文章
刚刚好 刚刚好
4个月前
css问题
1、在IOS中图片不显示(给图片加了圆角或者img没有父级)<div<imgsrc""/</divdiv{width:20px;height:20px;borderradius:20px;overflow:h
blmius blmius
1年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
晴空闲云 晴空闲云
4个月前
css中box-sizing解放盒子实际宽高计算
我们知道传统的盒子模型,如果增加内边距padding和边框border,那么会撑大整个盒子,造成盒子的宽度不好计算,在实务中特别不方便。boxsizing可以设置盒模型的方式,可以很好的设置固定宽高的盒模型。盒子宽高计算假如我们设置如下盒子:宽度和高度均为200px,那么这会这个盒子实际的宽高就都是200px。但是当我们设置这个盒子的边框和内间距的时候,那
艾木酱 艾木酱
3个月前
快速入门|使用MemFire Cloud构建React Native应用程序
MemFireCloud是一款提供云数据库,用户可以创建云数据库,并对数据库进行管理,还可以对数据库进行备份操作。它还提供后端即服务,用户可以在1分钟内新建一个应用,使用自动生成的API和SDK,访问云数据库、对象存储、用户认证与授权等功能,可专
Stella981 Stella981
1年前
KVM调整cpu和内存
一.修改kvm虚拟机的配置1、virsheditcentos7找到“memory”和“vcpu”标签,将<namecentos7</name<uuid2220a6d1a36a4fbb8523e078b3dfe795</uuid
Wesley13 Wesley13
1年前
MySQL查询按照指定规则排序
1.按照指定(单个)字段排序selectfromtable_nameorderiddesc;2.按照指定(多个)字段排序selectfromtable_nameorderiddesc,statusdesc;3.按照指定字段和规则排序selec
Wesley13 Wesley13
1年前
Java日期时间API系列36
  十二时辰,古代劳动人民把一昼夜划分成十二个时段,每一个时段叫一个时辰。二十四小时和十二时辰对照表:时辰时间24时制子时深夜11:00凌晨01:0023:0001:00丑时上午01:00上午03:0001:0003:00寅时上午03:00上午0
Stella981 Stella981
1年前
Angular material mat
IconIconNamematiconcode_add\_comment_addcommenticon<maticonadd\_comment</maticon_attach\_file_attachfileicon<maticonattach\_file</maticon_attach\
Wesley13 Wesley13
1年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
helloworld_34035044 helloworld_34035044
7个月前
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
helloworld_28799839 helloworld_28799839
4个月前
常用知识整理
Javascript判断对象是否为空jsObject.keys(myObject).length0经常使用的三元运算我们经常遇到处理表格列状态字段如status的时候可以用到vue