Munu

กำหนดขนาด รูปภาพ ใน wordpress theme

หน้าแรก » ข่าวสาร » กำหนดขนาด รูปภาพ ใน wordpress theme

การกำหนดขนาดของรูปภาพที่ใช้ใน  wordpress theme  เช่น ขนาดรูป post-thumbnail หรือขนาดของรูปที่แทรกในโพส์ต ของเรา  ถ้ามองดูแล้วสำหรับคนที่เขียนบทความไม่เยอะมากอาจจะไม่พบปัญหามากเท่าไร เพราะ wordpress เอง ก็มีส่วนให้เราเข้าไปแก้ไข หรือกำหนดหนดขนาด กว้าง *ยาว ของรูปภาพที่ใส่เข้าไปได้อยู่แล้ว เช่น ถ้าเป็นรูปที่ post-thumbnail ก็กำหนดให้เล็กหน่อย เป็นขนาด 150 * 150 pixels หรือถ้าเป็นรูปที่เราแทรกใส่ใน บทความ ก็ต้องกำหนดขนาดของรูปให้พอดีกับ ขนาดความกว้าง ของส่วน single  post ใน theme  ถ้ารูปที่เราแทรกเข้ามามีขนาดใหญ่เกิน ผลลัพธ์ของหน้าเวบที่ได้อาจดูไม่สวย

เราจะกำหนดขนาด รูปภาพ ใน wordpress themeได้อย่างไร?

ถ้าเราไม่อยากแก้ไขขนาดของรูปบ่อยครั้ง ใน wordpress เองก็มีฟังก์ชัน ที่เอาไว้กำหนดขนาดของรูปภาพที่เราต้องการใช้แต่ละส่วนไว้ ฟังก์ชันที่ว่าคือ

?
1
2
3
4
5
<?php
add_image_size( $name$width$height$crop );
?>

การใช้งานก็ต้องมีการกำหนด พารามิเตอร์ให้มันหน่อย ซึ่งมันก็มีทั้งหมด 4 ตัว

1.$name : ใส่ชื่อครับ กำหนดได้เลยว่าจะให้ขนาดที่เราสร้างขึ้นมาชื่ออะไร แต่กำหนดให้มันสอดคล้องกับวัตถุประสงค์ที่เราสร้างหน่อย เพราะว่ามันจะมีผลตอนที่เราเรียกใช้ จะได้ไม่สับสน เช่น post-thimbnail เป็นต้น

2.$width: กำหนดความกว้าง หน่วยเป็น pixels

3.$height :กำหนดความสูง หน่วยเป็น pixels

4.$crop: กำหนดให้ตัดส่วนที่เกินออก หรือเป็นแบบย่อขนาด ถ้าต้องการใช้ก็ใส่ “true” มันก็จะตัดรูปส่วนที่เกินกำหนดออก ตามพารามิเตอร์ $width, $height ถ้าไม่ต้องการใช้ก็ไม่ต้องใส่อะไรลงไป เพราะ default คือ  false

การใช้งาน add_image_size( )

1.สร้าง ฟังก์ชัน ใน function.php ตามตัวอย่าง

?
1
2
3
4
5
function mytheme_setup() {
    add_image_size('featured-thumbnail',640,320, true);
    add_image_size('x-large',800,800, false);
}
add_action( 'after_setup_theme', 'mytheme_setup' );

ใส่ add_action( ‘after_setup_theme’, ‘mytheme_setup’ ); เพื่อให้ฟังก์ชันที่เราใส่ ทำงานเมื่อเริ่มหน้าเวบ

2.การเรียกใช้งาน ก็ให้ใช้ชื่อที่เรากำหนดไว้เป็น $tag ของฟังก์ชัน เช่น ต้องการเรียกใช้ ฟังก์ชัน the_post_thumbnail() เพื่อเรียก รูปthumbnail ที่เรากำหนดไว้ตอนเขียนบทความ แต่ให้มีขนาดตามที่เรากำหนด (‘featured-thumbnail’,640,320, true)

?
1
2
<?php the_post_thumbnail('featured-thumbnail');
// Inserts image with our defined dimensions ?>

รายละเอียดเพิ่มเติม http://codex.wordpress.org/Function_Reference/add_image_size

Tags: , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ,

เรามีทีมงานผู้เชี่ยวชาญที่มีประสบการณ์ด้านเว็บไซต์

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

Call

082-493-2295

E-mail

Konyubyub@Gmail.com

Location

บริษัท ดีไซน์นำโชค จำกัด
58/146 หมู่ที่ 6 หมู่บ้านซื่อตรง คลอง13 ตำบลบึงน้ำรักษ์ อำเภอธัญบุรี จังหวัดปทุมธานี 12110

2014 Powered by IYATHAI.com
Tel: 082-493-2295 E-mail: Konyubyub@gmail.com