โซเชียลปลั๊กอิน

ปลั๊กอินกลุ่ม

ปลั๊กอินกลุ่มช่วยให้ผู้คนสามารถเข้าชมกลุ่มบน Facebook ของคุณจากลิงก์ในเว็บเพจได้

ปลั๊กอินกลุ่มสำหรับเว็บ

ปลั๊กอินกลุ่มสำหรับเว็บคือปลั๊กอินที่เพิ่มปุ่มเข้าชมกลุ่มไปยังเว็บเพจของคุณ ซึ่งเมื่อคลิกปุ่มนี้ ระบบจะเปลี่ยนเส้นทางผู้ใช้ไปยังกลุ่มบน Facebook ของคุณ ปลั๊กอินดังกล่าวใช้ Facebook SDK สำหรับ JavaScript เพื่อแสดงปุ่มในเว็บเพจของคุณ

ก่อนเริ่มต้น

หากต้องการฝังปลั๊กอินกลุ่มในเว็บเพจ คุณจำเป็นต้องมีและดำเนินการดังต่อไปนี้

ข้อจำกัด

  • ปลั๊กอินกลุ่มสำหรับเว็บสามารถใช้ได้บนเว็บเพจเท่านั้น

ขอรับโค้ด

หากต้องการขอรับโค้ดสำหรับปุ่มเข้าชมเพื่อฝังลงในเว็บเพจ คุณจะต้องใช้ตัวกำหนดค่าโค้ด

ขั้นตอนที่ 1 แทนที่ URL ด้วย URL สำหรับกลุ่มบน Facebook ของคุณ

ขั้นตอนที่ 2 อัพเดตความกว้างของพิกเซลสำหรับปุ่มเข้าชมกลุ่ม

ขั้นตอนที่ 3 เพิ่มเมตาดาต้า หากต้องการใส่ข้อมูลเพิ่มเติมไว้ในโค้ดของปุ่ม

ขั้นตอนที่ 4 คลิกที่ขอรับโค้ด

ตัวกำหนดค่าโค้ด

URL ของกลุ่ม
ความกว้างของปลั๊กอินในหน่วยพิกเซล
รับรหัส

ขั้นตอนที่ 5 คัดลอกและวางส่วนย่อยของโค้ด HTML ลงในเว็บเพจที่คุณต้องการแสดงปุ่มดังกล่าว

แอตทริบิวต์ปลั๊กอิน

รายการต่อไปนี้คือการตั้งค่าทั้งหมดที่คุณสามารถนำไปใช้กับปลั๊กอินกลุ่มสำหรับเว็บได้

แอตทริบิวต์คำอธิบาย

data-href

URL ของกลุ่มบน Facebook

data-show-metadata

แสดงเมตาดาต้าเกี่ยวกับกลุ่มบน Facebook เช่น คำอธิบาย

data-lazy

true หรือ false ซึ่งอย่างหลังคือค่าเริ่มต้น เมื่อตั้งค่าเป็น true เบราว์เซอร์จะไม่แสดงปลั๊กอินหากระบบไม่อาจแสดงปลั๊กอินให้เห็นได้ เช่น ในกรณีที่ปลั๊กอินไม่อยู่ใกล้กับวิวพอร์ต

data-width

ความกว้างของปลั๊กอินในหน่วยพิกเซล โดยค่าเริ่มต้นคือ 280 ความกว้างขั้นต่ำคือ 180 และสูงสุดคือ 500 พิกเซล

data-skin

ธีมสีสำหรับเนื้อหาปลั๊กอิน ระบบรองรับตัวเลือกดังต่อไปนี้

  • light: ปลั๊กอินแสดงข้อความสีเข้ม ซึ่งเป็นค่าเริ่มต้น
  • dark: ปลั๊กอินแสดงข้อความสีขาว

ตัวอย่างโค้ด

หากไม่ต้องการใช้ตัวกำหนดค่าโค้ด คุณสามารถคัดลอกและวางโค้ดต่อไปนี้ลงในเว็บเพจของคุณได้ แทนที่รายการต่อไปนี้ด้วยค่าของคุณ

  • ใน URL js.src ให้แทนที่ LATEST-API-VERSION ด้วยเวอร์ชั่น API กราฟที่แอพของคุณใช้งานอยู่
  • ใน URL js.src ให้แทนที่ APP-ID ด้วย ID แอพ Meta ของแอพคุณ
  • สำหรับ data-href ให้แทนที่ GROUP-URL ด้วย URL สำหรับกลุ่มบน Facebook ของคุณ 
<html>

<head>
    <!-- Load Facebook SDK for JavaScript -->
    <div id="fb-root"></div>
    <script>
        (function(d, s, id) {
            var js, fjs = d.getElementsByTagName(s)[0];
            if (d.getElementById(id)) return;
            js = d.createElement(s);
            js.id = id;
            js.src = 'https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=LATEST-API-VERSION&appId=APP-ID&autoLogAppEvents=1';
            fjs.parentNode.insertBefore(js, fjs);
        }(document, 'script', 'facebook-jssdk'));
    </script>
</head>

<body>

    <!--Your Group Plugin for the Web code-->
    <div class="fb-group" 
         data-href="GROUP-URL" 
         data-width="280" 
         data-show-metadata="false">
    </div>

</body>

</html>

ดูเพิ่มเติม