新增 og image

builder/detail/index.html

@@ -35,6 +35,7 @@
   <meta property="og:title" content="幸福空間 - 台灣最大的室內設計、設計師與設計個案影音平台" />
   <meta property="og:type" content="website" />
   <meta property="og:locale" content="zh_TW" />
+  <meta property="og:image" content="">
   <meta name="twitter:card" content="summary">
   <meta name="twitter:site" content="@幸福空間">
   <meta name="twitter:title" content="幸福空間">

builder/detail/js/main.js

@@ -163,10 +163,14 @@ async function getData() {
     $("#service_phone").attr("href", "tel:" + data.service_phone);
     $("#detail").text(data.detail);
 
+    // 封面圖片
+    const coverImage = data.img.find(image => image.is_cover === 1);
+
     // Header
     $('title').text(`${data.name} - 幸福空間`);
     $('meta[name="description"]').attr('content', `${data.detail}`);
     $('meta[property="og:title"]').attr('content', `${data.name} - 幸福空間`);
+    $('meta[property="og:image"]').attr('content', `${coverImage.name}`);
     $('meta[property="og:description"]').attr('content', `${data.detail}`);
     $('meta[name="twitter:title"]').attr('content', `${data.name} - 幸福空間`);
     $('meta[name="twitter:description"]').attr('content', `${data.detail}`);

hhh_index.html

@@ -2318,28 +2318,28 @@
               <div class="d-flex flex-column align-items-center">
                 <section class="media">
                   <a href="https://www.facebook.com/hhhfb" target="_blank">
-                    <img src="../../img/media/fb.svg" alt="Facebook" class="media-item before">
-                    <img src="../../img/media/fb_h.svg" alt="Facebook" class="media-item after">
+                    <img src="./img/media/fb.svg" alt="Facebook" class="media-item before">
+                    <img src="./img/media/fb_h.svg" alt="Facebook" class="media-item after">
                   </a>
                   <a href="https://page.line.me/ovs4341s?openQrModal=true" target="_blank">
-                    <img src="../../img/media/ln.svg" alt="Line" class="media-item before">
-                    <img src="../../img/media/ln_h.svg" alt="Line" class="media-item after">
+                    <img src="./img/media/ln.svg" alt="Line" class="media-item before">
+                    <img src="./img/media/ln_h.svg" alt="Line" class="media-item after">
                   </a>
                   <a href="https://www.youtube.com/user/gorgeousspace" target="_blank">
-                    <img src="../../img/media/yt.svg" alt="YouTube" class="media-item before">
-                    <img src="../../img/media/yt_h.svg" alt="YouTube" class="media-item after">
+                    <img src="./img/media/yt.svg" alt="YouTube" class="media-item before">
+                    <img src="./img/media/yt_h.svg" alt="YouTube" class="media-item after">
                   </a>
                   <a href="https://www.instagram.com/gorgeous_space/" target="_blank">
-                    <img src="../../img/media/ig.svg" alt="Instagram" class="media-item before">
-                    <img src="../../img/media/ig_h.svg" alt="Instagram" class="media-item after">
+                    <img src="./img/media/ig.svg" alt="Instagram" class="media-item before">
+                    <img src="./img/media/ig_h.svg" alt="Instagram" class="media-item after">
                   </a>
                   <!-- <a href="" target="_blank">
-                    <img src="../../img/media/rb.svg" alt="" class="media-item before">
-                    <img src="../../img/media/rb_h.svg" alt="" class="media-item after rounded-circle">
+                    <img src="./img/media/rb.svg" alt="" class="media-item before">
+                    <img src="./img/media/rb_h.svg" alt="" class="media-item after rounded-circle">
                   </a> -->
                   <a href="https://www.tiktok.com/@gorgeousspace" target="_blank">
-                    <img src="../../img/media/tt.svg" alt="Tiktok" class="media-item before">
-                    <img src="../../img/media/tt_h.svg" alt="Tiktok" class="media-item after rounded-circle">
+                    <img src="./img/media/tt.svg" alt="Tiktok" class="media-item before">
+                    <img src="./img/media/tt_h.svg" alt="Tiktok" class="media-item after rounded-circle">
                   </a>
                 </section>
                 <!-- <section class="fb-list">