Merge pull request #515 from chengzhongxue/main

添加Open Graph
2023-10-10 13:24:38 +08:00 · 2023-10-10 13:24:38 +08:00 · 5f5c6ef2af
parent 4b06bfc92a ca2e0e4160
commit 5f5c6ef2af
26 changed files with 230 additions and 49 deletions
--- a/settings.yaml
+++ b/settings.yaml
@ -2800,6 +2800,16 @@ spec:
              validation: required
              value: 'https://npm.onmicrosoft.cn/hao-theme-static@1.3.7/templates/assets'
              help: '默认为npmJs的onmicrosoft加速地址，如果你有自己的cdn地址（请确保链接下assets文件夹下主题静态资源文件），可以填写，否则请勿修改！ '
+        - $formkit: group
+          name: opengraph
+          label: Open Graph
+          value:
+            image:
+          children:
+            - $formkit: attachment
+              name: image
+              label: 默认图片
+              help: 如果页面没有设置图片，那么将会使用此图片作为 Open Graph 图片
        - $formkit: group
          name: vanillaLazyload
          label: 懒加载
--- a/templates/about.html
+++ b/templates/about.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'about',title = ${'关于' + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'about',title = ${'关于' + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/album.html
+++ b/templates/album.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/archives.html
+++ b/templates/archives.html
@ -1,12 +1,18 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'archive',title = ${'文章' + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'archive',title = ${'文章归档' + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = '文章归档',
+                _permalink = '/archives',
+                _cover = ${theme.config.other.opengraph.image},
+                _excerpt = ${site.seo.description},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
        <header class="not-top-img" id="page-header">
-            <nav th:replace="~{modules/nav :: nav(title = '文章')}"></nav>
+            <nav th:replace="~{modules/nav :: nav(title = '文章归档')}"></nav>
        </header>
        <main class="layout" id="content-inner">
            <!-- archive -->
--- a/templates/assets/zhheo/zhheoblog.css
+++ b/templates/assets/zhheo/zhheoblog.css
@ -113,8 +113,8 @@

@media screen and (max-width: 768px) {
    :root {
-        --style-border: 0px solid var(--heo-card-border);
-        --style-border-hover: 0px solid var(--heo-main);
+        --style-border:1px solid var(--heo-none);
+        --style-border-hover: 1px solid var(--heo-none)
    }
 }

@ -14354,8 +14354,8 @@ div#heo-footer-bar .footer-bar-description {
 }

 #bber .bber-content-link:hover {
-    background-color: var(--heo-main);
-    color: var(--heo-white);
+    background-color: var(--heo-lighttext);
+    color: var(--heo-card-bg);
 }

 #bber .bber-content-link i {
@ -14371,6 +14371,7 @@ div#heo-footer-bar .footer-bar-description {
    display: flex;
    justify-content: space-between;
    width: 100%;
+    -webkit-user-select: none
 }

 #bber .count {
--- a/templates/bangumis.html
+++ b/templates/bangumis.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'bangumis',title = ${'追番' + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'bangumis',title = ${'追番' + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = '追番',
+                _permalink = '/bangumis',
+                _cover = ${theme.config.other.opengraph.image},
+                _excerpt = ${site.seo.description},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">
    <div class="page" id="body-wrap">

--- a/templates/categories.html
+++ b/templates/categories.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'category',title = ${'分类' + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'category',title = ${'分类' + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = '分类目录',
+                _permalink = '/categories',
+                _cover = ${theme.config.other.opengraph.image},
+                _excerpt = ${site.seo.description},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/category.html
+++ b/templates/category.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'category',title = ${'分类' + ': ' + category.spec.displayName + ' | ' + site.title})}" >
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'category',title = ${'分类' + ': ' + category.spec.displayName + ' | ' + site.title}, head = ~{::head})}" >
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = '分类',
+                _permalink = ${category.status.permalink},
+                _cover = ${category.spec.cover},
+                _excerpt = ${category.spec.description},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/comments.html
+++ b/templates/comments.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'comments',title = ${singlePage.spec.title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'comments',title = ${singlePage.spec.title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/equipment.html
+++ b/templates/equipment.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/fcircle.html
+++ b/templates/fcircle.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'fcircle',title = ${singlePage.spec.title + ' | ' + site.title} )}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'fcircle',title = ${singlePage.spec.title + ' | ' + site.title}, head = ~{::head} )}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/index.html
+++ b/templates/index.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'index', title = null)}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'index', title = null, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${site.title},
+                _permalink = '',
+                _cover = ${theme.config.other.opengraph.image},
+                _excerpt = '',
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/links.html
+++ b/templates/links.html
@ -1,6 +1,13 @@
 <!DOCTYPE html>
 <html lang="en"  xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'links',title = ${'友链' + ' | ' + site.title})}">
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'links',title = ${'友链' + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = '友链',
+                _permalink = '/links',
+                _cover = ${theme.config.other.opengraph.image},
+                _excerpt = ${site.seo.description},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/modules/common/open-graph.html
+++ b/templates/modules/common/open-graph.html
@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+<th:block th:fragment="open-graph(_title,_permalink,_cover,_excerpt,_type)">
+    <!-- Open Graph Start -->
+    <meta property="og:site_name" th:content="${site.title}" />
+    <meta property="og:type" th:content="${_type}" />
+    <meta property="og:title" th:content="${_title}" />
+    <meta property="og:url" th:content="|${site.url}${_permalink}|" />
+    <meta
+            th:unless="${#strings.isEmpty(_excerpt) and #strings.isEmpty(site.seo.description)}"
+            property="og:description"
+            th:content="${excerpt ?: site.seo.description}"
+    />
+    <meta
+            th:unless="${#lists.isEmpty(_cover)}"
+            property="og:image"
+            th:content="${_cover}"
+    />
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta name="twitter:title" th:content="${_title}" />
+    <meta name="twitter:url" th:content="|${site.url}${_permalink}|" />
+    <meta
+            th:unless="${#strings.isEmpty(_excerpt) and #strings.isEmpty(site.seo.description)}"
+            name="twitter:description"
+            th:content="${_excerpt ?: site.seo.description}"
+    />
+    <meta
+            th:unless="${#lists.isEmpty(_cover)}"
+            name="twitter:image"
+            th:content="${_cover}"
+    />
+    <!-- Open Graph End -->
+</th:block>
+</html>
--- a/templates/modules/layouts/layout.html
+++ b/templates/modules/layouts/layout.html
@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html lang="en" th:fragment="layout(content, htmlType, title)" xmlns:th="http://www.thymeleaf.org"
+<html lang="en" th:fragment="layout(content, htmlType, title, head)" xmlns:th="http://www.thymeleaf.org"
      th:with="assets_link=${theme.config.other.staticResource.use == 'onmicrosoft' ? 'https://npm.onmicrosoft.cn/hao-theme-static@' + theme.spec.version +'/templates/assets' :
      theme.config.other.staticResource.use == 'cbd' ? 'https://cdn.cbd.int/hao-theme-static@' + theme.spec.version +'/templates/assets' :
      theme.config.other.staticResource.use == 'custom' ? theme.config.other.staticResource.cdn_link : #theme.assets('/')},
@ -17,6 +17,10 @@
      rel="stylesheet" th:href="${not #strings.isEmpty(theme.config.comments.walines.walinesCss) ? theme.config.comments.walines.walinesCss : 'https://cdn.cbd.int/@waline/client@2.15.7/dist/waline.css' }">
    <!--  解决 katex pjax问题 -->
    <script th:if="${pluginFinder.available('plugin-katex')}" defer="" src="/plugins/plugin-katex/assets/static/katex.min.js"></script>
+
+    <th:block th:if="${head != null}">
+        <th:block th:replace="${head}" />
+    </th:block>
 </head>

 <body>
@ -133,9 +137,8 @@
    <script>
        let pjaxSelectors = ['title', '#config-diff', '#body-wrap', '#rightside-config-hide', '#rightside-config-show', '.js-pjax','#site-config']

-        if (false) {
-            pjaxSelectors.unshift('meta[property="og:image"]', 'meta[property="og:title"]', 'meta[property="og:url"]')
-        }
+        pjaxSelectors.unshift('meta[property="og:type"]','meta[property="og:image"]', 'meta[property="og:title"]', 'meta[property="og:url"]', 'meta[property="og:description"]'
+                , 'meta[name="twitter:card"]', 'meta[name="twitter:title"]', 'meta[name="twitter:url"]', 'meta[name="twitter:description"]', 'meta[name="twitter:image"]')

        var pjax = new Pjax({
            elements: 'a:not([target="_blank"])',
--- a/templates/moments.html
+++ b/templates/moments.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'moments',title = ${title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'moments',title = ${title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = '瞬间',
+                _permalink = '/moments',
+                _cover = ${theme.config.other.opengraph.image},
+                _excerpt = ${site.seo.description},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/music.html
+++ b/templates/music.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'music',title = ${singlePage.spec.title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'music',title = ${singlePage.spec.title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/new_comment.html
+++ b/templates/new_comment.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'newComment',title = ${singlePage.spec.title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'newComment',title = ${singlePage.spec.title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/page.html
+++ b/templates/page.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/page_links.html
+++ b/templates/page_links.html
@ -1,6 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title})}">
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/photos.html
+++ b/templates/photos.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content},htmlType = 'photos',title = ${title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content},htmlType = 'photos',title = ${title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = '图库',
+                _permalink = '/photos',
+                _cover = ${theme.config.other.opengraph.image},
+                _excerpt = ${site.seo.description},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/post.html
+++ b/templates/post.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'post',title = ${post.spec.title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'post',title = ${post.spec.title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${post.spec.title},
+                _permalink = ${post.status.permalink},
+                _cover = ${post.spec.cover},
+                _excerpt = ${post.status.excerpt},
+                _type = 'article')}"></th:block>
+</th:block>
 <th:block th:fragment="content">
    <div class="post" id="body-wrap">

--- a/templates/tag.html
+++ b/templates/tag.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'tag',title = ${'标签' + ': ' + tag.spec.displayName + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'tag',title = ${'标签' + ': ' + tag.spec.displayName + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${tag.spec.displayName},
+                _permalink = ${tag.status.permalink},
+                _cover = ${tag.spec.cover},
+                _excerpt = ${site.seo.description},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/tags.html
+++ b/templates/tags.html
@ -1,7 +1,14 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content},htmlType = 'tag',title = ${'标签' + ' | ' + site.title})}">
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content},htmlType = 'tag',title = ${'标签' + ' | ' + site.title}, head = ~{::head})}">

+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = '标签',
+                _permalink = '/tags',
+                _cover = ${theme.config.other.opengraph.image},
+                _excerpt = ${site.seo.description},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/templates/todolist.html
+++ b/templates/todolist.html
@ -1,7 +1,13 @@
 <!DOCTYPE html>
 <html lang="en" xmlns:th="http://www.thymeleaf.org"
-      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title})}">
-
+      th:replace="~{modules/layouts/layout :: layout(content = ~{::content}, htmlType = 'page',title = ${singlePage.spec.title + ' | ' + site.title}, head = ~{::head})}">
+<th:block th:fragment="head">
+    <th:block th:replace="~{modules/common/open-graph :: open-graph(_title = ${singlePage.spec.title},
+                _permalink = ${singlePage.status.permalink},
+                _cover = ${singlePage.spec.cover},
+                _excerpt = ${singlePage.status.excerpt},
+                _type = 'website')}"></th:block>
+</th:block>
 <th:block th:fragment="content">

    <div class="page" id="body-wrap">
--- a/theme.yaml
+++ b/theme.yaml
@ -2,6 +2,10 @@ apiVersion: theme.halo.run/v1alpha1
 kind: Theme
 metadata:
  name: theme-hao
+  annotations:
+    # Add supports for Halo App Store
+    # https://halo.run/store/apps/app-MgZJX
+    "store.halo.run/app-id": "app-MgZJX"
 spec:
  displayName: Hao
  author:
@ -48,7 +52,7 @@ spec:
  description: Halo 2.x Theme base on Thymeleaf, Referring to Butterfly and Heo
  logo: https://liuzhihang.com/upload/logo.jpg
  website: https://liuzhihang.com
-  repo: https://github.com/liuzhihang/halo-theme-hao
+  repo: https://githubfast.com/liuzhihang/halo-theme-hao
  settingName: "theme-hao-setting"
  configMapName: "theme-hao-configMap"
  version: "1.3.9"