ยินดีต้อนรับคุณ, บุคคลทั่วไป กรุณา เข้าสู่ระบบ หรือ ลงทะเบียน

เข้าสู่ระบบด้วยชื่อผู้ใช้ รหัสผ่าน และระยะเวลาในเซสชั่น

ThaiSEOBoard.comพัฒนาเว็บไซต์Programming+ Shortcode สำหรับ Wordpress ไว้ลงโค๊ดรูปตามที่ต้องการ (Custom แบบสุดขีด)+
หน้า: [1]   ลงล่าง
พิมพ์
ผู้เขียน หัวข้อ: + Shortcode สำหรับ Wordpress ไว้ลงโค๊ดรูปตามที่ต้องการ (Custom แบบสุดขีด)+  (อ่าน 1221 ครั้ง)
0 สมาชิก และ 1 บุคคลทั่วไป กำลังดูหัวข้อนี้
anivox
หัวหน้าแก๊งเสียว
*

พลังน้ำใจ: 51
ออฟไลน์ ออฟไลน์

กระทู้: 1,012



ดูรายละเอียด
« เมื่อ: 10 มกราคม 2012, 20:44:56 »

อธิบายยากหน่อยนะครับ คือ เวลาจะลงรูปจะใส่แค่ หรือเราอยากจะใส่แอฟเฟคเวลาเปิดรูปเป็น 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 ได้ละ
« แก้ไขครั้งสุดท้าย: 10 มกราคม 2012, 20:48:51 โดย anivox » บันทึกการเข้า
หน้า: [1]   ขึ้นบน
พิมพ์