$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $content, $ok);

$show = $ok[1][0];

(ถ้า echo $show จะได้ http://xxx.com/img/pic1.png)
--------------
คำถาม
จะแทรก "-300x???" เข้าไปได้อย่างไรครับ?

ให้ echo ออกมาแบบนี้
http://xxx.com/img/pic1-300x???.png

(??? ค่านี้เป็นเลขอะไรก็ได้ ไม่คงที่)

<?php
$sub = ['.png'=>'-300x'.rand().'.png', '.jpg'=>'-300x'.rand().'.jpg', '.jpeg'=>'-300x'.rand().'.jpeg', '.gif'=>'-300x'.rand().'.gif'];
echo strtr($show, $sub);

ค่า??? เป็นความสูงของรูปซึ่งแตกต่างกันแต่มีอยู่แล้วใน​folder upload
เราจะปล่อยให้มันแสดงเองหรือข้ามไปได้ไหม

ต้องการเอาค่า $show ไปทำอะไรบ้างครับ จะได้บอกถูก

เอาไปแสดงในหน้าphpที่เขียนtag img รอใว้แล้วครับ

แค่รอurlรูปที่ผมกำลังจะถามนี้อยู่
เพราะรูปนี้มันมีอยู่ในuploadแล้วถูกสร้างจากรูปต้นฉบับตอนอัพรูปขึ้นwordpressโดยถูกลดขนาดอัตโนมัติ(ซึ่งจะเป็นขนาดกว้าง300พอดีแต่สูงจะไม่ฟิกเพราะมันจะแปลงเป็นสัดส่วนเดียวกับรูปต้นฉบับ)

ดึงจากฐานข้อมูลwordpressง่ายกว่ามั้ยครับได้ครบด้วย

จริงๆมันควรเป็นงั้นครับ
แต่ wordpress ที่เป็นคำสั่งดึงรูปขนาดกลางมามันไม่มีออฟชั่น ว่า ถ้าไม่มีรูปในโพสท์ให้แสดงรูป default แทน และรูปมันจะว่างไปเลย
ทีนี้ก็มีคนเขียน code ขึ้นมา ใช้ first image ดึงรูปแรกของโพสท์ ปรากฏว่า มันดึงรูปขนาดใหญ่มา
เวลาจะดึงรูปมาหน้าหลักหลายรูปทำให้มันช้าจึงคิดจะเปลี่ยนมันให้เป็นรูปขนาด 300x... แทน
ก็เหลือแค่ แปลงให้มันมี format ตรงกับรูปที่มีอยู่
โดยเพ่ิม อักขระเข้าไป -300x???

ใช้timthumbครับ
ใช้timthumbดัดแปลงใช้งานได้ครับ ลองดูวิธีใช้งานแล้วเอามาใช้กับงานเราดู

preg_replace() หรือ preg_replace_callback() ครับ ทำได้ตามต้องการแน่นอน ถ้าจะหาวิธีอื่นนี่ผมว่ายุ่งยากกว่าอีก

ประมาณนี้ไหมครับ

<?php
$str = " http://xxx.com/img/pic1.png";
$x = "200";
$strReplace = "-300x".$x.".png";
$str = str_replace(".png",$strReplace,$str);
echo $str; 
?>

โค๊ดนี้ง่ายและดีมากเลยครับ แต่ติดปัญหา2อย่าง
1. ค่า $x มันจะเป็นค่าที่ ไม่สามารถ fix ได้ เพราะขนาดภาพที่ถูกสร้างใหม่ตอนอัพโหลดจะมีขนาดกว้าง300 และ สูงเป็นอัตราส่วนเดิม จึงต้องใช้การเขียนแบบ่ฟิกค่าไม่ได้ ซึ่งผมไม่รู้คำสั่งนั้น )
2.$str = " http://xxx.com/img/pic1.png";
นี้ตั้งต้นมาจาก
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
$str = $matches[1][0]; 
แต่ถ้า echo $str มันจะได้ http://xxx.com/img/pic1.png
(ที่จริงผมควรบอกที่มา ตั้งแต่แรก แต่เกรงจะยาว ต้องขออภัยด้วยครับ)
จากการทดสอบ เเทนค่า เอา$matches[1][0]; มาแทน http://xxx.com/img/pic1.png ปรากฏว่าไม่ได้แฮะ

