สวัสดีครับ วันนี้ผมจะนำทุกๆ ท่านมาให้รู้จักกับ TimThumb กันนะครับ เจ้า TimThumb คือ script php ที่สามารถจะย่อไฟล์ได้โดยที่เราไม่ต้องสร้างไฟล์ใหม่ ยกตัวอย่างเช่น

ปกติเวลาเราจะอัพโหลดรูปภาพ เราต้องแยกเป็น 2 ไฟล์ เพื่อความรวดเร็ว

1. ไฟล์ขนาดเดิมๆที่อัพโหลดรูปเข้ามา

2. ไฟล์ Thumbnail เพื่อความสวยงามและรวดเร็วในการใช้รูปขนาดเล็กมาแสดง

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

แต่!! ถ้าเราใช้เจ้า TimThumb คุณสามารถจะทำ thumbnail ได้เลยง่ายๆ เพียงแค่เรียกใช้งาน Timthumb เท่านั้น

หลักการทำงานของ TimThumb คือ TimThumb จะไปสร้างไฟล์ไว้ในโฟเดอร์  cache ให้เราเองเวลาย่อรูปครับ

เพื่อนๆ สามารถดาวน์โหลด TimThumb ได้ที่นี่เลยครับ

เมื่อดาวน์โหลดเรียบร้อยก็ทำการ unzip ออก จะได้ไฟล์ timthumb.php ให้ทำการอัพโหลดไปบน server นะครับ

อย่างเช่นของเว็บ itangmo ได้อัพไว้ที่ http://www.itangmo.com/thumb.php ** โดยผมได้เปลี่ยนชื่อไฟล์จาก timthumb.php ให้เป็น thumb.php เฉยๆ ใครจะเปลี่ยนหรือไม่เปลี่ยนตามก็ได้ครับ **

มาลองดูวิธีใช้งาน TimThumb กันนะครับ

การเรียกใช้งาน TimThumb คือ http://www.itangmo.com/thumb.php?src= แล้วตามด้วย ไฟล์รูปที่ต้องการย่อรูป

สามารถดูได้ดังตัวอย่างด้านล่างนี้

ภาพขนาดปกติ

ภาพเมื่อเรียกใช้งาน TimThumb

thumb.php?src=uploads/article/f139582724bff293b45d2bfa44d717dc.jpg

เมื่อเรียกใช้งาน TimThumb แบบไม่ได้กำหนดค่าความกว้างหรือความสูง รูปที่ออกมาจะมีขนาด 100px * 100px

ภาพเมื่อเรียกใช้งาน TimThumb และกำหนดความกว้าง = 200px

thumb.php?src=uploads/article/f139582724bff293b45d2bfa44d717dc.jpg&w=200

เมื่อกำหนดความกว้าง =200 แต่ไม่ได้กำหนดความสูง ภาพจะออกมาตามสัดส่วนจริง

ภาพเมื่อเรียกใช้งาน TimThumb และกำหนดความสูง = 200px

thumb.php?src=uploads/article/f139582724bff293b45d2bfa44d717dc.jpg&h=200

เมื่อกำหนดความสูง =200 แต่ไม่ได้กำหนดความกว้าง ภาพจะออกมาตามสัดส่วนจริง

ภาพเมื่อเรียกใช้งาน TimThumb กำหนดความกว้าง = 200px และความสูง = 200px

thumb.php?src=uploads/article/f139582724bff293b45d2bfa44d717dc.jpg&w=200&h=200

เมื่อกำหนดความกว้าง = 200px และ ความสูง = 200px ภาพจะถูก crop เอาตรงกลาง และจัดขนาดให้เป็น 200px * 200px โดยไม่เสียสัดส่วนภาพ

ภาพเมื่อเรียกใช้งาน TimThumb กำหนดความกว้าง = 200px ความสูง = 200px และความละเอียด = 10

thumb.php?src=uploads/article/f139582724bff293b45d2bfa44d717dc.jpg&w=200&h=200&q=10

เมื่อกำหนดความกว้าง = 200px ความสูง = 200px และความละเอียด = 10 ภาพที่ออกมาจะแตก เพระาถูกลดรายละเอียดลง

ภาพเมื่อเรียกใช้งาน TimThumb กำหนดความกว้าง = 200px ความสูง = 200px และความละเอียด = 100

thumb.php?src=uploads/article/f139582724bff293b45d2bfa44d717dc.jpg&w=200&h=200&q=100

เมื่อกำหนดความกว้าง = 200px ความสูง = 200px และความละเอียด = 100 ภาพที่ออกมาจะสวยงาม

** ความละเอียดของภาพสามารถปรับได้ตั้งแต่ 0-100 **

ภาพเมื่อเรียกใช้งาน TimThumb กำหนดความกว้าง = 200px ความสูง = 200px และกำหนดตำแหน่งด้านซ้าย

thumb.php?src=uploads/article/f139582724bff293b45d2bfa44d717dc.jpg&w=200&h=200&a=l

เมื่อกำหนดความกว้าง = 200px ความสูง = 200px และกำหนดตำแหน่งด้านซ้าย ภาพที่ออกมาก็จะโฟกัสไปที่ด้านซ้าย แทนตรงกลางที่เป็นค่ามาตรฐาน

ภาพเมื่อเรียกใช้งาน TimThumb กำหนดความกว้าง = 200px ความสูง = 200px และกำหนดตำแหน่งด้านขวา

thumb.php?src=uploads/article/f139582724bff293b45d2bfa44d717dc.jpg&w=200&h=200&a=r

เมื่อกำหนดความกว้าง = 200px ความสูง = 200px และกำหนดตำแหน่งด้านขวา ภาพที่ออกมาก็จะโฟกัสไปที่ด้านขวา แทนตรงกลางที่เป็นค่ามาตรฐาน

เอาและครับ หวังว่าเพื่อนๆ ทุกคนคงจะได้ความรู้เรื่อง การทำ thumbnail ง่ายๆ ด้วย TimThumb กันไป ไม่มากก็น้อย บทความหน้า จะเป็นเรื่องอะไร ติดตามได้ที่นี่ ไอ้แตงโมดอมคอม ครับผม