Grav - สื่อ

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

Smart-cachingถูกใช้โดย Grav ที่สร้างสื่อที่สร้างในแคชเมื่อจำเป็น วิธีนี้สามารถใช้เวอร์ชันแคชแทนการสร้างสื่อซ้ำแล้วซ้ำอีก

ไฟล์มีเดียที่รองรับ

ต่อไปนี้เป็นประเภทไฟล์มีเดียที่ Grav รองรับ -

• Image - jpg, jpeg, png

• Animated Image - gif

• vectorized Image - svg

• Video - mp4, mov, m4v, swf

• Data/information - txt, doc, pdf, html, zip, gz

โหมดการแสดงผล

ต่อไปนี้เป็นโหมดการแสดงผลบางประเภทใน Grav -

• Source - เป็นการแสดงภาพของรูปภาพวิดีโอหรือไฟล์

• text - การนำเสนอไฟล์สื่อเป็นข้อความ

• thumbnail - ภาพขนาดย่อสำหรับไฟล์สื่อ

การค้นหาภาพขนาดย่อ

คุณสามารถค้นหาภาพขนาดย่อได้โดยใช้สามตำแหน่ง -

• In the same folder where your media files exists- [ชื่อสื่อ]. [นามสกุลสื่อ]. นิ้วหัวแม่มือ. [การขยายนิ้วหัวแม่มือ]; ที่นี่ชื่อสื่อและนามสกุลสื่อเป็นชื่อและส่วนขยายของไฟล์สื่อจริงและส่วนขยายหัวแม่มือเป็นนามสกุลที่รองรับโดยประเภทสื่อรูปภาพ

• User Folder − ผู้ใช้ / ภาพ / สื่อ / thumb- [สื่อขยาย] .png; ที่นี่นามสกุลสื่อเป็นส่วนขยายของไฟล์สื่อจริง

• System folder- ระบบ / ภาพ / สื่อ / นิ้วหัวแม่มือ - [สื่อขยาย] .png; ที่นี่นามสกุลสื่อเป็นส่วนขยายของไฟล์สื่อจริง

ไลท์บ็อกซ์และลิงก์

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

• rel- ระบุลิงค์ไลท์บ็อกซ์ ค่าคือไลท์บ็อกซ์

• href - เป็น URL ไปยังวัตถุสื่อ

• data-width - ตั้งค่าความกว้างของไลท์บ็อกซ์ที่ผู้ใช้เลือก

• data-height - ตั้งค่าความสูงของไลท์บ็อกซ์ที่ผู้ใช้เลือก

• data-srcset - สตริง srcset ใช้ในกรณีของสื่อรูปภาพ

การดำเนินการ

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

ทั่วไป

มีการดำเนินการทั่วไป 6 ประเภทสำหรับประเภทสื่อ การกระทำแต่ละอย่างมีคำอธิบายด้านล่าง

