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

ปุ่มถูกใจสำหรับเว็บ

การเปลี่ยนแปลงของโซเชียลปลั๊กอินในภูมิภาคยุโรป

คุณอาจพบการเปลี่ยนแปลงบางอย่างเกิดขึ้นกับโซเชียลปลั๊กอินเนื่องจากมีการอัพเดตข้อความแจ้งขอการยินยอมของคุกกี้ ซึ่งจะแสดงต่อผู้ที่ใช้ผลิตภัณฑ์ Facebook ในภูมิภาคยุโรป สำหรับผู้ใช้ในภูมิภาคยุโรป โซเชียลปลั๊กอิน 'ถูกใจ' และ 'แสดงความคิดเห็น' จะไม่ได้รับการรองรับอีกต่อไป นอกจากว่าผู้ใช้จะ 1) เข้าสู่ระบบบัญชี Facebook ของตน พร้อมกับ 2) ได้ยินยอมให้มีการควบคุม "คุกกี้บนแอพและเว็บไซต์" หากปฏิบัติตามข้อกำหนดทั้งสองนี้ ผู้ใช้จะเห็นและโต้ตอบกับปลั๊กอิน เช่น ปุ่ม "ถูกใจ" หรือ ปุ่ม "แสดงความคิดเห็น" ได้ หากไม่ปฏิบัติตามข้อกำหนดตามที่กล่าวไว้ข้างต้น ผู้ใช้จะไม่เห็นปลั๊กอินใดๆ เลย

ภูมิภาคยุโรปประกอบไปด้วยประเทศที่เฉพาะเจาะจงดังนี้:

  • สหภาพยุโรป (EU): ออสเตรีย, เบลเยียม, บัลแกเรีย, โครเอเชีย, สาธารณรัฐไซปรัส, สาธารณรัฐเช็ก, เดนมาร์ก, เอสโตเนีย, ฟินแลนด์, ฝรั่งเศส, เยอรมนี, กรีซ, ฮังการี, ไอร์แลนด์, อิตาลี, ลัตเวีย, ลิทัวเนีย, ลักเซมเบิร์ก, มอลตา, เนเธอร์แลนด์, โปแลนด์, โปรตุเกส, โรมาเนีย, สโลวาเกีย, สโลวีเนีย, สเปน และสวีเดน

  • ประเทศที่ไม่ได้อยู่ในสหภาพยุโรป แต่อยู่ในเฉพาะเขตเศรษฐกิจยุโรป/สมาคมการค้าเสรียุโรป หรือสหภาพศุลกากร: [เฉพาะเขตเศรษฐกิจยุโรป/สมาคมการค้าเสรียุโรป] ไอซ์แลนด์, ลิกเตนสไตน์ และนอร์เวย์; สวิตเซอร์แลนด์: [สหภาพศุลกากรยุโรป] เกาะแชนเนลทั้งหมด, ไอล์ออฟแมน และโมนาโก อาณาเขตอันเป็นอธิปไตยของสหราชอาณาจักรในไซปรัส [สหภาพศุลกากรยุโรป] อันดอร์รา, ซานมารีโน และนครรัฐวาติกัน

  • ประเทศที่ไม่ได้อยู่ในสหภาพยุโรป แต่เป็นส่วนหนึ่งของกลุ่มภูมิภาคส่วนนอกสุดของยุโรป (OMR): มาร์ตีนีก, มายอต, กวาเดอลูป, เฟรนช์เกียนา, เรอูนียง, เซนต์มาร์ติน, มาเดรา, อะโซร์ส และหมู่เกาะคะแนรี
  • สหราชอาณาจักร (หมู่เกาะบริติชทั้งหมด)

รับปุ่มถูกใจที่ปรับแต่งแล้ว

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

  1. กรอก URL สำหรับเว็บเพจของคุณ ซึ่งต้องการวางปุ่มถูกใจ
  2. ปรับแต่งปุ่มถูกใจของคุณ
  3. ดูตัวอย่างปุ่มของคุณ
  4. คลิกรับโค้ด แล้วคัดลอกและวางโค้ดลงในเว็บเพจของคุณ

ตัวกำหนดค่าปุ่มถูกใจ

URL เพื่อกดถูกใจ
Width
เลย์เอาท์
ประเภทการดำเนินการ
ขนาดของปุ่ม
รับรหัส

ใช้แท็กเมตา Open Graph เพื่อแก้ไขตัวอย่างลิงก์ แท็ก og:url และแอตทริบิวต์ data-ref ควรเป็น URL เดียวกัน

ตัวอย่างโค้ดแบบเต็ม

มีการจัดรูปแบบเพื่อให้อ่านได้ง่าย

<html>
<head>
  <title>Your Website Title</title>
    <!-- You can use open graph tags to customize link previews.
    Learn more: https://developers.facebook.com/docs/sharing/webmasters -->
  <meta property="og:url"           content="https://www.your-domain.com/your-page.html" />
  <meta property="og:type"          content="website" />
  <meta property="og:title"         content="Your Website Title" />
  <meta property="og:description"   content="Your description" />
  <meta property="og:image"         content="https://www.your-domain.com/path/image.jpg" />
