该主题在halo博客Sakura的基础上进行了更改
友情链接部分
-
大佬分组样式:<div class="note warning" style="width:100%;font-size:19px;font-family: cursive,Noto Serif SC,sans-serif;margin: 30px 0 10px 0;">? 大佬 —— 没有不劳而获的工作,更没有坐享其成的收获</div> 朋友分组样式:<div class="note primary" style="width:100%;font-size:19px;font-family: cursive,Noto Serif SC,sans-serif;margin: 30px 0 10px 0;">?️ 朋友 —— 你的春日好运正在派件,请保持心情舒畅</div> 邻居分组样式:<div class="note info" style="width:100%;font-size:19px;font-family: cursive,Noto Serif SC,sans-serif;margin: 30px 0 10px 0;">? 邻居 —— 相逢一醉是前缘,风雨散、飘然何处</div>
剪刀样式
-
代码如下,在需要的页面加入或者统一放在
header.ftl中
,应为大部分页面都会用到header.ftl
/* 美化 hr 样式 */ hr { position: relative; margin: 2rem auto; width: calc(100% - 4px); border: 2px dashed #a4d8fa; background: #fff; } hr { box-sizing: content-box; height: 0; overflow: visible; } hr:before { position: absolute; top: -10px; left: 5%; z-index: 1; color: #49b1f5; content: '\f0c4'; font: normal normal normal 14px/1 FontAwesome; font-size: 20px; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; -ms-transition: all 1s ease-in-out; transition: all 1s ease-in-out; } hr:hover::before{ left: 95%; }
友情链接部分:
- 放在
tpl\content-links.ftl
路径下,自行更改名称和url
即可
- 友情链接留言区,由于不会使用<#macro 标签,只能曲线救国,先写一篇文章,保存到草稿箱,然后点击这里,进入记住这里的id,然后替换这个位置的id
顶部图标部分
-
底部运行状态,访客数等:
-
需在主题中配置站点成立时间和是否开启访客数统计,代码路径:根目录的
footer.ftl
<div class="footer-device"> <p> © ${.now?string("yyyy")} <i class="iconfont icon-sakura rotating" style="color: #ffc0cb;display:inline-block"></i> ${(user.nickname)!} <#if settings.footer_case_number?? && settings.footer_case_number != ""> <a href="https://beian.miit.gov.cn/" target="_blank">${settings.footer_case_number}</a> </#if> <#if settings.footer_ga_case_number?? && settings.footer_ga_case_number != ""> <a href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=${settings.footer_ga_select_number!}" target="_blank"> <img src="${res_base_url!}/source/images/other/gongan.png">${settings.footer_ga_case_number} </a> </#if> </p> <div class="github-badge"> <a style="color: #fff" rel="license" href="http://halo.run" target="_blank" title="由 Halo 驱动" data-pjax-state=""> <span class="badge-subject">Powered</span> <span class="badge-value bg-blue">Halo</span> </a> </div> <div class="github-badge"> <a style="color: #fff" rel="license" href="https://github.com/LIlGG/halo-theme-sakura" target="_blank" title="本站主题为 Sakura 主题" data-pjax-state=""> <span class="badge-subject">Theme</span> <span class="badge-value bg-red">Sakura</span> </a> </div> <div class="github-badge"> <a style="color: #fff" rel="license" href="https://cloud.tencent.com/" target="_blank" title="运行于腾讯云轻量服务器" data-pjax-state=""> <span class="badge-subject">Hosted</span> <span class="badge-value bg-brightgreen">腾讯云</span> </a> </div> <div class="github-badge"> <span class="badge-subject">访客数</span> <span class="badge-value bg-orange" id="busuanzi_value_site_uv" target="_blank" title="本站访客量"></span> </div> <div class="github-badge"> <span class="badge-subject">访问量</span> <span class="badge-value bg-orange" id="busuanzi_value_site_pv" target="_blank" title="本站浏览量"></span> </div> <div class="github-badge"> <span class="badge-subject">运行</span> <span class="badge-value bg-blueviolet" target="_blank" title="本站已运行"><span id="span_dt_dt"></span></span> </div> </div>
-
又拍云css代码
-
调整样式,文字和图片可以对其
<a href="https://www.upyun.com/?utm_source=lianmeng&utm_medium=referral" style="display:flex;justify-content: center;align-content: center;"><span style="line-height:30px;">本站由</span> <img src="https://images.chenmx.net/youpaiyun5.png" align="absmiddle" width="59px" height="30px"> <span style="line-height:30px;">提供加速服务</span> </a>
文章状态等
- 无须额外配置,已写死在代码中
统计页面部分
- 需要配合我的另一个项目使用,项目地址:
https://gitee.com/cgd0526/xxl-job-executor
,前端文件放在根目录下的sheet_tongji.ftl
- 新建一个页面
- 选择正确的模板
- 添加到菜单中即可
休闲页面
-
代码在根目录的
sheet_lie.ftl
,主要代码<div class="note info"> <a style="display:flex;justify-content: left;align-content: center;"><span style="line-height:30px;"></span> <i class="fa fa-gamepad fa-2x fa-fw" aria-hidden="false" align="absmiddle" width="59px" height="30px"></i> <span style="line-height:35px;"> 休闲之际,来放松下吧OωO</span> </a> </div> <ul class="nav nav-pills nav-stacked"> <li role="presentation" class="dropdown"> <a href="https://yun.chenmx.net/mikutap/index.html" target="_blank"> mikutap</a> </li> <li role="presentation" class="dropdown"> <a href="https://yun.chenmx.net/battlecity/index.html" target="_blank"> 坦克大战</a> </li> <li role="presentation" class="disabled"><a href="#"> 虚位以待</a></li> </ul> <hr /> </div>
-
配置方式同统计页面
空调房
-
代码在根目录的
sheet_air-conditioning.ftl
,主要代码<div class="note info"> 我在此处安装了空调,您可以在此自由休憩。 </div> <div class="sheet-content"> <iframe width="100%" height="785px" frameborder="0" scrolling="no" src="https://yun.chenmx.net/build/index.html"></iframe> </div>
-
配置方式同统计页面
点击特效
-
引入小心心
//引入小心心特效 <script src="https://cdn.jsdelivr.net/gh/Sanarous/files@1.151/js/clicklove.js"></script>
-
引入社会主义核心价值观
//社会主义核心价值观 <script src="https://cdn.jsdelivr.net/gh/Sanarous/files@1.151/js/clicksocialvalue.js"></script>
-
引入小花花
//花花特效 <script src="https://cdn.jsdelivr.net/gh/Sanarous/files@1.151/js/click.min.js"></script>
感觉加上太卡,所以我都去掉了,哈哈哈。
后续
- 代码Gitee仓库地址前端我是真的不会,在征得各位大佬的意见后就都抄过来了,后续有新的样式,也会在此仓库提交
- 如果有加互加友链的友友们,欢迎留言,看到了就会加上~~~~
评论区