ซีเนียร์	การดำเนินการและคำอธิบาย
1	url () url () ให้กลับ raw url path สื่อ
2	html ([ชื่อ] [, alt] [, คลาส] ผลลัพธ์จะมีแท็ก html ที่ถูกต้องสำหรับสื่อ
3	display(mode) ใช้เพื่อสลับระหว่างโหมดการแสดงผลต่างๆ เมื่อคุณเปลี่ยนเป็นโหมดการแสดงผลการกระทำทั้งหมดจะถูกรีเซ็ต
4	ลิงค์ () การดำเนินการที่ใช้ก่อนลิงก์จะนำไปใช้กับเป้าหมายของลิงก์
5	ไลท์บ็อกซ์ ([ความกว้างความสูง]) ไลท์บ็อกซ์คล้ายกับการทำงานของลิงก์ แต่มีข้อแตกต่างเล็กน้อยที่สร้างลิงก์ที่มีแอตทริบิวต์เพิ่มเติมบางอย่าง
6	ภาพขนาดย่อ เลือกระหว่างหน้าและค่าเริ่มต้นสำหรับไฟล์สื่อประเภทใดก็ได้และสามารถทำได้ด้วยตนเอง

การดำเนินการกับรูปภาพ

ตารางต่อไปนี้แสดงการกระทำบางอย่างที่ใช้กับรูปภาพ

ซีเนียร์	การดำเนินการและคำอธิบาย
1	ปรับขนาด (ความกว้างความสูง [พื้นหลัง]) เปลี่ยนความกว้างและความสูงของรูปภาพโดยการปรับขนาด
2	forceResize (ความกว้างความสูง) ยืดภาพตามต้องการโดยไม่คำนึงถึงอัตราส่วนดั้งเดิม
3	cropResize (ความกว้างความสูง) ปรับขนาดรูปภาพให้เล็กลงหรือใหญ่ขึ้นตามความกว้างและความสูง
4	ครอบตัด (x, y, กว้าง, สูง) ครอบตัดรูปภาพตามที่อธิบายโดยความกว้างและความสูงจากตำแหน่ง x และ y
5	cropZoom (ความกว้างความสูง) ช่วยซูมและครอบตัดภาพตามคำขอ
6	คุณภาพ (มูลค่า) ตั้งค่าสำหรับคุณภาพของภาพระหว่าง 0 ถึง 100
7	ลบล้าง () สีจะกลับด้านในการปฏิเสธ
8	ความสว่าง (ค่า) กับ value ของ -255 ถึง +255ตัวกรองความสว่างจะถูกเพิ่มลงในภาพ
9	ความคมชัด (ค่า) ค่าตั้งแต่ -100 ถึง +100 ใช้เพื่อใช้ฟิลเตอร์คอนทราสต์กับรูปภาพ
10	สีเทา () เขาใช้ฟิลเตอร์สีเทาในการประมวลผลภาพ
11	นูน () นอกจากนี้ยังใช้ฟิลเตอร์ลายนูนในการประมวลผลภาพ
12	เรียบ (ค่า) ฟิลเตอร์ปรับความเรียบถูกนำไปใช้กับรูปภาพโดยตั้งค่าตั้งแต่ -10 ถึง +10
13	คม () เพิ่มฟิลเตอร์เพิ่มความคมชัดในรูปภาพ
14	ขอบ() เพิ่มตัวกรองการค้นหาขอบบนรูปภาพ
15	colorize (แดงเขียวน้ำเงิน) ปรับสีภาพโดยปรับสีแดงเขียวและน้ำเงิน
16	ซีเปีย () เพิ่มฟิลเตอร์ซีเปียเพื่อให้ได้ลุควินเทจ

ภาพเคลื่อนไหวและ Vectorizing ภาพและวิดีโอ

การกระทำที่เคลื่อนไหวและเป็นเวกเตอร์จะกระทำกับรูปภาพและวิดีโอ ต่อไปนี้คือการดำเนินการที่เกิดขึ้นกับรูปภาพและวิดีโอ

ซีเนียร์	การดำเนินการและคำอธิบาย
1	ปรับขนาด (ความกว้างความสูง) การดำเนินการปรับขนาดจะตั้งค่า width, height, data-width และ data-height คุณลักษณะ.

ชุดค่าผสม

Grav มีฟังก์ชันการปรับแต่งรูปภาพที่ช่วยให้ทำงานกับรูปภาพได้ง่าย

![My New Image](/images/maxresdefault.jpg?negate&cropZoom = 500, 500&lightbox & cropZoom = 600,
200&contrast = -100&sharp&sepia)

โค้ดด้านบนจะสร้างผลลัพธ์ตามที่แสดงด้านล่าง -

ภาพที่ตอบสนอง

ตารางต่อไปนี้แสดงรายการรูปภาพที่ตอบสนองสองสามประเภท

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

Metafiles

image1.jpg, archive.zipหรือการอ้างอิงอื่น ๆ ที่มีความสามารถในการตั้งค่าตัวแปรหรือสามารถแทนที่ด้วยเมตาไฟล์ จากนั้นไฟล์เหล่านี้จะอยู่ในรูปแบบของ<filename>.meta.yaml. ตัวอย่างเช่นหากคุณมีรูปภาพเป็นไฟล์image2.jpgจากนั้นเมตาไฟล์ของคุณสามารถสร้างเป็นไฟล์ image2.jpg.meta.yaml. เนื้อหาต้องอยู่ในไวยากรณ์ yaml คุณสามารถเพิ่มไฟล์หรือข้อมูลเมตาที่คุณต้องการโดยใช้วิธีนี้