1.主题目录/layout/sitelog.ejs
<div class="blank" style="padding-top: 75px;">
</div>
<div class="pattern-center ">
<div class="pattern-attachment-img">
<% if (page.photos) { %>
<img src="<%= page.photos %>" src="<%- theme.lazyloadImg %>" data-src="<%= page.photos %>" class="lazyload" onerror="imgError(this,3)" style="width: 100%; height: 100%; object-fit: cover; pointer-events: none;">
<% } else { %>
<img src="<%= theme.bg[Math.floor(Math.random() * theme.bg.length + 1)-1] %>" src="<%- theme.lazyloadImg %>" data-src="<%= page.photos %>" class="lazyload" onerror="imgError(this,3)" style="width: 100%; height: 100%; object-fit: cover; pointer-events: none;">
<% } %>
<header class="pattern-header ">
<h1 class="entry-title">
建站日志</h1>
<span class="post-meta-item-icon">
<i class="iconfont icon-attention"></i>
</span>
</span>
</header>
</div>
</div>
<div id="content" class="site-content">
<div id="main">
<header class="page-header">
<main class="content">
<div class="container">
<div class="card">
<div class="card-content">
<div class="tag-title center-align">
<div class="journal">
<div class="title center-align">“ 日志”</div>
“ 这是本站的站点日志用来记录本站建立过程，变动内容，新增内容~~ ”
</div>
<div class="box">
<div class="tit"></div>
<div class="min">
<div class="line"></div>
<div class="vas">
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-1220 10:09:00</p>
<div class="nr_tit">
<a href="/loveword"># 近期变动</a>
</div>
<div class="nr_nr">
修改了字体的cdn地址，丰富了倒计时页面内容了并适配了全局深色主题，新增骚气满满的骚话页面，填入了访客数据。</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-12-10 15:29:00</p>
<div class="nr_tit">
<a href="/todolist"># 我的flag</a>
</div>
<div class="nr_nr">
修改了我的flag页面，更好适配matery主题。修复了部分页面字体与全站字体不一致的问题。增加了全屏按钮</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-12-09 20:25:00</p>
<div class="nr_tit">
<a href=""># 修改日志页面</a>
</div>
<div class="nr_nr">
修改日志页面为当前样式，借鉴心月云日志页面，适配了全局深色模式。</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-12-05 23:29:00</p>
<div class="nr_tit">
<a href="/books"># 书单</a>
</div>
<div class="nr_nr">
新增书单页面，感谢老朋友itsneko。</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-29 15:28:36</p>
<div class="nr_tit">
<a href="/donate"># 资助系统</a>
</div>
<div class="nr_nr">
新增资助系统页面，感谢老朋友itsneko。</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-29 13:32:00</p>
<div class="nr_tit">
<a href="/artitalk"># artitalk同步更新</a>
</div>
<div class="nr_nr">
替换了js文件，保持artitalk同步更新。
</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-26 10:38:00</p>
<div class="nr_tit">
<a href="/journal"># 访客日历</a>
</div>
<div class="nr_nr">
在关于日志中增加了访客日历，由于不会JavaScript这个做的真丑日后修改。
</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-25 16:58:00</p>
<div class="nr_tit">
<a href="/life"># 写作站人间草木</a>
</div>
<div class="nr_nr">
新增写作站主要用于书写非技术类文章，记录日常点滴，风花雪月。感谢我们的老朋友itsneko。
</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-25 15:33:00</p>
<div class="nr_tit">
<a href=""># 移除客服</a>
</div>
<div class="nr_nr">
由于客服延时太高，本来用于查看是否有人访问鉴于现在有更好的办法，所以移除客服功能。</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-25 10:38:00</p>
<div class="nr_tit">
<a href="/blog"># 站点页面</a>
</div>
<div class="nr_nr">
新增站点页面记录建站工具及环境并补充解释权属于我的霸王条款（站点协议）</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-25 09:38:00</p>
<div class="nr_tit">
<a href=""># 移出相册页面</a>
</div>
<div class="nr_nr">
由于暂时没有上传相册图片的打算，关闭相册页面</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-24 20:38:00</p>
<div class="nr_tit">
<a href="/about"># 修改补充关于我信息</a>
</div>
<div class="nr_nr">
补充关于我信息，听取大佬意见，替换了个人真实姓名，保护个人隐私避免不必要的麻烦。</div>
</div>
</div>
</div> <div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-23 22:39:00</p>
<div class="nr_tit">
<a href="/sakura"># 修改樱花雨页面</a>
</div>
<div class="nr_nr">
修改樱花雨页面为自我介绍增加实用性。</div>
</div>
</div>
</div> <div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-22 00:38:00</p>
<div class="nr_tit">
<a href=""># 细节优化</a>
</div>
<div class="nr_nr">
toc目录添加白色背景，增加了背景图片及遮罩，优化了侧边滑动条，去除了订阅功能，压根没人订阅还占地方</div>
</div>
</div>
</div> <div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-21 09:38:00</p>
<div class="nr_tit">
<a href="/bulletin"># 公告板</a>
</div>
<div class="nr_nr">
因为意义不大删除了弹幕墙页面。增加了公告板页面公布网站正在进行的项目，关于我的一些重要事情。</div>
</div>
</div>
</div> <div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-19 08:20:00</p>
<div class="nr_tit">
<a href=""># 细节优化</a>
</div>
<div class="nr_nr">
调整了导航栏，修复了搜索异常问题，增加粒子特效页面。</div>
</div>
</div>
</div> <div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-17 16:263:00</p>
<div class="nr_tit">
<a href=""># 修复问题</a>
</div>
<div class="nr_nr">
修复了原来valineqq无法拉取昵称和无法启用博主小伙伴标签的问题，这个问题发现好久了并给添加itsneko添加了小伙伴标签。
</div>
</div>
</div>
</div> <div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-15 09:38:00</p>
<div class="nr_tit">
<a href=""># 更换字体</a>
</div>
<div class="nr_nr">
更换了站点字体江西拙楷</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-15 19:08:00</p>
<div class="nr_tit">
<a href="/archive"># 新增时间列表</a>
</div>
<div class="nr_nr">
文章日历页面新增时间列表，感谢<a href="https://blog.sky03.cn/" target="_blank">sky03大佬</a> 提供的源码</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-14 09:38:00</p>
<div class="nr_tit">
<a href=""># 细节优化</a>
</div>
<div class="nr_nr">
增加百度统计功能便于了解访客数量及访问量，增加了夜间模式按钮，更正了留言板友链头像信息，</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-12 08:36:00</p>
<div class="nr_tit">
<a href=""># app</a>
</div>
<div class="nr_nr">
将网站打包app，但是由于效果并不好仅供我自己使用。后面有空再优化。</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-11 23:38:00</p>
<div class="nr_tit">
<a href=""># 实验室单页</a>
</div>
<div class="nr_nr">
陆续增加了实验室单页mikutap，mikutap这个页面我垂涎已久，这是一个开源的项目不知道为什么我用不了在网上今天找到一个修改版终于可以了。帮你百度，拒绝当伸手党学会百度，音乐隧道音乐用的是我的idol Alan walker的歌，小游戏谷歌恐龙加强版，我的源头nekodeng的网站，液体，烟火秀，樱花雨，todolist</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-09 19:08:00</p>
<div class="nr_tit">
<a href=""># 细节优化</a>
</div>
<div class="nr_nr">
将原本标签页面与分类页面合并为文章统计页面，删除关于我中相册，我的项目等内容。改变了原有的主题颜色，真的挑了好久，这个是比较满意的，有时间估计还会调其他的，不是特别满意。删除内容关于我页面中的我的技能，我的其他技能。将文章统计图从关于我页面迁移至文章统计页面，增加使用微软表单方式收集友链信息，调整导航栏顺序。</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-07 07:13:00</p>
<div class="nr_tit">
<a href=""># 升级valine</a>
</div>
<div class="nr_nr">
升级了valine评论系统，修复了主题自带版本不能显示头像的问题</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-06 12:49:00</p>
<div class="nr_tit">
<a href="/about"># 增加botui机器人</a>
</div>
<div class="nr_nr">
在我？页面增加botui对话（不知道为什么hexo g会改写botui.js文件只好使用奇怪的手段解决）</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-06 15:23:00</p>
<div class="nr_tit">
<a href="/status"># 友链检测页面</a>
</div>
<div class="nr_nr">
新增友链检测功能并将友链页面从关于移出合并为友链及其检测页面，向今今今生大佬表达感谢</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-05 09:58:00</p>
<div class="nr_tit">
<a href="/time"># 倒计时页面</a>
</div>
<div class="nr_nr">
增加了骚气的倒计时页面，人生短暂，加油吧少年！ </div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-11-03 14:32:00</p>
<div class="nr_tit">
<a href="/contact"># 完善留言板</a>
</div>
<div class="nr_nr">
完善了留言板和友情链接信息，留言板增加网易云热评，诗词（动态刷新）
</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-10-30 07:59:00</p>
<div class="nr_tit">
<a href=""># artitalk说说页面</a>
</div>
<div class="nr_nr">
新增artitalk说说页面</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-10-30 09:48:00</p>
<div class="nr_tit">
<a href=""># sl证书</a>
</div>
<div class="nr_nr">
安装ssl证书并强制https</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-10-28 08:25:00</p>
<div class="nr_tit">
<a href=""># 备案</a>
</div>
<div class="nr_nr">
完成网站备案工作，用时九天。</div>
</div>
</div>
</div>
<div class="list">
<div class="dian"></div>
<div class="list_box">
<div class="hx"></div>
<div class="list_nr">
<p class="date">2020-10-24 19:38:00</p>
<div class="nr_tit">
<a href=""># 基础</a>
</div>
<div class="nr_nr">
完成部署到服务器以及基础优化工作</div>
</div>
</div>
</div>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script src="../src/tiao_c.js"></script>
<script>
$(document).ready(_ => {
let list_box = $(".list_box");
let hx = $(".hx");
let list_nr = $(".list_nr");
let date = $(".date");
let arr_color = ['#118DF0', '#8bc24c', '#FF5F5F', '#515bd4', '#F7B32D'];
let flag = 0;
let wy = $("body").width();
function pc() {
if (wy <= 700) {
window.history.go(0);
}
if ($("body").width() < 1240) {
$(".top img").css("right", "5px");
} else {
$(".top img").css("right", "-22px");
}
$(".top").css("display", "block");
for (let index = 0; index < list_box.length; index++) {
$(list_nr[index]).css("background", arr_color[flag]);
if (flag == 4) {
flag = 0;
} else {
flag += 1;
}
if (index % 2 != 0) {
let a = $(list_box[index]);
let b = $(hx[index]);
let c = $(list_nr[index]);
let d = $(date[index]);
a.css({
"float": "right"
});
b.css({
"float": "left"
})
c.css({
"float": "right",
"margin-right": "19%"
})
d.css({
"right": 'unset',
"left": "12%"
})
}
}
$(".list").slideDown(800);
}
function move() {
if (wy > 700) {
window.history.go(0);
}
for (let index = 0; index < list_box.length; index++) {
$(list_nr[index]).css("background", arr_color[flag]);
if (flag == 4) {
flag = 0;
} else {
flag += 1;
}
}
$(".list").css("margin-top", "60px");
$(".line").css("left", "10%");
$(".dian").css("left", "10%");
$(".list_box").css("width", "100%");
$(".hx").css("float", "left");
$(".list_nr").css({
"max-height": "146px",
"line-height": "17px",
"font-size": "12px"
});
$($(".list")['0']).css("margin-top", "20px");
$(".list").slideDown(800);
}
function win() {
let width = $("body").width();
$(".line").slideDown(800, _ => {
if (width <= 700) {
move();
} else {
pc();
}
});
}
$(window).resize(win);
win();
});
$(".nr_nr").click((e) => {
if ($("body").width() <= 700) {
alert(e.delegateTarget.innerText);
}
})
$(".top img").click(_ => {
$(document).scrollTop(0);
})
var time = new Date();
var time_new = time.getTime();
var str = '2019-03-01 12:14:46';
str = str.replace(/-/g, '/');
var date = new Date(str);
var time_old = date.getTime();
var cha = (time_new - time_old)/86400000;
console.log('本站已运行'+Math.floor(cha)+'天');
// 我也不写注释了，js部分的代码，主要就是拿来兼容移动端和PC端。
</script>
</div>
</div>
</div>
</div>
</main>
<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/cungudafa/cdn/js/echarts.min.js"></script>
<style>
.journal {
padding: 12px;
border: 1px dashed #e6e6e6;
color: #969696;
position: relative;
display: inline-block;
width: 95%;
background: #fbfbfb50;
border-radius: 10px;
font-size: 16px;
margin: 12px auto;
}
* {
margin: 0;
padding: 0;
}
.box {
width: 100%;
max-width: 1200px;
min-width: 300px;
margin: 0 auto;
}
a {
text-decoration: none;
color: #ffffff;
}
.tit {
text-align: center;
padding: 40px 0;
letter-spacing: 2px;
font-size: 32px;
color: #333;
}
.min {
position: relative;
}
.line {
height: 100%;
width: 4px;
background: #666666;
position: absolute;
left: 50%;
margin-left: -2px;
display: none;
}
.vas {
padding-top: 20px;
}
.list {
width: 100%;
height: 160px;
margin-top: 40px;
position: relative;
display: none;
}
.dian {
width: 20px;
height: 20px;
background: #666666;
border-radius: 50%;
position: absolute;
left: 50%;
border: 3px solid #ffffff;
box-sizing: border-box;
margin-left: -10px;
margin-top: 5px;
z-index: 2;
}
.list_box {
width: 50%;
height: 100%;
float: left;
position: relative;
/* background: red; */
}
.hx {
width: 150px;
height: 4px;
background: #666666;
margin-top: 12px;
float: right;
z-index: 1;
}
.list_nr {
width: 65%;
height: auto;
padding: 15px;
background: #118DF0;
border-radius: 6px;
color: #f6f7f8;
float: left;
margin-top: -15px;
margin-left: 19%;
}
.nr_tit {
font-size: 16px;
font-weight: 700;
margin: 10px 0;
margin-top: 0px;
}
.nr_nr {
line-height: 25px;
position: relative;
}
.date {
position: absolute;
right: 12%;
background:#8a79af;
padding: 5px;
top: -32px;
color: #333;
border-radius: 10px;
font-size: 12px;
}
</style>
<section class="author-profile">
<div class="info" itemprop="author" itemscope="" itemtype="http://schema.org/Person">
<a href="/about/" class="profile gravatar"><img src="<%- (theme.cdn || '') + theme.avatar%>" itemprop="image" alt="hojun" height="70" width="70"></a>
<div class="meta">
<span class="title">Author</span>
<h3 itemprop="name">
<a href="<%- theme.url%>" itemprop="url" rel="author"><%- config.author %></a>
</h3>
</div>
</div>
<hr>
<p id="showStr"></p>
</section>
<!-- 一言 -->
<script type="text/javascript" src="https://api.imjad.cn/hitokoto/?cat=&charset=utf-8&length=&encode=js&fun=sync&source="></script>
<div style="display:none" id="hitokoto"><script>hitokoto()</script>
</div>
<script>
var index = 0;
var str = document.getElementById("hitokoto").innerText;
str = str.substring(10, str.length)//裁剪hitokoto()字样
function type() {
if(index == str.length) {
index = 0;
}
document.getElementById("showStr").innerText = str.substring(0, index++);
}
setInterval(type, 200); //通过定时器来让文字逐步显示
</script>
</div>
</div>
</div>
2.新增页面
hexo new page "sitelog"
生成的页面在/source/sitelog下将index.md的layout设置成sitelog
