页脚金色Halo
Halo设置 -> 代码注入 -> 全局Head 中注入
<script>
/* Halo Pro */
document.addEventListener('DOMContentLoaded', function () {
const link = document.querySelector('footer a[href*="https://halo.run"]');
if(link) {
link.textContent = 'Halo Pro ' + '[[${site.version}]]';
}
const themePlus2 = document.querySelector('footer a[href*="https://github.com/hcjike/halo-theme-dream2.0-plus"]');
if(themePlus2) {
themePlus2.textContent = 'Dream2 Plus ' + '[[${theme.spec.version}]]';
}
});
</script>
<style>
/* 页脚的链接文本动画效果 */
@keyframes maskedAnimation {
0% {
background-position: 0 0;
}
100% {
background-position: -100% 0;
}
}
footer .footer-copyright {
font-weight: bold;
background-image: -webkit-linear-gradient(left, #ffdd00, #3e2f08 25%, #ffdd00 50%, #3e2f08 75%, #ffdd00);
-webkit-text-fill-color: transparent;
-webkit-background-clip: text;
-webkit-background-size: 200% 100%;
-webkit-animation: maskedAnimation 1s infinite linear;
}
</style>侧边栏金色Halo
Halo设置 -> 代码注入 -> 全局Head 中注入
<style>
@keyframes haloProMasked {
0% { background-position: 0 0; }
100% { background-position: -100% 0; }
}
footer .footer-copyright,
#halo-version-span,
#theme-version-span {
font-weight: bold;
background-image: linear-gradient(90deg, #ffdd00, #3e2f08 25%, #ffdd00 50%, #3e2f08 75%, #ffdd00);
background-size: 200% 100%;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
animation: haloProMasked 1s linear infinite;
}
</style>
<script>
(function () {
var BLOG_TARGET = '#halo-version-span';
var THEME_TARGET = '#theme-version-span';
function haloVersion() {
var m = document.querySelector('meta[name="generator"]');
return m ? (m.getAttribute('content') || '').replace(/^Halo\s*/i, '').trim() : '';
}
function themeVersion() {
try {
if (typeof DreamConfig !== 'undefined' && DreamConfig && DreamConfig.theme_version) {
return String(DreamConfig.theme_version);
}
} catch (e) {}
return '';
}
function apply() {
var footer = document.querySelector('footer.footer') || document.querySelector('footer');
if (!footer) return false;
var hv = haloVersion();
var tv = themeVersion();
var blogText = '博客:Halo Pro' + (hv ? ' ' + hv : '');
var themeText = '主题:Dream2 Plus' + (tv ? ' ' + tv : '');
var blogEl = document.querySelector(BLOG_TARGET);
var themeEl = document.querySelector(THEME_TARGET);
if (blogEl) blogEl.textContent = blogText;
if (themeEl) themeEl.textContent = themeText;
if (!blogEl) {
var haloLink = footer.querySelector('a.footer-copyright-halo')
|| footer.querySelector('a[href*="halo.run"]');
if (haloLink) haloLink.textContent = 'Halo Pro' + (hv ? ' ' + hv : '');
}
if (!themeEl) {
var themeLink = footer.querySelector('.footer-copyright a[href*="github.com"]');
if (themeLink) themeLink.textContent = 'Dream2 Plus' + (tv ? ' ' + tv : '');
}
console.log('[halo-pro]', !!blogEl, !!themeEl, 'theme=' + tv);
return true;
}
function tryApply(n) {
if (apply()) return;
if (n > 0) setTimeout(function () { tryApply(n - 1); }, 100);
}
if (!window.__haloProBound) {
window.__haloProBound = true;
document.addEventListener('pjax:success', function () { tryApply(10); });
document.addEventListener('pjax:complete', function () { tryApply(10); });
document.addEventListener('DOMContentLoaded', function () { tryApply(10); });
}
tryApply(10);
})();
</script>侧边栏信息
主题 -> 侧边栏配置 -> 侧边栏展示
模块类型:公告模块与自定义模块均可使用。
侧边栏内容:
<b>站点信息:</b>
<div style="display: flex; align-items: center;color: var(--main);margin-top: 10px;">
<i class="hc-dongtaitiaocha ri-news-line" style="color: var(--theme);font-size: 1.3em;margin-right:5px;"></i>
<b><span id="halo-version-span"></span></b>
</div>
<div style="display: flex; align-items: center;color: var(--main);margin-top: 10px;">
<i class="hc-zhuti1 ri-t-shirt-2-line" style="color: var(--theme);font-size: 1.3em;margin-right:5px;"></i>
<b><span id="theme-version-span"></span></b>
</div>
<!-- 当不需要站点隐私策略时,下方内容全部删除即可。 -->
<div style="display: flex; align-items: center;color: var(--main);margin-top: 10px;">
<i class="hc-yinsizhengce ri-git-repository-private-line" style="color: var(--theme);font-size: 1.3em;margin-right:5px;"></i>
<div>
点击查看本站<a style="cursor: var(--cursor-pointer); color: var(--theme) !important;" href="/privacy-policy" title="隐私政策"><b>隐私政策</b></a>
</div>
</div>
<i class="hc-为本站使用的iconfont图标,请根据实际需求替换为相应的图标类名。或者保留ri-前缀的 class内容以使用内置图标。