ถอดธีม wordpress สู่ ธีมsmf

พูดถึงธีม smf แล้วในท้องตลาดหรือตามเว็บทั่วไปทำแจกค่อนข้างน้อย หรือไอ้ที่แจกๆนั้นก็ไม่ค่อยถูกสเป็คสักเท่าไร แต่ก็นั่นแหละครับ ถึงจะสวยงามเมพขนาดไหนมันก็ไม่ถูกใจเราไปทั้งหมด T_T

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

เรารู้ความต้องการของเราแล้ว อันดับต่อไปนี่สำคัญมาก..แล้วจะเริ่มต้นอย่างไร?
สำหรับคนที่มีความรู้ถึงโครงสร้างของธีมsmf บ้างแล้ว รู้จักคำสั่ง css บ้างแล้ว อันนี้ไม่ยาก แต่สำหรับคนที่ยังไม่รู้อะไรเลยนี่ยากละ ผมไม่ขอพูดถึงรายละเอียดสำหรับคนกลุ่่มหลังนี้นะ

ผมได้เขียนไว้ในบล็อกนี้เกี่ยวกับการเริ่มต้นแต่งธีมsmf จากธีม Default ไว้แล้ว ตั้งแต่สเต็ปแรก (คลิกไปอ่านได้)


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

http://www.hosting22.com/wordpress/elegantthemes/
http://www.webdesignbooth.com/wordpress-showcase-40-beautiful-and-well-designed-blogs-powered-by-wordpress/
http://freewordpresslayouts.com/


ไปเลือกที่ชอบๆมาสักอัน วิธีเลือกธีม wordpress ที่จะมาใช้เป็นธีม smf ให้ใช้วิจารณญาณส่วนตัวครับ แต่มีหลักคิดอย่างหนึ่ง คือ ธีมเวิร์ดเพรสสวยๆที่เราเห็นนั่นนะ ถ้าจะมาเป็นธีมsmf มันจะต้องตัดอะไรทิ้งไปบ้าง และจะต้องมีอะไรมาแทนที่

ธีม wordpress จะมีท็อปเมนู ธีม smf ก็มี
ธีม wordpress มีเนื้อหาตรงกลาง และมีเมนูด้านข้าง(ซ้ายหรือขวา)
ธีม smf มีเนื้อหาตรงกลางเหมือนกัน แตไม่มีเนูด้านข้างไม่ว่าซ้ายหรือขวา เพราะต้องการแสดงเนื้อหาหรือภาพในกระทู้ในพื้นที่ๆกว้างๆ
ส่วน footer ทั้ง wordpress และ smf เหมือนกัน

สรุปก็คือ smf ไม่มี sidebar พอเห็นธีม wordpress ที่สวยๆ ก็ลองนึกจินตนาการว่า ถ้าเป็น smf ซึ่งไม่มี sidebar แล้ว ธีมตัวนี้จะยังสวยอยู่มั้ย?

ถ้าคิดดูแล้ว มันก็น่าจะยังสวยอยู่ก็เลือกเอาธีมนั่นแหละ ..หรือถ้าคิดดูแล้ว ถ้าไม่มี sidebar ไม่สวยแน่ๆ ก็เอามาทั้ง sidebar นั่นแหละ smf มี sidebar ก็ไม่เลว เพียงแต่เนื้อที่แสดงเนื้อหากระทู้จะเล็กลงไปเท่านั้น ไม่สะใจพวกชอบโพสต์รูป

หลังจากเลือกธีมได้แล้ว ที่เหลือก็อยู่ที่วิธีการถอดรูปจาก wordpress สู่ smf โดยวิธีการและขั้นตอนที่ผมได้เคยเขียนแล้วเป็นสเต็ปนั่นแล

ขอให้สนุกกับการแต่งธีมครับ

[smf]แจกธีม smf 2.0 เรียบง่ายสบายตา

วันนี้มีธีม smf เวอร์ชั่น 2.0 มาแจกครับ
ธีมตัวนี้เหมาะสำหรับนำไปโมดิฟาย ง่ายต่อการแก้ไข ปรับปรุง เปลี่ยนแปลง แก้ไข ฯลฯ


ตัดแปลงมาจากธีมsmf Default ของเวอร์ชั่น 2 แต่ได้เพิ่มพื้นหลังเป็นแกลเลอรี่ หมุนเวียนสลับเปลี่ยนไปเรื่อยๆตามจำนวนภาพที่เราได้ใส่ไป

ถ้าต้องการเพิ่มหรือเปลี่ยนภาพพื้นหลัง ให้เปิดไฟล์ index.template.php บรรทัดที่ 405 หรือค้นหาคำว่า
 id="slideshow" ท่านจะเห็นรายชื่อภาพ ดังนี้


 <img src="http://a3.sphotos.ak.fbcdn.net/hphotos-ak-ash4/300813_193622397380685_100001987785137_445274_1599363279_n.jpg" alt="Slideshow Image 1" class="active" />
<img src="http://a3.sphotos.ak.fbcdn.net/hphotos-ak-ash4/319177_193910440685214_100001987785137_445875_286526053_n.jpg" alt="Slideshow Image 1"/>
<img src="http://image.ohozaa.com/i/382/isa2K.JPG" alt="Slideshow Image 2" />
<img src="http://image.ohozaa.com/i/41b/bUHDf.JPG" alt="Slideshow Image 3" />
<img src="http://a2.sphotos.ak.fbcdn.net/hphotos-ak-ash4/310987_10150354398662762_702047761_8356920_1947153730_n.jpg" alt="Slideshow Image 4" />

