คอมโพเนนต์แกลเลอรีแบบกวาดนิ้วได้

โฆษณา AMPHTML โฆษณาวิดีโอ หรือโฆษณาแบบรูปภาพไม่รองรับคอมโพเนนต์นี้

คอมโพเนนต์แกลเลอรีแบบกวาดนิ้วได้ช่วยให้คุณสร้างแกลเลอรีที่เรียบง่ายซึ่งผู้ใช้เลื่อนนิ้วไปข้างหน้าและย้อนกลับเพื่อแสดงชุดรูปภาพที่แตกต่างกันหรือชุดของกลุ่มที่แตกต่างกันได้ คุณใช้แกลเลอรีแบบกวาดนิ้วได้ในโฆษณาแบบไดนามิกได้

การเลือกแกลเลอรีที่เหมาะสม

Google Web Designer มีคอมโพเนนต์แกลเลอรีที่แตกต่างกัน 4 รายการดังนี้

• แกลเลอรี 360° แสดงรูปภาพด้านต่างๆ ของออบเจ็กต์ โดยให้คุณเลื่อนไปมาเพื่อหมุนออบเจ็กต์นั้นได้ แกลเลอรี 360° จะไม่แสดงองค์ประกอบการนำทางหรือกลุ่ม
• แกลเลอรีแบบกวาดนิ้วได้มีรูปลักษณ์แบบมิติเดียวที่เรียบง่าย และให้คุณเลื่อนผ่านรูปภาพหรือกลุ่มต่างๆ ในแนวตั้งหรือแนวนอนก็ได้
• แกลเลอรีภาพหมุนคล้ายกับแกลเลอรีแบบกวาดนิ้วได้ แต่ทำให้รูปภาพที่อยู่ข้างเคียงดูเหมือนเป็นภาพ 3 มิติ ราวกับอยู่บนแท่นหมุนสำหรับจัดแสดง
• แกลเลอรีการเปลี่ยนเสนอเอฟเฟกต์การเคลื่อนไหวที่หลากหลายในขณะที่เปลี่ยนจากรูปภาพหนึ่งไปเป็นรูปภาพถัดไป

วิธีใช้แกลเลอรีแบบกวาดนิ้วได้

1. เปิดแผงคอมโพเนนต์ แล้วเปิดโฟลเดอร์แกลเลอรี

2. ลากคอมโพเนนต์แกลเลอรีแบบกวาดนิ้วได้ ไปยังพื้นที่งาน

3. ในส่วนคุณสมบัติแกลเลอรีแบบกวาดนิ้วได้ของแผงคุณสมบัติ ให้ตั้งชื่อคอมโพเนนต์

4. เพิ่มชุดรูปภาพหรือชุดกลุ่ม ใช้กลุ่มเพื่อแสดงองค์ประกอบอื่นนอกเหนือจากรูปภาพ หรือเพื่อแสดงองค์ประกอบหลายรายการในเฟรมเดียว

   • หากต้องการเพิ่มรูปภาพ ให้ใช้วิธีใดวิธีหนึ่งต่อไปนี้

     • ในส่วนคุณสมบัติแกลเลอรีแบบปัดดูของแผงคุณสมบัติ ให้เพิ่ม URL ของรูปภาพในช่องรูปภาพ โดยคั่นด้วยคอมมา

     • ในส่วนคุณสมบัติแกลเลอรีแบบปัดดูของแผงคุณสมบัติ ให้คลิกปุ่มเลือกรูปภาพในแกลเลอรี คลิกปุ่มเลือกไฟล์เพื่อเรียกดูไฟล์ภาพ หรือลากไฟล์ลงในกล่องโต้ตอบโดยตรง

   • หากต้องการเพิ่มกลุ่มลงในแกลเลอรี ให้ทำดังนี้

     • ในส่วนคุณสมบัติแกลเลอรีแบบปัดดูของแผงคุณสมบัติ ให้เพิ่มรายชื่อกลุ่มในช่องกลุ่ม โดยคั่นด้วยคอมมา

5. ปรับเปลี่ยนคุณสมบัติคอมโพเนนต์ (คำอธิบายอยู่ด้านล่าง) หากต้องการ

การใช้กลุ่มในแกลเลอรีแบบกวาดนิ้วได้

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

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

หากต้องการสร้างแกลเลอรีที่แสดงรูปภาพและกลุ่มผสมกัน ให้แปลงรูปภาพที่คุณต้องการจะใช้ให้เป็นกลุ่มก่อน

คุณยังแสดงองค์ประกอบแบบไดนามิกหลายรายการในแกลเลอรีโดยใช้กลุ่มได้ด้วย

วิธีเรียงลำดับใหม่หรือนำรูปภาพในแกลเลอรีออก

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

คุณสมบัติ

