ปลั๊กอินคำพูดอ้างอิง

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

การแชร์คำพูดอ้างอิงสำหรับเว็บบนมือถือ

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

การแชร์คำพูดอ้างอิงสำหรับ iOS และ Android

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

ลองปลั๊กอินตัวอย่างรหัสการตั้งค่า

ลองปลั๊กอิน

เลือกส่วนของประโยคนี้เพื่อดูปลั๊กอินที่กำลังดำเนินการอยู่

ตัวอย่างรหัส

ปรับค่า data-href ไปที่ URL เว็บไซต์ของคุณ ตรวจสอบให้แน่ใจว่า เมตาแท็ก Open Graph เป็นปัจจุบัน และ data-href สำหรับปลั๊กอินตรงกับคุณสมบัติ og:url

<html>
<head>
  <title>Your Website Title</title>
  <!-- Comment #1: OG Tags -->
  <meta property="og:url"           content="http://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="http://www.your-domain.com/path/image.jpg" />
</head>
<body>

  <!-- Comment #2: SDK -->
  <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=v2.6";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));</script>

  <!-- Comment #3: Content -->
  <h1>Your Headline</h1>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse eget tristique nibh, 
    vel consequat purus. Praesent molestie, turpis ut ultrices commodo, felis arcu cursus enim, 
    vel porttitor ante quam vel lacus. Quisque at laoreet sapien. Proin nec purus dolor. Integer 
    pharetra nec ligula a condimentum. Fusce sem orci, porta ut felis id, commodo imperdiet risus. 
  </p>

  <!-- Comment #4: Plugin Code -->
  <div class="fb-quote"></div>

</body>
</html>
ลองใช้ด้วยตัวเอง!

ความคิดเห็นเกี่ยวกับโค้ด

  1. OG Tags: คุณสามารถใช้แท็ก Open Graph ในการปรับแต่งตัวอย่างลิงก์ได้
  2. SDK: โหลด Facebook SDK สำหรับ JavaScript
  3. Content: เนื้อหาบนเพจของคุณ
  4. Plugin Code: โค้ดปลั๊กอินคำพูดอ้างอิงของคุณจากตัวกำหนดค่า คุณสามารถใส่โค้ดนี้ไว้ที่ใดก็ได้ในเอกสาร ซึ่งจะแสดงเมื่อคุณไฮไลท์ข้อความในอุปกรณ์เก็บนั้นเท่านั้น ในตัวอย่างนี้ จะแสดงเมื่อคุณไฮไลท์ข้อความในเนื้อเรื่องเท่านั้น

การตั้งค่า

คุณสามารถเปลี่ยนการตั้งค่าดังต่อไปนี้ได้

การตั้งค่า แอตทริบิวต์ HTML5 คำอธิบาย ค่าเริ่มต้น

href

data-href

URL แบบเต็มของเพจที่จะอ้างอิงคำพูด

URL ปัจจุบัน

layout

data-layout

  • quote: ตัวเลือกข้อความจะแสดงปุ่มที่มีไอคอน Facebook สีน้ำเงิน และข้อความ "แชร์คำพูดอ้างอิง" เป็นภาพทับซ้อน เมื่อมีผู้คลิก กล่องโต้ตอบการแชร์ที่มีข้อความที่ไฮไลท์เป็นคำพูดอ้างอิงจะปรากฏขึ้น
  • button: ตัวเลือก "คำพูดอ้างอิง" ก็มีลักษณะเช่นเดียวกันนี้ แต่จะมีเพียงไอคอน Facebook สีน้ำเงินในปุ่ม

quote

พื้นที่ที่ใส่คำพูดอ้างอิงได้

พื้นที่เว็บเพจของคุณบางพื้นที่อาจไม่สามารถใส่คำพูดอ้างอิงได้ เช่น เมนู แถบด้านข้าง ส่วนท้าย คุณสามารถกำหนดพื้นที่ที่ใส่คำพูดอ้างอิงได้ในเพจโดยใช้:

  • อิลิเมนต์ <article> HTML
  • อิลิเมนต์ใดๆ ที่มีชื่อคลาส fb-quotable

คุณสามารถผสมผสานทั้งสองรายการนี้ได้ตามต้องการและกำหนดพื้นที่ที่ใส่คำพูดอ้างอิงได้

หากเพจของคุณไม่มี <article> หรือ class="fb-quotable" เพจทั้งหมดจะสามารถใส่คำพูดอ้างอิงได้

การเปลี่ยนภาษา

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

js.src = "https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&amp;version=v2.6";

รูปแบบภาษาที่รองรับจะมีการอ้างอิงถึงในไฟล์ XML รูปแบบภาษาของ Facebook คุณอาจจำเป็นต้องปรับความกว้างของโซเชียลปลั๊กอินเพื่อให้รองรับภาษาต่างๆ คุณสามารถค้นหาข้อมูลเพิ่มเติมได้ที่เพจ “การแปลเป็นภาษาท้องถิ่นและการแปลภาษา” ของเรา