คำแนะนำเกี่ยวกับขนาดภาพที่ครอบตัดของ WordPress

WordPress 3.9 ออกมาพร้อมกับพลังพิเศษมากมายภายใต้ประทุน คุณสมบัติใหม่ที่ยอดเยี่ยมในหมู่หลาย ๆ คนคือความสามารถที่เพิ่มเข้ามาเพื่อควบคุมตำแหน่งการครอบตัดของภาพที่อัปโหลดใน WordPress – นี่มันลื่นจริงๆ!!


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

The Very Beginning – การเพิ่มหรือปรับแต่งขนาดรูปภาพ

โดยค่าเริ่มต้น WordPress จะสร้างรูปของคุณเพิ่มเติมอีก 3 เท่า A ‘รูปย่อ’, ‘ขนาดกลาง’ และ ‘ขนาดใหญ่’ ขนาดภาพต้นฉบับที่อัปโหลดเรียกว่า “เต็ม”.

การกำหนดค่าเริ่มต้นเอง

คุณสามารถเขียนทับค่าเริ่มต้นของขนาดครอบตัดแต่ละขนาดได้อย่างง่ายดาย คุณสามารถไปที่ WordPress แดชบอร์ดการตั้งค่า >> สื่อ และเปลี่ยนค่าที่นั่นหรือคุณสามารถทำได้ผ่านไฟล์ฟังก์ชั่นธีมหรือปลั๊กอินของคุณเช่นนี้:

update_option ('thumbnail_size_w', 250);
update_option ('thumbnail_size_h', 250);
update_option ('thumbnail_crop', 1);

การเพิ่มขนาดเพิ่มเติม

คุณสามารถวางฟังก์ชั่นนี้ได้อย่างรวดเร็วและง่ายดายในธีมหรือไฟล์ฟังก์ชั่นปลั๊กอินของคุณ:

add_image_size ($ name, $ width, $ height, $ crop);

มันจะจบลงด้วยการมองสิ่งนี้:

add_image_size ('โฮมเพจ-thumb', 250, 250, จริง);

พืชยากปกติ

เคล็ดลับ: อย่าลืมตั้งชื่อภาพที่ไม่ซ้ำกัน ;-).

ทุกสิ่งที่คุณจำเป็นต้องรู้สามารถพบได้ผ่านทาง WordPress Codex.

WordPress 3.9+ Magic – การควบคุมตำแหน่งการครอบตัด

ก่อนหน้านี้พารามิเตอร์ $ ครอบตัดเป็นเพียงค่าบูลีนจริงหรือเท็จ ดังนั้นการครอบตัดแบบอ่อนหรือแบบยากถ้าตั้งค่าเป็นจริง (อ่านต่อไปเรื่อย ๆ เพื่อดูความแตกต่างระหว่างการครอบตัดแบบแข็งและแบบอ่อน) อย่างไรก็ตามตอนนี้คุณสามารถใช้อาร์เรย์เพื่อระบุตำแหน่งของพื้นที่ครอบตัด (x_crop_position, y_crop_position) ฉันชอบภาพที่ครอปจากตรงกลางดังนั้นตัวอย่างเช่นฟังก์ชั่นของคุณอาจเป็นแบบนี้:

add_image_size ('โฮมเพจ-thumb', 250, 250, อาร์เรย์ ('กึ่งกลาง', 'กึ่งกลาง'));

ผู้ใช้เลือกการครอบตัดแบบยาก

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

ด้านบนซ้าย
กลางซ้าย
ด้านล่างซ้าย
ด้านบนขวา
ศูนย์ขวา
ด้านล่างขวา
กลางด้านบน
ศูนย์กลาง
ตรงกลางด้านล่าง

ดังนั้นฉันจึงตัดมันตอนนี้ฉันจะใช้มันอย่างไร?

ข่าวดี … มันเหมือนกันทุกประการ !! สำหรับการวิเคราะห์แบบเต็มเช่นเคยดูที่ WordPress Codex. นี่คือการเตือนความจำในกรณีใด ๆ วิธีเรียกภาพที่กำหนดเองนี้ในธีมหรือปลั๊กอินของคุณ ในตัวอย่างที่เราใช้อยู่นี่คือวิธี:

the_post_thumbnail (หน้าแรกของนิ้วหัวแม่มือ ');

หรือ…

wp_get_attachment_url (get_post_thumbnail_id ($ post-> ID, 'homepage-thumb'));

แต่สิ่งที่เกี่ยวกับรูปภาพที่มีอยู่ทั้งหมดของฉัน?

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

Aaah แต่เดี๋ยวก่อนโชคดีที่พวกเขามีคนฉลาดและน่ากลัวมากมายในชุมชน WordPress เพื่อบันทึกวันนี่คือ สร้างปลั๊กอินรูปขนาดย่อใหม่. ปลั๊กอินนี้มีมานานแล้วมันวิเศษมาก! มันจะวนไปตามภาพที่คุณอัพโหลดทั้งหมดและสร้างขนาดภาพใหม่ทั้งหมดที่คุณเพิ่มหรือปรับแต่ง แก้ไขปัญหา Woohooo แล้ว��

ยากกับ พืชผลอ่อน – คุณตัดสินใจ

พืชยาก

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

ครอบตัดแบบนุ่ม

ครอบตัดแบบนุ่ม
การครอบตัดแบบนุ่มจะไม่ตัดภาพใด ๆ มันจะย่อขนาดรูปภาพลงจนกว่าจะพอดีกับขนาดที่ระบุรักษาอัตราส่วนเดิม.

สิ่งที่ควรรู้ …

ในกรณีที่ขนาดของภาพที่อัปโหลดใด ๆ (ความกว้างหรือความสูง) มีขนาดเล็กกว่าขนาดครอบตัดที่ตั้งไว้มันจะถูกข้ามและเวอร์ชันสำหรับขนาดนั้นจะไม่ถูกสร้างขึ้น! WordPress จะวนรอบทุกขนาดภาพที่กำหนดและสร้างเฉพาะรุ่นของภาพเหล่านั้นที่ใหญ่กว่าของรุ่นที่พยายามสร้าง ในกรณีเช่นนี้เมื่อมีการดึงภาพภายในธีมหรือปลั๊กอินของคุณและไม่มีอยู่มันจะใช้ค่าเริ่มต้นเป็นรูปภาพดั้งเดิม “เต็ม” เป็นทางเลือก.

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

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map