อธิบายยากหน่อยนะครับ คือ เวลาจะลงรูปจะใส่แค่ หรือเราอยากจะใส่แอฟเฟคเวลาเปิดรูปเป็น Lightbox, Fancybox อะไรพวกนั้นอะ
ถ้า shortcode แบบนี้ใครๆก็เขียนได้ใช่ไหม... แต่สำหรับ custom สุดๆ ที่สามารถลิงค์ไปรูปขนาดใดก็ได้ ลองอ่านต่อดู
ทุกอย่างทำใน functions.php นะครับ
ขั้นแรก Add ขนาดรูปก่อนเลย เวลาอัพโหลดรูป Wordpress จะ Crop รูปตามขนาดที่เราใส่ไว้
if ( function_exists( 'add_image_size' ) ) {
add_image_size( 'post-thumb', 283, 120, true );
}
(post-thumb ชื่ออะไรก็แล้วแต่, 283 = ขนาดกว้าง, 120 = ขนาดยาว, True = การ Crop ภาพ)
เริ่มการ Shortcode :
function customImage($atts, $content = null) {
extract(shortcode_atts(array('src' => '#'), $atts));
$path_parts = pathinfo($src);
$file_dir = $path_parts['dirname'];
$file_base = $path_parts['basename'];
$file_ext = $path_parts['extension'];
$file_name = $path_parts['filename'];
return '<a href="'.$src.'"><img src="'.$file_dir.'/'.$file_name.'-283x120.'.$file_ext.'"></a>';
}
add_shortcode('img', 'customImage');
อธิบาย :
customImage ในบรรทัดแรกกับบรรทัดสุดท้าย = ชื่อฟังชั่น
img บรรทัดสุดท้าย = คือชื่อ shortcode เวลาจะเขียนลงบล๊อก ถ้าเราเปลี่ยน img เป็น imgz , shortcode เราก็จะเป็น [imgz src="
http://domain.com/test.png 
"]
$path_parts = การแบ่งพาตของลิงค์ภาพเพื่อทำการเปลี่ยนแปลงลิงค์ภาพในภายหลัง (จากไอเดียผม)
$file_dir = เอา url ข้างหน้า เช่น
http://domain.com/test.png 
ก็จะกลายเป็น
http://domain.com/ 
เฉยๆ
$file_base = (ความจริงอันนี้ไม่ใช้) แต่มันผลลัพมันคือ test.png
$file_ext = เอานามสกุลไฟล์มา, ผลลัพคือ .png
$file_name = เอาชื่อไฟล์, ผลลัพคือ test
return = อันนี้บรรทัดสำคัญคือการร่วมฟังชั่นต่างๆจากข้างบนเอามาประยุคตามต้องการ จะเห็นว่าบรรทัดนี้จะมี -283x120 อันนี้คือเวลา Wordpress resize ภาพจะมีชื่อไฟล์ขนามดขนาดที่เรากำหนด เราก็เอามาบวกนู้น บวกนี้ เพิ่มนู้น เพิ่มนี้ไปตามที่เราตั้งการ
อาจจะใช้ภาษาผิดไปบ้าง แต่ก็ลองๆดูกันนะครับ
ตอนนี้เราก็สามารถใส่แค่
เวลาโพสใน Wordpress ได้ละ