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