โฆษณา AMPHTML โฆษณาวิดีโอ หรือโฆษณาแบบรูปภาพไม่รองรับคอมโพเนนต์นี้
คอมโพเนนต์แกลเลอรี 360° จะช่วยให้คุณใช้ชุดรูปภาพในการแสดงการหมุนวัตถุได้ โดยค่าเริ่มต้น ภาพสุดท้ายจะวนไปที่ภาพแรก ซึ่งช่วยให้ผู้ใช้หมุนวัตถุได้อย่างต่อเนื่องในทุกทิศทาง
ตัวอย่างต่อไปนี้ใช้รูปภาพต้นฉบับ 7 ภาพ
การเลือกแกลเลอรีที่เหมาะสม
Google Web Designer มีคอมโพเนนต์แกลเลอรีที่แตกต่างกัน 4 รายการดังนี้
- แกลเลอรี 360° แสดงรูปภาพด้านต่างๆ ของออบเจ็กต์ โดยให้คุณเลื่อนไปมาเพื่อหมุนออบเจ็กต์นั้นได้ แกลเลอรี 360° จะไม่แสดงองค์ประกอบการนำทางหรือกลุ่ม
- แกลเลอรีแบบกวาดนิ้วได้มีรูปลักษณ์แบบมิติเดียวที่เรียบง่าย และให้คุณเลื่อนผ่านรูปภาพหรือกลุ่มต่างๆ ในแนวตั้งหรือแนวนอนก็ได้
- แกลเลอรีภาพหมุนคล้ายกับแกลเลอรีแบบกวาดนิ้วได้ แต่ทำให้รูปภาพที่อยู่ข้างเคียงดูเหมือนเป็นภาพ 3 มิติ ราวกับอยู่บนแท่นหมุนสำหรับจัดแสดง
- แกลเลอรีการเปลี่ยนเสนอเอฟเฟกต์การเคลื่อนไหวที่หลากหลายในขณะที่เปลี่ยนจากรูปภาพหนึ่งไปเป็นรูปภาพถัดไป
วิธีใช้แกลเลอรี 360° ในโครงการ
-
เปิดแผงคอมโพเนนต์ แล้วเปิดโฟลเดอร์แกลเลอรี
-
ลากคอมโพเนนต์แกลเลอรี 360° ไปยังพื้นที่งาน
-
ในส่วนคุณสมบัติแกลเลอรี 360° ของแผงคุณสมบัติ ให้ตั้งชื่อคอมโพเนนต์
-
เพิ่มรูปภาพลงในแกลเลอรีโดยทำตามวิธีใดวิธีหนึ่งต่อไปนี้
- ในส่วนคุณสมบัติแกลเลอรี 360° ของแผงคุณสมบัติ ให้คลิกปุ่มเลือกรูปภาพในแกลเลอรี ในช่องรูปภาพ คลิกปุ่มเลือกรูปภาพเพื่อเรียกดูไฟล์ภาพ หรือลากไฟล์ไปยังกล่องโต้ตอบโดยตรง
- ในส่วนคุณสมบัติแกลเลอรี 360° ของแผงคุณสมบัติ ให้เพิ่ม URL ของรูปภาพในช่องรูปภาพ โดยคั่นด้วยคอมมา
-
ปรับเปลี่ยนคุณสมบัติเพิ่มเติม (คำอธิบายอยู่ด้านล่าง) หากต้องการ
วิธีเรียงลำดับใหม่หรือนำรูปภาพในแกลเลอรีออก
- ในส่วนคุณสมบัติแกลเลอรี 360° ของแผงคุณสมบัติ ให้คลิกปุ่มเลือกรูปภาพในแกลเลอรี
- ลากรูปภาพไปยังตำแหน่งใหม่เพื่อจัดเรียงใหม่ หรือวางเคอร์เซอร์เหนือรูปภาพ แล้วคลิกปุ่มลบ เพื่อนำรูปภาพออกจากแกลเลอรี
- คลิกตกลง
คุณสมบัติ
พร็อพเพอร์ตี้ | คำอธิบาย |
---|---|
ชื่อ | ชื่อของคอมโพเนนต์ |
รูปภาพ | URL ของรูปภาพที่จะแสดงในแกลเลอรี โดยคั่นด้วยคอมมา เชื่อมโยงกับข้อมูลแบบไดนามิกได้ |
เล่นอัตโนมัติ | เมื่อเลือกคุณสมบัตินี้ แกลเลอรีจะแสดงรูปภาพทีละรูปโดยอัตโนมัติ |
รวม | เมื่อเลือกคุณสมบัตินี้ รูปภาพในแกลเลอรีจะวนมาบรรจบกันไม่ว่าจากทิศทางใดก็ตาม (ภาพแรกและภาพสุดท้าย) |
เหตุการณ์และการทำงาน
เหตุการณ์ที่ส่งโดยคอมโพเนนต์แกลเลอรี 360°คุณทริกเกอร์การทำงานอื่นๆ ได้โดยอิงตามเหตุการณ์ของคอมโพเนนต์แกลเลอรี 360° ดังต่อไปนี้
เหตุการณ์ | รายละเอียด |
---|---|
การโต้ตอบครั้งแรก | ส่งเมื่อผู้ใช้โต้ตอบกับแกลเลอรีเป็นครั้งแรก |
ดูเฟรมทั้งหมดแล้ว | ส่งเมื่อแสดงเฟรมทั้งหมดของแกลเลอรีอย่างน้อย 1 ครั้งแล้ว |
โหลดรูปภาพแล้ว | ส่งเมื่อโหลดเฟรมทั้งหมดของแกลเลอรีแล้ว |
แสดงเฟรมแล้ว | ส่งเมื่อแสดงเฟรมใหม่แต่ละเฟรมสมบูรณ์แล้ว |
เปิดใช้งานเฟรมแล้ว | ส่งเมื่อเริ่มเปลี่ยนเฟรม |
แตะเฟรม | ส่งเมื่อคลิกเฟรมแล้ว |
หากต้องการเลือกเหตุการณ์ใดเหตุการณ์หนึ่งในกล่องโต้ตอบเหตุการณ์ ให้ตั้งค่าคอมโพเนนต์แกลเลอรี 360° เป็นเป้าหมาย
การทำงานของคอมโพเนนต์แกลเลอรี 360° ที่ทริกเกอร์ให้ตอบสนองต่อเหตุการณ์อื่นได้มีดังนี้
การทำงาน | ตัวเลือกการกำหนดค่า |
---|---|
ไปที่เฟรม |
|
หมุน 1 ครั้ง |
|
ไปข้างหน้า | ไม่มี |
ย้อนกลับ | ไม่มี |
เมื่อเลือกการทำงานอย่างใดอย่างหนึ่งในกล่องโต้ตอบเหตุการณ์ ให้ตั้งค่าคอมโพเนนต์แกลเลอรี 360° เป็นตัวรับ
ดูวิธีกำหนดค่าเหตุการณ์
แสดงตัวอย่าง
ในพื้นที่งาน แกลเลอรี 360° จะแสดงเฉพาะเฟรมเริ่มต้นเพื่อให้คุณเห็นภาพว่าคอมโพเนนต์จะปรากฏอย่างไร หากต้องการดูการทำงานของคอมโพเนนต์ที่แสดงผลอย่างเต็มรูปแบบ ให้แสดงตัวอย่างเอกสารในเบราว์เซอร์ที่ต้องการโดยคลิกปุ่มแสดงตัวอย่างที่มุมขวาบน