页脚金色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内容以使用内置图标。