diff --git a/data/assets.yaml b/data/assets.yaml
index ba1e3e13..47682243 100644
--- a/data/assets.yaml
+++ b/data/assets.yaml
@@ -35,4 +35,11 @@ mermaid:
   version: 8.9.2
   js:
     url: https://cdn.jsdelivr.net/npm/mermaid@%s/dist/mermaid.min.js
-    sri: sha256-Zmpaaj+GXFsPF5WdPArSrnW3b30dovldeKsW00xBVwE=
\ No newline at end of file
+    sri: sha256-Zmpaaj+GXFsPF5WdPArSrnW3b30dovldeKsW00xBVwE=
+
+# Valine
+valine:
+  version: 1.4.14
+  js:
+    url: https://cdn.jsdelivr.net/npm/valine@%s/dist/Valine.min.js
+    sri: sha256-fPqMAsW3FDt/rNyneSJ7HOpZNRs/O2rM016SU08JtCk=
diff --git a/exampleSite/config/_default/params.yaml b/exampleSite/config/_default/params.yaml
index 5eaeaf26..16e50938 100644
--- a/exampleSite/config/_default/params.yaml
+++ b/exampleSite/config/_default/params.yaml
@@ -19,7 +19,7 @@ publisherLogo:
 
 highlight:
   handler: highlightjs
-  
+
   highlightjs:
     # highlight.js doesn't bundle every language. So please specify additional languages you want here.
     # See https://github.com/highlightjs/cdn-release/tree/master/build/languages for available languages.
@@ -40,7 +40,7 @@ math:
   #   leqno:
 
 comment:
-  # Options: disqus, commento and utterances.
+  # Options: disqus, commento, valine and utterances.
   handler:
 
   # disqus:
@@ -57,6 +57,14 @@ comment:
   #   # If self-hosting, please enter the url (e.g. https://commento.example.com) here. Otherwise leave empty.
   #   url:
 
+  valine:
+    # Browse https://valine.js.org/configuration.html to see the options available.
+    # You can list the key and value you want as below.
+    # Because Hugo's config params are case-insensitive, you need to add `-` or `_` before the uppercase letters.
+    # For example, `appId` should be written as `app-Id` or other acceptable formats.
+    app-Id:
+    app-Key:
+
 diagram:
   handler: mermaid
 
diff --git a/layouts/partials/comment/valine.html b/layouts/partials/comment/valine.html
new file mode 100644
index 00000000..7a5a7ce4
--- /dev/null
+++ b/layouts/partials/comment/valine.html
@@ -0,0 +1,14 @@
+<div id="valine-comments" class="mt-4"></div>
+{{- $assets := .Site.Data.assets }}
+<script defer src="{{ printf $assets.valine.js.url $assets.valine.version }}" {{ with $assets.valine.js.sri }}
+  integrity="{{ . }}" {{ end }} crossorigin></script>
+{{- with .Site.Params.comment.valine }}
+<script>
+  document.addEventListener("DOMContentLoaded", function () {
+    new Valine({
+      el: "#valine-comments",
+      {{- partial "utils/get-js-configs" . | safeJS }}
+    })
+  });
+</script>
+{{- end }}
\ No newline at end of file