โค๊ดเต็มผมเป็นแบบนี้ครับ (ใช้กับ wordpress)
มีข้อเสียอย่างเดียวคือ มันจะดึงรูป original มา
ทำให้ช้า ถ้าเราจะโชว์หน้าแรกหลายรูป
ผมจึงจะดึงรุปย่อที่ระบบแปลงไว้เเล้วใช้รุป 300x... แทน

ใน functions.php
***************
function get_post_image() {
global $post, $posts;
$first_img = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
$first_img = $matches[1][0]; 
if (!empty($matches[1][0]) ) {
$first_img = $matches[1][0];
} else {
$first_img = 'รูป defualt';
}
return $first_img;
}

การใช้งาน (ในหน้าแสดงเว็บ)
------------
<?php echo get_post_image(); ?>

1. ค่า $x คือค่าความสูงถูกไหมครับ มันดึงค่ามาใช้ได้เลยไหมครับในบรรทัดที่จะใส่ replace แทนอันเดิมลงไป หรือต้องไปอ่านจากไฟล์แล้วดึงขนาดมาอีกทีอยู่ดีว่าค่าความสูงเป็นเท่าไหร่
2. ที่มันแทนไม่ได้ มันมีฟ้อง error อะไรไหมครับ +ขอดูโค้ดที่ใช้คำสั่ง str_replace แทนแล้วไม่ได้หน่อยครับ

1. ค่า $x คือ ความสูง
ซึ่งแต่ละรูปที่เราอัพโหลดไป wordpress มันจะสร้างขึ้นมาใหม่เป็นขนาด กว้าง300 x สูง $x
เป็นสัดส่วนเดียวกับรุปต้นฉบับ ซึ่งรูปต้นฉบับที่เราอัพไปสัดส่วนไม่เท่ากัน แต่ ตัวโปรแกรมจะตั้งค่ากว้างไว้ที่300px เสมอ และให้สูงแปรผันไปตามกว้าง(คงสัดส่วน)
2. มันไม่ฟ้องอะไรครับ ยังคงแสดงรูปใหญ่เหมือนเดิม
ผมเอามาแทนค่าแบบนี้ครับ

function get_post_image() {
global $post, $posts;
$first_img = '';
ob_start();
ob_end_clean();
$output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $post->post_content, $matches);
if (!empty($matches[1][0]) ) {
$first = $matches[1][0];
$x = "200";
$strReplace = "-300x".$x.".png";
$first_img = str_replace(".png",$strReplace,$first);
} else {
$first_img = 'รูป defualt';
}
return $first_img;
}

ปัญหาข้อ 1 ถ้าเป็นแบบนี้ มันก็ต้องไปอ่านขนาดจากไฟล์อีกถูกไหมครับ ซึ่งจะอ่านได้มันก็ต้องรู้ชื่อไฟล์+pathไฟล์ที่แน่นอนอีก ทำให้มันจัดการยาก
น่าจะลองเปลี่ยนการตั้งชื่อให้โปรแกรมรองรับสำหรับทุกรูปนะครับ อย่างเช่น pic1_resize.png หรือ pic1_small.png อะไรทำนองนี้ครับ

ข้อ 2 นี่การเปลี่ยนชื่อไฟล์ ในคำสั่ง str_replace น่าจะต้องใช้ไฟล์ที่เกิดขึ้นหลัง resize เป็นขนาดเล็กแล้วนะครับ อันนี้ผมไม่แน่ใจว่ามัน resize ตอนไหน

ข้อ1 ถ้ากำหนดชื่อถูก มันจะอ่านถูก
เพราะ เราระบุ ...300x (ตัวเลขเท่าไรก็ได้)
ตัว wordpress เองมันตั้งค่าไว้ตอนอัพโหลดครับ
2.มัน resize ตอนอัพโหลดครับ
มันก็จะสร้างรูปใหม่มา อีก 2 รูป