</head>
<body>

  <!-- Load Facebook SDK for JavaScript -->
  <div id="fb-root"></div>
  <script async defer crossorigin="anonymous" 
        src="https://connect.facebook.net/en_US/sdk.js#xfbml=1
             &version={graph-api-version}
             &appId={your-facebook-app-id}" 
        nonce="FOKrbAYI">
  </script>

  <!-- Your like button code -->
  <div class="fb-like" 
       data-href="https://www.your-domain.com/your-page.html" 
       data-width=""
       data-layout="standard" 
       data-action="like" 
       data-size="small"  
       data-share="true">
  </div>

</body>
</html>

แอตทริบิวต์ HTML5 สำหรับปุ่มถูกใจ

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

data-action

คำกริยาที่จะแสดงบนปุ่ม ซึ่งอาจเป็น like (ค่าเริ่มต้น) หรือ recommend ก็ได้

data-colorscheme

แบบแผนชุดสีที่ปลั๊กอินนี้ใช้สำหรับข้อความภายนอกปุ่มนั้นเอง ซึ่งอาจเป็น light (ค่าเริ่มต้น) หรือ dark

data-href

URL ของเว็บเพจที่จะถูกใจ

data-kid-directed-site

หากเว็บไซต์หรือบริการออนไลน์ของคุณ หรือส่วนหนึ่งของบริการของคุณ มีกลุ่มเป้าหมายเป็นเด็กที่อายุต่ำกว่า 13 ปี คุณจะต้องตั้งค่าส่วนนี้เป็น true ซึ่งค่าเริ่มต้นจะเป็น false

data-layout

เลือกหนึ่งเลย์เอาท์ที่พร้อมใช้งานสำหรับปลั๊กอิน โดยอาจเป็น standard (ค่าเริ่มต้น), button_count, button หรือ box_count อย่างใดอย่างหนึ่ง โปรดดูรายละเอียดเพิ่มเติมในคำถามที่พบบ่อย

data-lazy

true หมายถึงการใช้กลไก lazy-loading ของเบราว์เซอร์โดยการตั้งค่าแอตทริบิวต์ iframe loading="lazy" ผลที่ได้คือเบราว์เซอร์จะไม่เรนเดอร์ปลั๊กอิน หากไม่อยู่ใกล้กับวิวพอร์ต และอาจไม่เห็นเลย โดยสามารถเป็น true หรือ false (ค่าเริ่มต้น) อย่างใดอย่างหนึ่ง

data-ref

ป้ายสำหรับการติดตามการอ้างอิงต้องมีอักขระน้อยกว่า 50 ตัวและประกอบด้วยตัวอักษรและตัวเลขและเครื่องหมายวรรคตอน (ปัจจุบันคือ +/=-.:_) โปรดดูรายละเอียดเพิ่มเติมในคำถามที่พบบ่อย

data-share

ระบุว่าจะใส่ปุ่มแชร์ไว้ข้างปุ่มถูกใจหรือไม่ โดยใช้ค่า true หรือ false (ค่าเริ่มต้น) การดำเนินการนี้จะใช้งานได้กับเวอร์ชั่น XFBML เท่านั้น

data-size

ปุ่มจะมีให้เลือกอยู่ 2 ขนาด ได้แก่ large และ small (ค่าเริ่มต้น)

data-width

ความกว้างของปลั๊กอิน (เลย์เอาท์มาตรฐานเท่านั้น) ซึ่งขึ้นอยู่กับความกว้างต่ำสุดและความกว้างเริ่มต้น โปรดดูตารางการตั้งค่าเลย์เอาท์สำหรับรายละเอียดเพิ่มเติม

การตั้งค่าเลย์เอาท์

ไม่บังคับการตั้งค่าเลย์เอาท์

เลย์เอาท์ ขนาดเริ่มต้น

standard

ความกว้างต่ำสุด: 225 พิกเซล
ความกว้างเริ่มต้น: 450 พิกเซล
ความสูง: 35 พิกเซล (ไม่มีรูปภาพ) หรือ 80 พิกเซล (มีรูปภาพ)

box_count

ความกว้างต่ำสุด: 55 พิกเซล
ความกว้างเริ่มต้น: 55 พิกเซล
ความสูง: 65 พิกเซล

button_count

ความกว้างต่ำสุด: 90 พิกเซล
ความกว้างเริ่มต้น: 90 พิกเซล
ความสูง: 20 พิกเซล

button

ความกว้างต่ำสุด: 47 พิกเซล
ความกว้างเริ่มต้น: 47 พิกเซล
ความสูง: 20 พิกเซล

เปลี่ยนภาษา

คุณสามารถเปลี่ยนภาษาของปุ่มถูกใจได้โดยโหลด Facebook JavaScript SDK เวอร์ชันแปลเป็นภาษาท้องถิ่น เปลี่ยน en_US เป็นรูปแบบภาษาของคุณ เช่น fr_FR สำหรับภาษาฝรั่งเศส (ฝรั่งเศส)

js.src = "https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version={graph-api-version} />";

คุณอาจจำเป็นต้องปรับความกว้างของโซเชียลปลั๊กอินเพื่อให้รองรับภาษาต่างๆ

ดูเพิ่มเติม