นั่นคืำอจำนวนภาพทั้งหมด หากต้องการภาพอื่นก็แค่ไปหา url ของภาพมาเปลี่ยน

อันดันต่อไปมาดูหัวของธีมตัวนี้ "ชุมชนออนไลน" ชาวพฤกษาทาวน์ 
ตัวนี้ใช้ cufon นะครับ ตัวหนังสือที่อยู่ภายใต้แท็ก h1 , h2 และคลาส .sub-title จะกลายร่างเป็นฟ้อนท์ลักษณะแบบนี้หมด ผมเลือกใช้แค่่ส่วนหัวของบอร์ด

อันสุดท้ายมาดูที่ส่วนfooter ด้านล่างสุดมีการดึงข่าวrss มาแสดงด้วย ท่านสามารถเปลี่ยนแหล่งข่าวจากที่อื่นได้ด้วยตัวเอง โดยสามารถเปิดไฟล์ index.template.php

ค้นหาคำว่า feedrss() วิธีใช้งานก็แค่เอา rss จากเว็บที่เราต้องการแสดงมาใส่ เช่น ผมดึงข่าวจากไทยรัฐ ก็จะได้แบบนี้ feedrss('http://www.thairath.co.th/rss/news.xml')

สุดท้ายอยากให้ลองไปดาวน์โหลดมาใช้กันดูครับ เจอปัญหาตรงไหนก้อโพสต์ถามได้ครับ

ดาวน์โหลดที่นี่


ดูตัวอย่างจริงที่นี่

MVC กับ ลูกบอล 3 สี

www.anil2u.info ได้เปรียบเทียบการจัดการโค๊ดด้วยระบบ MVC ด้วยลูกบอล 3 สี ซึ่งดูแล้วทำให้เข้าใจระบบ MVC มากขึ้น

ภาพแรก ให้เลือกลูกบอลสีแดงออกมา จะเห็นว่ามีความยุ่งยากพอสมควรเพราะทุกสีคละเคล้าปะปนกันไปหมด เปรียบเทียบกับการเขียนโปรแกรมรวมกันระหว่าง PHP , Database และ HTML

ภาพที่สอง แม้จะแยกลูกบอลสีเขียวออกไปแล้ว แต่โจกทย์คือให้เลือกลูกบอลสีแดงออกมา ก็พบว่ายังมีความยุ่งยากเช่นเดิม แม้ไม่ยากเท่ากับโจทย์แรก แต่ก็สร้างความยุ่งยากไม่น้อย เปรียบเทียบกับระบบเทมเพลท เช่น smarty  โดยแบ่ง Coding กับ Database ไว้ส่วนหนึ่ง และแยก HTML ไว้อีกส่วนหนึ่ง

ส่วนภาพสุดท้าย มีการแยกลูกบอลทั้งสามสีออกจากกัน  เมื่อต้องการลูกบอลสีไหนก็หยิบสีนั้นออกมาโดยทันที เปรียบเทียบกับระบบ MVC ที่มีการแยกการจัดการชัดเจน เช่น CakePHP , CodeIgniter

ที่มาครับ  http://www.anil2u.info/2011/11/understanding-the-basic-need-of-mvc-architecture/

[PHP] substr, strlen และ strrpos

วันนี้ชวนมาทบทวน function พื้นฐานใน php ว่าด้วย substr, strlen และ strrpos

หากเราต้องการจะแทนที่อะไรสักอย่างในตำแหน่งใดตำแหน่งหนึ่ง ด้วยเครื่องหมาย xxx หรือ ****
เช่น ผู้ใช้มีรหัสผ่านชุดหนึ่ง 123456789 เราอยากจะแทนที่ 3 ตำแหน่งสุดท้ายอันได้แก่ 789 ด้วยเครื่องหมาย xxx หรือ ***  จะทำอย่างไร?

พระเอกในโจกทย์นี้คือ substr + strlen
substr ( string, start, length ); //ใช้ดึงข้อความตั้งแต่ตำแหน่งที่กำหนด ตามจำนวนที่กำหนด
ส่วน strlen  strlen ( string ); //ใช้นับจำนวนอักษรทั้งหมด

ตัวอย่างการใช้งาน
echo substr($_POST['password'],0,strlen($_POST['password'])-3)."***";

ผลลัพธ์ 123456***


แต่ถ้าจะแทนที่ชุดอักษรที่มีเครื่องหมายคั่นระหว่างเช่น ตัวเลขไอพี  125.115.620 เราต้องการจะแทนตัวเลขชุดสุดท้าย ด้วยเครื่องหมาย xxx ให้ได้ผลลัพธ์ 125.115.xxx
ให้ใช้ substr + strrpos 
strrpos ( string, find, start ); //ใช้ค้นหาข้อความที่กำหนดใน string จากหลังมาหน้า โดยจะคืนค่าตำแหน่งแรกที่พบ หรือคืนค่า false ถ้าไม่พบ ( การค้นหานี้คำนึงถึงตัวพิมพ์เล็กพิมพ์ใหญ่ ) 

ตัวอย่างการใช้งาน


$ip=" 125.115.620";
echo substr($ip,0,strrpos($ip,'.')).".xxx"
ผลลัพทธ์  125.115.xxx