วิธีติดตั้ง

โปรดอ่านไกด์ไลน์ก่อนติดตั้งปุ่ม
การติดตั้งปุ่มหมายความว่าผู้ใช้ได้ยินยอมตามข้อกำหนดในไกด์ไลน์แล้ว

การใช้ปุ่ม LINE Share

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

การใช้ไอคอนทางการของ LINE

คุณสามารถสร้างไอคอนแชร์ที่ปรับแต่งเองหรือใช้ไอคอนทางการสำหรับปุ่ม LINE Share ได้ หากต้องการใช้ไอคอนทางการของ LINE โปรดทำตามขั้นตอนต่อไปนี้

1. กำหนด URL

  • โปรดใส่ลิงก์ของเว็บไซต์ที่ต้องการติดตั้งปุ่ม LINE Share
ลิงก์

2. ตั้งค่าปุ่ม

ประเภทปุ่ม
ตัวนับการแชร์
ขนาด

3. ดูตัวอย่างปุ่มแล้วคัดลอกโค้ด

  • โปรดนำโค้ดต่อไปนี้ไปใส่ใน DOM ของเว็บไซต์ โค้ดนี้จะถูกเรียกโดยอีเวนท์ DOMContentLoaded
  • โปรดนำไปวางในตำแหน่งที่ต้องการติดตั้งปุ่ม
  • หากคุณติดตั้งปุ่ม LINE Share หลายปุ่มบนหน้าเว็บเดียวกัน ขอให้ใส่แท็กสคริปต์สุดท้ายที่ปุ่มสุดท้าย
ตัวอย่างปุ่ม
โค้ด
<div>Code</div>

การใช้ไอคอนที่ปรับแต่งเอง

หากต้องการสร้างและใช้ไอคอนที่ปรับแต่งเองสำหรับปุ่ม LINE Share โปรดทำตามขั้นตอนต่อไปนี้

1. ไอคอนแบบกำหนดเอง

  • คุณสามารถใช้ไอคอนที่กำหนดขึ้นเองได้โดยกำหนดลิงก์ของปุ่มตามวิธีด้านล่าง
รูปแบบลิงก์
https://social-plugins.line.me/lineit/share?url={encodeURIComponent(URL)}
ตัวอย่าง
(ลิงก์ปลายทาง: https://line.me/en)
https://social-plugins.line.me/lineit/share?url=https%3A%2F%2Fline.me%2Fen

2. เรียกปุ่ม LINE Share ที่ Dynamic Website

  • เมื่อสร้าง Dom Tree และทำคอนเทนต์สำหรับเว็บไซต์แล้ว ให้เรียก LineIt.loadButton() เพื่อเริ่มใช้ปุ่ม LINE Share
<script type="text/javascript">LineIt.loadButton();</script>

3. ตัวนับการแชร์

  • คุณสามารถติดตามจำนวนการแชร์ได้ด้วยตัวนับการแชร์
  • การนับจำนวนการแชร์จะรวมเฉพาะการแชร์ผ่านปุ่ม LINE Social Plugin เท่านั้น
คำขอ HTTP
GEThttps://api.line.me/social-plugin/metrics?url=https://line.me/en
พารามิเตอร์คำขอ
พารามิเตอร์
ประเภท
คำอธิบาย
url
required
String
URL เพื่อขอจำนวนการแชร์

(เช่น https://line.me/en)
ตัวอย่างคำขอ
curl -X GET 'https://api.line.me/social-plugin/metrics?url=https://line.me/en'
ตัวอย่างการตอบ
{
"share": 4173
}
รหัสสถานะ
รหัส
คำอธิบาย
200
OK
คำขอสำเร็จแล้ว
400
Bad Request
คำขอมีพารามิเตอร์หรือค่าที่ไม่ถูกต้อง
500
Internal Server Error
เกิดข้อผิดพลาดของเซิร์ฟเวอร์ภายใน

4. คู่มือการออกแบบ

  • โปรดสร้างไอคอนที่ปรับแต่งเองโดยอ้างอิงการออกแบบอย่างเป็นทางการต่อไปนี้
  • รูปปุ่มสำหรับดาวน์โหลดถูกสร้างด้วยขนาดที่เป็น 2 เท่าเพื่อการใช้กับ Retina Display
Design Guide

การใช้ปุ่ม "เพิ่มเพื่อน"

ผู้ใช้ที่มาชมเว็บไซต์สามารถเพิ่มคุณเป็นเพื่อน LINE ได้ด้วยปุ่มนี้
ต้องใช้ ID บัญชีทางการ LINE เพื่อสร้างปุ่มนี้
ปุ่ม "เพิ่มเพื่อน" จะมีเฉพาะไอคอนเริ่มต้นของ LINE เท่านั้น

1. ใส่ LINE ID

  • ใส่ ID บัญชีทางการ
LINE ID

2. เลือกประเภทปุ่ม

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

3. ดูตัวอย่างปุ่มแล้วคัดลอกโค้ด

  • โปรดนำไปวางในตำแหน่งที่ต้องการติดตั้งปุ่ม
ดูตัวอย่างปุ่ม
โค้ด
<div>Code</div>