“ ผู้เผยแพร่ Facebook” เลือกรูปภาพชื่อและเนื้อหาจากเว็บไซต์ที่ใช้ร่วมกันอย่างไร


12

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

นี่คือภาพหน้าจอเพื่ออธิบายจุด:

ภาพหน้าจอจาก Facebook

แอปพลิเคชัน Publisher ดึงรูปภาพและข้อความจากลิงก์ได้อย่างไร มีแอปพลิเคชันที่คล้ายกันซึ่งใช้งานได้กับเว็บแอปพลิเคชันยอดนิยมอื่น ๆ แอปพลิเคชัน Google บล็อก Wordpress ฯลฯ

ฉันถามคำถามที่คล้ายกันไม่กี่เดือนที่ผ่านมาและปรากฏว่า Facebook ใช้oEmbedแต่ปรากฏว่า oEmbed ฝังเนื้อหาเท่านั้น ฉันยังอ่านว่า oEmbed ใช้งานได้กับผู้ให้บริการ oEmbed เท่านั้น ผู้เผยแพร่ Facebook ทำงานร่วมกับเว็บไซต์เกือบทั้งหมด



@phwd: ดูเหมือน @Edward กำลังพูดถึงข้อผิดพลาดในโพสต์ของเขา มันใช้งานได้จนถึง "แต่เมื่อประมาณสองสัปดาห์ก่อน ... "
Stefan Lasiewski

คำตอบ:


10

Facebook จะใช้เมตาแท็กกราฟที่เปิดอยู่หากมีสำหรับชื่อเรื่องและรูปภาพ ฯลฯ (เช่น og: ชื่อเรื่อง) เอกสารประกอบ facebook สำหรับOpen Graph Protocolอธิบายรายละเอียดเพิ่มเติมนี้:

โปรโตคอล Open Graph กำหนดคุณสมบัติที่ต้องการสี่ประการ:

og: title - ชื่อเรื่องของวัตถุของคุณตามที่ควรปรากฏในกราฟเช่น "The Rock"

og: type - ประเภทของวัตถุของคุณเช่น "ภาพยนตร์" ดูรายการประเภทที่รองรับทั้งหมด

og: รูปภาพ - URL รูปภาพที่ควรแสดงถึงวัตถุของคุณภายในกราฟ รูปภาพต้องมีอย่างน้อย 50px คูณ 50px และมีอัตราส่วนภาพสูงสุด 3: 1

และ: URL - URL ที่เป็นที่ยอมรับของวัตถุของคุณที่จะนำมาใช้เป็น ID ถาวรในกราฟเช่นhttp://www.imdb.com/title/tt0117500/

นอกจากนี้เราได้ขยายข้อมูลเมตาพื้นฐานเพื่อเพิ่มสองฟิลด์ที่จำเป็นเพื่อเชื่อมต่อเพจของคุณกับ Facebook:

og: site_name - ชื่อที่คนทั่วไปสามารถอ่านได้สำหรับเว็บไซต์ของคุณเช่น "IMDb"

fb: ผู้ดูแลระบบหรือ fb: app_id - รายการที่คั่นด้วยจุลภาคของ ID ผู้ใช้ Facebook หรือรหัสแอปพลิเคชันแพลตฟอร์ม Facebook ที่ดูแลหน้านี้ สามารถรวมได้ทั้ง fb: ผู้ดูแลระบบและ fb: app_id ในหน้าของคุณ

ขอแนะนำให้คุณรวมคุณสมบัติต่อไปนี้และคุณสมบัติหลายส่วนเหล่านี้

og: คำอธิบาย - คำอธิบายประโยคหนึ่งถึงสองประโยคของหน้าเว็บของคุณ

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

