เนื้อหา

เผยแพร่บน WordPress วิดีโอสอน

เผยแพร่บน Facebook

เผยแพร่บน Facebook Facebook

Facebook อยู่กับเครือข่ายสังคมออนไลน์กับผู้ใช้กว่าพันล้าน กวดวิชานี้อธิบายวิธีการเพิ่มการเคลื่อนไหวของ HTML เพื่อการ Facebook หน้า และวิธีการสร้างเป็น Facebook Canvas

ก่อนอื่นคุณจะต้องสร้างภาพเคลื่อนไหวบางอย่าง HTML เกม หรือโปรแกรมประยุกต์

อัปโหลดแฟ้ม HTML และแฟ้มสื่อไปยังเว็บเซิร์ฟเวอร์

สำคัญ Facebook ต้องหน้า HTML ใด ๆ ภายนอกจะถูกโฮสต์บนเซิร์ฟเวอร์เว็บที่ปลอดภัย (HTTPS)


เพิ่ม HTML การเคลื่อนไหวให้กับ Facebook หน้า

จะต้องมี Facebook หน้า นี้จะแตกต่างจาก Facebook บัญชี


www.Facebook.com/about/pages

ทำตามคำแนะนำในการสร้างหน้าใหม่ เราได้สร้างหน้าเปล่า คุณอาจมีการ Facebook หน้าสำหรับธุรกิจของคุณได้


เพิ่ม HTML การเคลื่อนไหวให้กับ Facebook หน้า FacebookPage

ถัดไป สร้างเป็น Facebook app คุณจะต้องลงทะเบียนเป็นผู้พัฒนา นี่คือฟรี


developers.facebook.com/apps

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


เพิ่ม HTML การเคลื่อนไหวให้กับ Facebook หน้า FacebookNewApp

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


เพิ่ม HTML การเคลื่อนไหวให้กับ Facebook หน้า FacebookAppSettings

ในเมนูการตั้งค่า ตั้งค่าอยู่อีเมลของผู้ติดต่อ คุณไม่สามารถเปลี่ยนโปรแกรมประยุกต์ของคุณไปอยู่จนกว่าคุณได้ตั้งค่าที่อยู่อีเมล

เลือก 'เพิ่มแพลตฟอร์ม' และเลือก 'แท็บหน้ากระดาษ'


เพิ่ม HTML การเคลื่อนไหวให้กับ Facebook หน้า FacebookAddPlatform

'จองหน้าแท็บ URL' เป็นที่ตั้งของการเคลื่อนไหวของ HTML ที่คุณสร้าง

นี้ต้องเป็นเจ้าภาพทางเว็บ

นี้ยังต้องเป็นเซิร์ฟเวอร์หน้า นี่คือการทำ เปลี่ยนนามสกุลไฟล์ของหน้า HTML จาก .HTML เพื่อ .ASPX หรือ .PHP ของเว็บเซิร์ฟเวอร์ที่คุณใช้

ตั้งชื่อสำหรับแท็บหน้า และตั้งค่ารูปภาพ

กด "บันทึกการเปลี่ยนแปลง'


เพิ่ม HTML การเคลื่อนไหวให้กับ Facebook หน้า FacebookPlatformSettings

การเพิ่มแท็บหน้าเพื่อคุณ Facebook หน้า URL ต่อไปนี้จำเป็นต้องคัดลอกลงในเว็บเบราว์เซอร์ แทน YOUR_APP_ID ด้วย ID ของโปรแกรมประยุกต์และการแทน YOUR_URL กับ URL ทางของ app


https://www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&redirect_uri=YOUR_URL

ตัวอย่าง:


https://www.facebook.com/dialog/pagetab?app_id=1234567890&redirect_uri=https://www.Hippani.com/Content/Files/Animations/Devices.aspx

www.facebook.com/dialog/pagetab?app_id=YOUR_APP_ID&redirect_uri=YOUR_URL

เพิ่ม HTML การเคลื่อนไหวให้กับ Facebook หน้า FacebookAddTab

เลือกหน้าที่ถูกต้อง และกด "เพิ่มแท็บหน้า'

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


เพิ่ม HTML การเคลื่อนไหวให้กับ Facebook หน้า FacebookExampleTab

เมื่อคุณพร้อมที่ คุณสามารถทำ app อยู่ ไป 'สถานะและตรวจทาน' ในแดชบอร์ด app คุณต้องทำก่อนที่คนอื่น ๆ สามารถดูได้


เพิ่ม HTML การเคลื่อนไหวให้กับ Facebook หน้า FacebookLive

สร้างเป็น Facebook แอพลิเคชัน

Facebook Canvas มีปพลิเคชันเต็มหน้า มากกว่า app ภายในแท็บนั้น


developers.facebook.com/apps

สร้างโดยประมาณใหม่เลือก Facebook Canvas ตั้งชื่อให้ app สร้าง app ID และเลือกประเภท ข้ามจุดเริ่มต้นอย่างรวดเร็ว


สร้างเป็น Facebook แอพลิเคชัน FacebookNewApp

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


สร้างเป็น Facebook แอพลิเคชัน FacebookAppSettings


ในเมนูการตั้งค่า ตั้งค่าอยู่อีเมลของผู้ติดต่อ คุณไม่สามารถเปลี่ยนโปรแกรมประยุกต์ของคุณไปอยู่จนกว่าคุณได้ตั้งค่าที่อยู่อีเมล

เลือก 'เพิ่มแพลตฟอร์ม' และเลือก 'Facebook Canvas'


สร้างเป็น Facebook แอพลิเคชัน FacebookAddPlatform


' ปลอดภัย Canvas URL' เป็นที่ตั้งของการเคลื่อนไหวของ HTML ที่คุณสร้าง

นี้ต้องเป็นเจ้าภาพทางเว็บ

นี้ยังต้องเป็นเซิร์ฟเวอร์หน้า นี่คือการทำ เปลี่ยนนามสกุลไฟล์ของหน้า HTML จาก .HTML เพื่อ .ASPX หรือ .PHP ของเว็บเซิร์ฟเวอร์ที่คุณใช้

สุดท้าย Facebook ต้องการ '?' ที่จะเพิ่มลงในส่วนท้ายของ URL

กด "บันทึกการเปลี่ยนแปลง'


สร้างเป็น Facebook แอพลิเคชัน FacebookCanvasSettings


ดู app โดยคัดลอกการ Canvas หน้า URL ลงในเว็บเบราว์เซอร์


https://apps.facebook.com/0123456789

สร้างเป็น Facebook แอพลิเคชัน FacebookCanvasExample

เผยแพร่บน WordPress วิดีโอสอน
เอกสารนี้ถูกแปลจากภาษาอังกฤษ โดยใช้การแปลออนไลน์ เราต้องขออภัยถ้าคุณพบข้อผิดพลาดใด ๆ ถ้าคุณต้องการช่วยให้เราทำการแก้ไข มีตัวแก้ไขแปลใน Hippani Animator (ในเมนูวิธีใช้) เราให้ออกคีย์ใบอนุญาตฟรีให้ทุกคนที่แก้ไขวลีมากกว่า 100 กรุณาติดต่อเราสำหรับรายละเอียดเพิ่มเติม