Colinx-Blog/layouts/partials/footer.html

<div id="gitalk-container" style="
    margin: 20px auto;
    max-width: 800px;
    padding: 20px;
    width: 100%;
    text-align: left;
"></div>
<div class='js-toc'></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/tocbot/4.11.1/tocbot.min.js"></script>
<script>
    tocbot.init({
        // Where to render the table of contents.
        tocSelector: '.js-toc',
        // Where to grab the headings to build the table of contents.
        contentSelector: '.post-content',
        // Which headings to grab inside of the contentSelector element.
        headingSelector: 'h1, h2, h3',
        // For headings inside relative or absolute positioned containers within content.
        hasInnerContainers: true,
    });
</script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tocbot/4.11.1/tocbot.css">
<style>
    @media (min-width: 1560px) {
        .js-toc {
            display: block !important;
        }
    }

    .js-toc {
        display: none;
        /* IE and Edge */
        -ms-overflow-style: none;
        /* Firefox */
        scrollbar-width: none;
    }

    .js-toc::-webkit-scrollbar {
        /* Chrome, Safari and Opera */
        display: none;
    }

    .js-toc {
        position: fixed;
        width: 20%;
        max-width: 400px;
        right: 3rem;
        top: 10em;
        text-align: left;
        overflow-y: scroll;
        overflow-x: hidden;
        padding: 1rem 0rem;
    }

    ol.toc-list>li>a:hover {
        text-underline-position: under;
        font-weight: bolder;
    }

    .toc-list li {
        list-style: none;
    }

    .toc-list a {
        text-decoration: none;
        text-overflow: ellipsis;
        display: inline-block;
        white-space: nowrap;
        font-size: 1rem;
    }
</style>

<footer class="footer">
    <span id="busuanzi_container_site_pv" style='display:none'>
        嗨，第<span id="busuanzi_value_site_pv"></span>位小伙伴 : )
    </span>

    <div class="footer__inner">
        {{ if $.Site.Copyright }}
        <div class="copyright copyright--user">{{ $.Site.Copyright | safeHTML }}</div>
        {{ else }}
        {{ partial "logo.html" . }}
        <div class="copyright">
            <span>© {{ now.Year }} Powered by
                <a href="https://gohugo.io" target="_blank" rel="noopener">Hugo</a></span>
            <span>Theme created by
                <a href="https://twitter.com/panr" target="_blank" rel="noopener">panr</a></span>
        </div>
        {{ end }}
    </div>
</footer>

<script src="{{ "assets/main.js" | absURL }}"></script>
<script async src="{{ "assets/prism.js" | absURL }}"></script>
<script src="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.min.js"></script>

<script>
    meta = document.querySelectorAll('.post:not(.on-list) .post-meta')[0];
    var visitors = `<span id="busuanzi_container_page_pv" style='display:none'> 浏览：<span id="busuanzi_value_page_pv"></span>次</span>`
    if (meta) meta.innerHTML = meta.innerHTML + visitors
</script>

<script>
    const gitalk = new Gitalk({
        clientID: '94eae56b89dcc480bf4d',
        clientSecret: '1e4218c0293a998a9483ab09ba9ace46cabc76b3',
        repo: 'Colinx-Blog',      // The repository of store comments,
        owner: 'Colin-XKL',
        admin: ['Colin-XKL'],
        id: decodeURI(location.pathname),  // Ensure uniqueness and length less than 50
        distractionFreeMode: false  // Facebook-like distraction free mode
    });
    gitalk.render('gitalk-container');
</script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/gitalk@1/dist/gitalk.css">
<!-- Sentry -->
<script src="https://browser.sentry-cdn.com/6.15.0/bundle.tracing.min.js"
    integrity="sha384-1k7XKRQgqjUbNyG2sI+qsY8HTHMOeLdycMx6hoGuNSANZ3WrMa3LXkr+M4t+SIpF"
    crossorigin="anonymous"></script>
<script>
    Sentry.init({
        dsn: "https://446fb53b106744b1b70e1074e68a5e71@o850059.ingest.sentry.io/6077493",
        integrations: [new Sentry.Integrations.BrowserTracing()],
        // Set tracesSampleRate to 1.0 to capture 100%
        // of transactions for performance monitoring.
        // We recommend adjusting this value in production
        tracesSampleRate: 1.0,
    });
</script>

{{- partial "extended_footer.html" . }}