นอกจากนี้คุณยังสามารถใช้ดีบักเกอร์ Facebook opengraph ซึ่งจะให้ข้อมูลเกี่ยวกับตัวอย่างของคุณรวมถึง (สะดวกสุด ๆ ) อัปเดตลิงก์แคชหากคุณทำการเปลี่ยนแปลง มิฉะนั้นคุณสามารถทำการเปลี่ยนแปลงลิงค์ที่คุณต้องการแชร์และการเปลี่ยนแปลงจะไม่ปรากฏขึ้นเป็นเวลาหลายวัน:

https://developers.facebook.com/tools/debug


พวกเขาจะใช้เมตาแท็กหากคุณไม่ได้ระบุแท็กกราฟแบบเปิด แท็ก OG มีประโยชน์มากขึ้นเมื่อชื่นชอบหน้าเว็บเพราะจะสร้างหน้า Facebook ไว้สำหรับเว็บไซต์ / URL
Umair Jabbar

4

ในการบอก Facebook ว่าต้องการรับข้อความและรูปภาพใดคุณต้องเพิ่มเมตาคีย์เฉพาะในหัวของหน้า

    <meta name="title" content="title" />
    <meta name="description" content="description " />
    <link rel="image_src" href="thumbnail_image" / >

ฉันได้โพสต์รายละเอียดของเขาที่นี่http://umairj.com/2010/10/modify-how-the-shared-item-appears-on-facebook/


1
น่าสนใจและเมตาแท็กเหล่านั้นเป็นวิธีปฏิบัติที่แนะนำสำหรับผู้ดูแลเว็บจำนวนมาก (ช่วยให้เครื่องมือค้นหา ฯลฯ ) แต่มองไปที่แหล่งสำหรับflowingdata.com/2010/09/15/... หน้านั้นไม่มีแท็กเหล่านั้นและไม่มี<link rel=แท็กภาพด้วย
Stefan Lasiewski

@ Stefan นี่เป็นคำถามที่ดีมากสิ่งที่ FB ทำก็คือถ้าไม่พบเมตาแท็กของแท็ก OpenGraph OG ใหม่จากนั้นมันจะเก็บภาพทั้งหมดและแสดงส่วนหนึ่งของข้อความตั้งแต่ต้น html ของหน้านั้น . ดังนั้นผู้ใช้จะได้รับตัวเลือกสำหรับรูปภาพ แต่ข้อความเหมือนกัน ยิ่งไปกว่านั้นภาพเหล่านั้นเท่านั้นที่จะปรากฏซึ่งเกินเกณฑ์ที่ Facebook กำหนด อัตราส่วน aspet
Umair Jabbar

1

สิ่งที่ใช้ได้ผลสำหรับฉันคือการวางภาพขนาดย่อที่ต้องการบนหน้าถัดจากแท็กและทำให้เล็กเกินไปที่จะเห็น ..

<img src="imagename.jpg" width="1" height="1" />

ฉันไม่ได้ทดสอบด้วยความสูง 0 และความกว้าง 0 แต่มันอาจจะยังคงใช้งานได้ .. นี่ไม่รับประกันว่าผู้ใช้จะเลือกภาพนี้ ..

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

หวังว่านี่จะช่วยได้


0

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

เมตาแท็กที่สำคัญที่สุดที่คุณต้องกำหนดคือ:

  • <meta property="og:title" content="The title of the sharing preview" />
  • $<meta property="og:description" content="The first few lines of content below the title" />
  • <meta property="og:image" content="http://site.com/your-image-1200x630px.jpg" />

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


-1

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

ที่ถูกกล่าวว่าฉันจะบอกว่าอัลกอริทึมจะไม่ซับซ้อนชะมัดมันอาจใช้กฎเดียวกันกับที่ Google ใช้ในการขูดเนื้อหาจากเว็บไซต์ (มีรายละเอียดทั่วไปบางส่วนเผยแพร่ที่นี่ ) ฉันคิดว่าพลังที่อยู่เบื้องหลัง Publisher มาจากการลองผิดลองถูกมากมายและการทดสอบโดยวิศวกร Facebook


1
ฉันไม่เห็นด้วยเลย!
Umair Jabbar
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.