diff --git a/layouts/partials/after-content-js.html b/layouts/partials/after-content-js.html
index a10b600..85fba90 100644
--- a/layouts/partials/after-content-js.html
+++ b/layouts/partials/after-content-js.html
@@ -9,4 +9,7 @@
             $(this).attr("red", true);
         }
     });
-</script>
\ No newline at end of file
+</script>
+
+<!-- fancybox -->
+<script src="https://cdn.jsdelivr.net/npm/@fancyapps/ui/dist/fancybox.umd.js"></script>
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 1da333a..3a89563 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -31,5 +31,8 @@
 <!-- the Moments style css file -->
 <link rel="stylesheet" type="text/css" href="{{.Site.BaseURL}}/css/style.css">
 
+<!-- fancybox css (js in the end before the body closing tag) -->
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fancyapps/ui/dist/fancybox.css"/>
+
 <!-- website title -->
 <title>{{ .Site.Params.title }}</title>
\ No newline at end of file
diff --git a/layouts/partials/pic_set.html b/layouts/partials/pic_set.html
index d5f4623..21ca548 100644
--- a/layouts/partials/pic_set.html
+++ b/layouts/partials/pic_set.html
@@ -13,11 +13,11 @@
         {{range $num,$a := .pic_set}}
         {{if eq $num 0 }}
         <div class="carousel-item active">
-            <img src="{{$a}}" class="d-block w-100 pic-in-set" alt="{{add $num 1}}">
+            <img src="{{$a}}" class="d-block w-100 pic-in-set" alt="{{add $num 1}}" data-fancybox="gallery">
         </div>
         {{else}}
         <div class="carousel-item">
-            <img src="{{$a}}" class="d-block w-100 pic-in-set" alt="{{add $num 1}}">
+            <img src="{{$a}}" class="d-block w-100 pic-in-set" alt="{{add $num 1}}" data-fancybox="gallery">
         </div>
         {{end}}
         {{end}}
diff --git a/layouts/partials/row.html b/layouts/partials/row.html
index ce79bf6..19c93a0 100644
--- a/layouts/partials/row.html
+++ b/layouts/partials/row.html
@@ -53,7 +53,7 @@
 
             <!-- 图片 -->
             {{ with .Params.pic }}
-                <img src="{{ . }}" class="img-fluid pic1" alt="Responsive image"></img>
+                <img src="{{ . }}" class="img-fluid pic1" alt="Responsive image" data-fancybox="gallery"></img>
             {{ end }}
 
             <!-- 图片集  -->