พร็อพเพอร์ตี้	คำอธิบาย
ชื่อ	ตั้งชื่อแกลเลอรีแบบกวาดนิ้วได้
รูปภาพ	ให้คุณเลือกรูปภาพสำหรับใช้ในแกลเลอรี เชื่อมโยงกับข้อมูลแบบไดนามิกได้
กลุ่ม	รายการของกลุ่มที่คั่นด้วยคอมมาสำหรับใช้ในแกลเลอรี เชื่อมโยงกับข้อมูลแบบไดนามิกได้
การเปลี่ยน	เวลา (เป็นมิลลิวินาที) สำหรับการเปลี่ยนแต่ละรูป
เฟรมเริ่มต้น	จำนวนของรูปภาพที่คุณต้องการแสดงเมื่อเริ่มต้น
แสดงเฟรม	จำนวนเฟรมที่แสดงในแกลเลอรีในแต่ละครั้ง
กวาดเฟรม	จำนวนเฟรมที่เลื่อนไปข้างหน้าเมื่อกวาดนิ้วแต่ละครั้ง
เล่นอัตโนมัติ	เมื่อเลือกคุณสมบัตินี้ ระบบจะเล่นรูปภาพในแกลเลอรีโดยอัตโนมัติ
รวมการนำทาง	เมื่อเลือกคุณสมบัตินี้ ระบบจะรวมไอคอนการนำทางเพื่อไปยังตำแหน่งต่างๆ ของแกลเลอรี
ใช้ภาพขนาดย่อ	เมื่อเลือกร่วมกับ "รวมการนำทาง" ระบบจะแสดงรูปภาพขนาดย่อสำหรับการนำทางแทนที่จะแสดงเป็นไอคอน
สีไฮไลต์	ตั้งค่าสีไฮไลต์สำหรับรูปภาพการนำทาง
การปรับขนาด	กำหนดวิธีแสดงรูปภาพหลายขนาดภายในเฟรมที่มีขนาดคงที่ ปรับขนาดรูปภาพให้พอดี - ปรับขนาดรูปภาพตามสัดส่วนเท่าที่จำเป็นเพื่อให้พอดีกับเฟรมโดยไม่ต้องครอบตัด ระบบจะเพิ่มระยะห่างจากขอบหากสัดส่วนภาพของรูปภาพและเฟรมต่างกัน ครอบตัดรูปภาพให้เต็มพื้นที่ - ปรับขนาดรูปภาพให้เต็มเฟรมด้วยการครอบตัดรูปภาพหากจำเป็น เมื่อสัดส่วนภาพของรูปภาพและเฟรมต่างกัน ไม่มี - ระบบจะแสดงรูปภาพตามขนาดเดิมโดยจัดให้อยู่กึ่งกลางของเฟรม หากรูปภาพมีขนาดเล็กกว่าเฟรม พื้นที่ว่างที่เหลือจะกลายเป็นระยะห่างระหว่างขอบแบบโปร่งใส และระบบจะครอบตัดรูปภาพหากมีขนาดใหญ่กว่าเฟรม ขยายรูปภาพให้เต็มพื้นที่ - ปรับขนาดและขยายรูปภาพเท่าที่จำเป็นเพื่อให้ตรงกับขนาดของเฟรมโดยไม่ต้องครอบตัด
ทิศทาง	กำหนดว่ารูปภาพในแกลเลอรีจะเลื่อนไปในแนวตั้งหรือแนวนอน

คุณสมบัติขั้นสูง

หากต้องการแสดงคุณสมบัติขั้นสูง ให้คลิกไอคอนขยาย ของคุณสมบัติขั้นสูงในแผงคุณสมบัติคอมโพเนนต์

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

เหตุการณ์และการทำงาน

เหตุการณ์ที่ส่งโดยคอมโพเนนต์แกลเลอรีแบบกวาดนิ้วได้

คุณทริกเกอร์การทำงานอื่นๆ ได้โดยอิงตามเหตุการณ์ของคอมโพเนนต์แกลเลอรีแบบกวาดนิ้วได้ดังต่อไปนี้

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

หากต้องการเลือกเหตุการณ์ใดเหตุการณ์หนึ่งในกล่องโต้ตอบเหตุการณ์ ให้ตั้งค่าคอมโพเนนต์แกลเลอรีแบบปัดดูเป็นเป้าหมาย

การทำงานที่มาจากคอมโพเนนต์แกลเลอรีแบบกวาดนิ้วได้

การทำงานของคอมโพเนนต์แกลเลอรีแบบกวาดนิ้วได้ที่ทริกเกอร์ให้ตอบสนองต่อเหตุการณ์อื่นได้มีดังนี้

การทำงาน	ตัวเลือกการกำหนดค่า
ไปที่เฟรม	จำนวนเฟรม เคลื่อนไหว - "none" หรือ "slide"
หมุน 1 ครั้ง	เวลาที่หมุน - เวลาเป็นมิลลิวินาที ทิศทาง - "forwards" หรือ "backwards"
หยุดการหมุน	ไม่มี
ไปข้างหน้า	ไม่มี
ย้อนกลับ	ไม่มี

เมื่อเลือกการทำงานอย่างใดอย่างหนึ่งในกล่องโต้ตอบเหตุการณ์ ให้ตั้งค่าคอมโพเนนต์แกลเลอรีแบบปัดดูเป็นตัวรับ

ดูวิธีกำหนดค่าเหตุการณ์

แสดงตัวอย่าง

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