สรุป code บนสุดที่ให้มาใช้เปลียนชื่อได้ (ตรวจสอบนามสกุลให้ตรงกัน แก้ให้ใช้กับกับทุก นามสกุล)
ปัญหาที่แก้ยาก
ความสูงของรูป ต้องไป ตรวจสอบขนาดไฟล์ กว้างยาวของรูปเดิม แล้ว เขียนสูตรให้คำนวณเป็นสัดส่วนเดียวกันกับความกว้าง 300px
ซึ่งจะต้องเป็น สูตรเดียวกับที่ wordpress ใช้ในการสร้างรูปนั้น จึงจะได้เท่ากัน และดึงรูปมาได้

วิธีการเปลียนชื่อไฟล์ เพื่อให้ดึงรูปขนาด 300px มาใช้จึงยุ่งยาก
ให้ใช้แนวทางใหม่ คือ เอาสอง code นี้รวมกัน โดยอาจใช้ if else
code ชุดที่1 = ดึงรูป meduim ถ้าไม่มีให้เป็นค่าว่าง (wordpres มีมาให้แล้ว ดูในบทความเว็บนี้)
code ชุดที่2 = ดึงรูปแรกในโพสมา(รูปใหญ่) ถ้าไม่มีรูปแลย ให้แสดงรูป default

code ชุดที่2 ทำงานหลังชุดที่1 โดย ถ้าเช็คแล้วมีรูปก็ให้หยุด ถ้าไม่มีรูปให้ แสดงรูป default

การใช้ code 2 ชุดทำงาน

code ชุดที่2 ทำงานหลังชุดที่1
โดย code ชุดที่2 เช็ครูปใน post
– ถ้ามีรูปอยู่ ไม่ว่าจะ ใน site หรือ นอก site ให้หยุด (เพียงแค่ลบ $first_img = $matches[1][0];)
– ถ้าไม่มีรูปให้ แสดงรูป default

สรุป code ชุดที่2 เปลี่ยนดังนี้
1. ลบ $first_img = $matches[1][0]; ออก
2. เปลียนให้เรียกรูปเต็ม เป็น $first_img = ‘<img =src=”รูป defualt”>’;
3. ตั้งชื่อฟังก์ชั่นใหม่ เป็น get_post_image2
เพราะ get_post_image ยังคงใช้งานอยู่สำหรับ การเรียกรูปแบบเดิม ใน category พิเศษต่างๆ

การใช้งานให้ลบ code เดิมออก
แล้วใส่ code ชุด1 ,ชุด2 เข้าไปแทน

<!--<img src="<?php/* echo get_post_image(); */?>"/>-->  <!-- code เดิม-->

<?php echo get_post_image_medium(); ?> <!-- code ชุดที่1-->
<?php echo get_post_image2(); ?>  <!-- code ชุดที่2-->

ปัญหา
1. ถ้ารูปในเว็บไซต์ มาจากเว็บภายนอก (hotlink) มันจะไม่แสดงรูป เพราะ
code1 ทำงานโดยดึงรูปจากในเว็บภายใน ถ้าไม่มีก็ไม่แสดง (และไม่มีคุณสมบัติดึงรูปจากภายนอก เพราะตัวมันเกิดจากแนวคิด การดึงรูปย่อขนาดต่างๆ มาใช้งาน)
code2 ทำงานแค่ตรวจสอบรูปในโพสท์ ถ้าไม่มี จะแสดงรูป default แทน
(ถ้าโพสท์นั้นมีรูปภายนอก มันจะไม่ทำงาน เพราะ เราตัดคำสั่งนั้นไป (เพื่อต้องการรูปย่อจาก code1 มาแทนที่ )
โดย code2 ถ้ามันเจอว่ามีรูป (ไม่ว่าจะนอก หรือ ใน site หากมีอยู่ใน โพสท์ ก็จะไม่แสดงรูปใด)

2. โพสที่มี ไฟล์ pdf แสดงอยู่ code1 จะมองว่าทั้งโพสท์ ไม่มีรูป

การรวมโค๊ดจึงเพิ่มคุณสมบัติของ code1 ให้ สามารถแสดง รูป defaultได้ ถ้าไม่มีรูปในโพสท์เท่านั้น