这不止是一篇测试

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

<!-- emoji 可为多个，但必须要在前面的可识别列表里出现 -->
<open-heart href="yourworker'slink/{{ .Permalink }}" emoji="❤️">❤️</open-heart>

<!-- load web component -->
<script src="https://unpkg.com/open-heart-element" type="module"></script>
<!-- when the webcomponent loads, fetch the current counts for that page -->
<script>
  // 封装 open-heart 组件初始化功能
  function initOpenHeart() {
    window.customElements.whenDefined('open-heart').then(() => {
      document.querySelectorAll('open-heart').forEach(oh => {
        oh.getCount();
      });
    });

    // 绑定 open-heart 组件的点击刷新事件
    window.addEventListener('open-heart', e => {
      e?.target?.getCount && e.target.getCount();
    });
  }

  // 在页面初次加载时调用
  initOpenHeart();

  // 监听 Pjax 完成事件并调用封装的函数
  document.addEventListener('pjax:complete', function () {
    initOpenHeart();
  });
</script>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

<article class="{{ if .Params.image }}has-image {{ end }}main-article">
    {{ partial "article/components/header" . }}

    {{ partial "article/components/content" . }}

    <!-- Add reaction -->
    {{ if and (ne .Params.showreaction false) }}
    {{ partial "article/components/reaction.html" . }}
    {{ end }}
    {{ partial "article/components/footer" . }}

    {{ if or .Params.math .Site.Params.article.math }}
        {{ partialCached "article/components/math.html" . }}
    {{ end }}
</article>

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77

{{ if .Site.Params.enableimgloop }}
    <div class="swiper-container">
        <div class="swiper-wrapper">
            {{$itItems := split (.Get 0) ","}}
            {{range $itItems }}
            <div class="swiper-slide">
                <img src="{{.}}" alt="" data-fancybox>
            </div>
            {{end}}
        </div>
        <!-- Add Pagination -->
        <div class="swiper-pagination"></div>
    </div>

    <script>
        // 动态加载 CSS 文件
        function loadCSS(url) {
            var link = document.createElement("link");
            link.rel = "stylesheet";
            link.href = url;
            document.head.appendChild(link);
        }

        // 动态加载 JS 文件
        function loadJS(url, callback) {
            var script = document.createElement("script");
            script.src = url;
            script.onload = callback;
            document.body.appendChild(script);
        }

        // 封装 Swiper 初始化逻辑
        function initializeSwiper() {
            // 加载 Swiper 的 CSS
            loadCSS("https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.2/css/swiper.min.css");

            // 加载 Swiper JS 并在加载完成后初始化
            loadJS("https://cdnjs.cloudflare.com/ajax/libs/Swiper/3.4.2/js/swiper.min.js", function() {
                var swiper = new Swiper('.swiper-container', {
                    pagination: '.swiper-pagination',
                    paginationClickable: true,
                    autoHeight: true,
                    keyboardControl: true,
                    mousewheelControl: true,
                    lazyLoading: true,
                    lazyLoadingInPrevNext: true,
                    loop: true,
                });

                swiper.on('init', function () {
                    var slides = document.querySelectorAll('.swiper-slide');
                    slides.forEach(function (slide) {
                        var images = slide.querySelectorAll('.img-zoomable');
                        images.forEach(function (image) {
                            mediumZoom(image, {
                                margin: 32,
                                background: '#00000054',
                                scrollOffset: 128,
                            });
                        });
                    });
                });
            });
        }

        // 页面初次加载时调用
        document.addEventListener('DOMContentLoaded', function () {
            initializeSwiper();
        });

        // PJAX 加载完成后调用
        document.addEventListener('pjax:complete', function () {
            initializeSwiper();
        });
    </script>
{{ end }}

1

<video id="video" controls="" controlslist="nodownload" preload="none" allowfullscreen="true" position="absolute" width="100%" loop="true" {{ if .Get "poster" }}poster="{{ .Get "poster" }}"{{ end }}><source id="mp4" src="{{ .Get "src" }}" type="video/mp4"></video>

1
2

{\{< video poster="封面链接（不填则默认无封面）" src="视频链接" >}\}