วันศุกร์ที่ 13 กุมภาพันธ์ พ.ศ. 2558

การแก้ไขพาธของ apserv

การแก้ไขพาธของ apserv
1. เลือก Apache Edit the httpd.conf Configuration File
2. ภายในไฟล์นี้ แก้ 2 จุด คือ
   2.1 DocumentRoot "C:/AppServ/www"
   2.2
แก้ให้เป็นพาธที่เราต้องการ

และแก้ไขพาธที่ MySQL
เลือกที่ MySQL Edit the my.ini Configuration File แล้วแก้เพียงจุดเดียวคือ
datadir="C:\AppServ/MySQL/data/"

แก้ให้เป็นพาธที่เราต้องการ


/// การแก้ไขไฟล์ในเดททอปให้ไปอยู่ที่ฮาร์ดิสก์อื่น
ไปที่ regedit / HKEY_CURRENT_USER/Software/Microsoft/Windows/CurrentVersion/Explorer/ShellFolder
แก้ไขพาธของ DeskTop ตามใจเด้อ

วันพุธที่ 27 สิงหาคม พ.ศ. 2557

array_key_exists() กับ in_array()

array_key_exists กับ in_array เหมือนกันและต่างกัน

เหมือนกัน คือ สำหรับเช็ค array เหมือนกัน และคืนค่านเป็น boolean เหมือนกัน


ตัวอย่าง
$array=array("เสือ","แมว");
if(in_array("เสือ",$array)) {
true;
}

ส่วน array_key_exists เช็คเหมือนกัน แต่เช็คค่า key ของ array
ตัวอย่าง
$array=array("animal"=>"เสือ","local"=>"ป่า");
if( array_key_exists ("animal",$array)) {
true;
}



ไม่ใช่อะไร ...มันชอบลืมและใช้สับสนบ่อยๆเลยเขียนไว้ซะเลย ดูสิมันจะลืมอีกมั้ย?

วันอังคารที่ 1 กรกฎาคม พ.ศ. 2557

SMF Responsive Theme Download ฟรี!

เขียนบทความเกี่ยวกับ SMF Responsive อยู่ 2-3 บทความ พร้อมๆกับการเขียนก็ต้องลงมือทำไปด้วย เพื่อให้สามารถมาเขียนได้และทำได้จริง

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

หลายครั้งที่ผมอ่านบทความ how to และลองทำตาม แต่เมื่อขั้นตอนสุดท้ายผลลัพท์กลับไม่ได้ตามตัวอย่าง

วันนี้ผมเลยนำธีม SMF Responsive มาให้ดาวน์โหลดเอาไปโม เอาไปศึกษา หรือเอาไปใช้งานได้เลยครับ

ขอความกรุณาเก็บเครดิตเล็กๆของผมที่ Footer ไว้ให้ด้วยนะครับ :o


ธีม SMF ตัวนี้ชื่อ Justified เปลี่ยนโครงสร้างของ SMF เป็น Bootstrap เพื่อให้เป็น Responsive ที่สามารถแสดงผลได้ทั้งในพีซี โน๊ตบุค แท็บเล็ต และโทรศัพท์มือถือ (ไม่ support โทรศัพท์บ้าน:o )


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

ดาวน์โหลด


หมายเหตุ : เนื่องจากเว็บตัวอย่างที่ผมไปฝากไฟล์ไว้เป็นโฮสท์ฟรี ก็จึงมีแบนเนอร์ผลุบๆโผล่ๆบ้าง
แบนเนอร์อันนั้นไม่ใ่ช่ของผมครับ เป็นของโฮสท์ฟรีเขา และมันจะไม่ติดไปกับธีมครับ

หากพบข้อผิดพลาด หรือสงสัยติ-ชมโพสต์ในกระทู้ได้ หรือเมล์มาที่ nevikupแอดhotmail.com


วันอังคารที่ 24 มิถุนายน พ.ศ. 2557

[SMF] How to SMF Responsive ตอนที่ 2 หน้าแรก

ไฟล์แรกที่เราจะทำการปรับเปลี่ยน คือ ไฟล์หน้าแรกของบอร์ด 

หน้าแรกของบอร์ดที่ไฟล์ที่เกี่ยวข้อง 2  ไฟล์ คือ
1. index.template.php
2. BoardIndex.template.php

ไฟล์ index.template.php จะมีหน้าที่เป็นโครงสร้างหลักของบอร์ด ประกอบด้วย ส่วน Header และส่วนFooter โดยที่ทั้งสองส่วนนี้จะมีหน้าตาเหมือนกันในทุกๆเพจ

ส่วนไฟล์ BoardIndex.template.php จะเป็นส่วน Content ของหน้าแรก




เปิดไฟล์  index.template.php  เราต้องทำการ include ไฟล์ bootstrap มาให้ครบ ทั้ง css และ js

ไปที่ฟังก์ชั่น template_html_above()  หาแท็ก </head>  ใส่ include ไฟล์ทั้งหมดก่อนแท็ก </head>

 <!-- Bootstrap core CSS -->
    <link href="',$settings['theme_url'],'/jumbotron/dist/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="',$settings['theme_url'],'/jumbotron/jumbotron.css" rel="stylesheet">

    <!-- Just for debugging purposes. Dont actually copy this line! -->
    <!--[if lt IE 9]> <script src="',$settings['theme_url'],'/jumbotron/docs/assets//js/ie8-responsive-file-warning.js"></script> <![endif]-->

    <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!--[if lt IE 9]>
   <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
     <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
   <![endif]-->

หลังจาก include ไฟล์ bootstrap มาแล้ว เราก็สามารถเรียกใช้งาน class ต่างๆของ bootstrap ได้ตามใจ ในทีนี้เราจะเอาโครงสร้างของธีม Jumbotron มาใช้  ดังนั้น เราก็เปิดไฟล์ธีมของ Bootstrap ที่ชื่อ Jumbotron/index.html ขึ้นมา

ก็อปปี้โครงสร้างทั้งหมดที่อยู่ภายใต้ แท็ก <body>... </body> นำมาวางในไฟล์ index.template.php ในฟังก์ชั่น template_body_above()
ตรงจุดนี้ ต้องใช้ความระมัดระวังนิดหนึ่งนะครับ โครงสร้างที่เราก็อปปี้มาและมาวางในไฟล์index.template.php นั้นต้องอยู่ภายใต้คำสั่ง echo ' ... '

ฟังก์ชั่น template_body_above() คือ ส่วนที่เป็น Content ในส่วนหัว หรือ Header เริ่มตั้งแต่ โลโก้ เมนู
ฟังก์ชั่น template_body_below() คือ ส่วนที่เป็น Content ในส่วนท้าย หรือ Footer

ช่องว่างระหว่าง template_body_above() และ template_body_below() จะเป็นส่วน Content ที่จะมาจากไฟล์  BoardIndex.template.php - หน้าแรก , ไฟล์ MessageIndex.template.php - หน้ารวมกระทู้ และไฟล์ Display.template.php - หน้ารายละเอียดกระทู้


หากไม่มีอะไรเกิดขึ้น เราก็จะได้หน้าแรกแบบใหม่ในสไตล์ Reponsive จะย่อหน้าเล็ก หรือหน้าใหญ่เนื้อหาก็ยืดหยุ่นไปตามไซส์ของบราวเซอร์ครับ
ถึงตอนนี้ ถ้าท่านทำตามแล้วผลยังไม่ออกมาตามตัวอย่าง ต้องไล่ดูโค๊ดอีกทีว่า ตกหล่น หรือพลาดตรงไหน..

(ตัวอย่างธีมที่ออกแบบใหม่)

ในตอนต่อไป เราจะมาพูดถึงรายละเอียดของหน้า รวมกระทู้ และหน้ารายละเอียดกระทู้

วันเสาร์ที่ 21 มิถุนายน พ.ศ. 2557

[SMF] How to SMF Responsive ตอนที่ 1 Bootstrap

อย่างที่ได้เกริ่นนำเมื่อบทความที่แล้วว่า ผมจะใช้  Bootstrap Framework  มาพัฒนา SMF  ให้เป็น Responsive ติดปีกให้บอร์ดธรรมดากลายเป็นบอร์ดที่สามารถพกพาไปได้บนมือถือ


ผมจะไม่ขอพูดถึง Bootstrap เพราะมีการเขียนไว้ค่อนข้างเยอะมากแล้ว แนะนำสำหรับท่านต้องการความรู้เกี่ยวกับ Bootstrap ให้คลิกเข้าไปอ่านที่นี่ได้เลย  http://www.siamhtml.com/bootstrap- คืออะไร-สอนวิธีใช้

หลังจากท่านดาวน์โหลด Bootstrap มาเรียบร้อยแล้ว ทีนี้มาเริ่มเข้าสู่กระบวนการติดปีกให้บอร์ดกันได้เลย

ขั้นตอนที่ 1 กรณีท่านยังไม่มีบอร์ด smf เลย ก็ให้ติดตั้ง หรือท่านที่มีบอร์ดเก่าอยู่แล้ว มีข้อมูลอยู่แล้ว ก็ไม่มีปัญหา การพัฒนาธีม จะไม่กระทบกับข้อมูลหลักแต่อย่างใดครับ

ขั้นตอนที่ 2  สร้างธีม smf ขึ้นมาใหม่เลย

ตามภาพ หลังจากคลิกสร้างธีม เราจะได้ธีมใหม่ ชื่อว่า Bootsrap คลิกย้อนกลับ และเลือกธีมที่พึ่งสร้างใหม่นั้นใช้งาน (อ่านวิธีการสร้างธีมใหม่โดยละเอียด คลิกที่นี่)

ในโฟลเดอร์ \Themes\  จะมีโฟลเดอร์สำหรับธีมใหม่ คือ Bootstrap

ขั้นตอนที่ 3 ไปเลือกเอาธีมของ Bootsrap มาใช้งาน ผมเลือกธีมชื่อ  Jumbotron มาใช้งาน


ธีมที่จินตนาการไว้คร่าวๆ  คือ
- แทบเมนูด้านบนเป็น  Nav Fixed  สีดำ
- มีฟอร์มสำหรับล็อกอิน
- หลังจากล็อกอินแล้วฟอร์มจะหายไป เป็นเมนูของบอร์ดแทน

ให้ก็อปปี้ Bootsrap  Framework มาไว้ในโฟลเดอร์ธีม  SMF\Themes\Bootsrap\ 

ถึงตอนนี้ เราได้เตรียมพร้อมข้อมูลในฝั่งของ SMF  และ Bootsrap ไว้เรียบร้อยแล้ว ในบทต่อไปจะได้เข้าสู่ขบวนการปรับเปลี่ยนโครงสร้าง  SMF  ให้เป็น Bootsrap .

สรุป
ถึงตอนนี้มีสิ่งที่ท่านต้องรู้ ดังนี้
1. Responsive  คืออะไร?
2. Bootsrap Framework  คืออะไร?
3. การติดตั้งธีม SMF  ใหม่  ทำอย่างไร?

ถ้าท่านเข้าใจทั้ง 3 ข้อนี้ดีแล้ว จึงค่อยปฏิบัติตามบทที่ 2 ต่อไป
หากว่ายังไม่เข้าใจ อ่านใหม่ อ่านซ้ำ หรือหาความรู้เพิ่่มเติมอีกหน่อยครับ 



วันศุกร์ที่ 20 มิถุนายน พ.ศ. 2557

SMF Responsive, ทำบอร์ด SMF ให้ตอบสนองในทุกสัมผัส

 ปัจจุบันคนนิยมเข้าถึงเว็บไซต์ด้วยมือถือ หรือแทบเล็ตมากขึ้น ดังนั้น ประดาเว็บไซต์ทั้งหลายจึงต้องปรับตัวตามผู้ใช้   จะให้เขาเปิดเข้าเว็บไซต์เราด้วยมือถือ แล้วหน้าเละเทะ ทับซ้อนจนปวดหัวไม่ได้

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


 Responsive Web Design  คือ การออกแบบเว็บไซต์ให้ตอบสนองกับทุกอุปกรณ์ ไม่ว่าจะเป็น พีซี , มือถือ หรือว่าแท็บเล็ต
 เรียกว่าเปิดด้วยอุปกรณ์ตัวไหน เว็บไซต์ก็ยังไฉไลสวยเด้งดั่งเดิม

ลองคลิกเข้า  http://www.thairath.co.th/  แล้วย่อบราวเซอร์ให้เล็กลง จะเห็นชัดเจนครับ

เว็บไซต์ทั้งหลายก็ปรับสภาพออกแบบเป็น Responsive กันเกือบหมด โดยเฉพาะเว็บไซต์สำเร็จรูปอย่าง Wordpress เป็นเจ้าแรกๆที่ออกธีมแนว Responsive มาให้ดาวน์โหลดใช้

หันมาดู SMF เว็บบอร์ดเจ้าเก่า เก่าแก่ที่เหมือนจะมีปัญหามากกับ Responsive เพราะตัวโปรแกรมหลักออกแบบด้วยตาราง ถึงแม้หลังๆจะพยายามปรับเป็น css แล้ว แต่ css ของ smf ก็ยังไม่ Responsive อยู่ดี!

แต่ถามว่าทำได้ไหม? 

คำตอบคือ ทำได้ครับ แต่ยังไม่มีใครทำ?

จริงๆมีผู้ออกแบบเฟรมเวิร์กที่เป็น Responsive หลายเจ้าแล้วครับ และที่ดังๆ ก็คือ Bootstrap 
ฺคลิกเข้าไปดูครับ มีทั้งธีมตัวอย่าง และวิธีใช้งาน

ทีนี้ ถ้าจะทำ SMF ให้เป็น Responsive ก็ไม่ยากแล้วครับ Bootstrap คือคำตอบ

SMF + Bootstrap =  SMF Responsive  ด้วยประการฉะนี้.


บทความหน้า เรามาดูวิธีทำและตัวอย่างธีม SMF Responsive กันครับ ว่าหน้าตาจะเป็นอย่างไร?


[SMF] ไฟล์สำหรับแก้ไขTheme smf เพื่อไม่ให้กระทบโค๊ดหลัก (Core)

ที่ตั้งไฟล์   
Themes/โฟลเดอร์เทมเพลทของท่าน เช่น Themes/mythem/ (ย้ำว่าไม่ใช่ Themes/default/ นะครับ)

1. index.template.php
 ไฟล์ที่เป็นโครงสร้างหลักของธีม ประกอบด้วย Header และ Footer
 Header และFooter ในไฟล์นี้จะเป็นเหมือนกันทุกๆหน้า จากไฟล์ตัวนี้

2. BoardIndex.template.php
  แสดงหมวดหมู่ของกระทู้ทั้งหมด ซึ่งจะแสดงในหน้าแรก

3.MessageIndex.template.php
 ไฟล์นี้ แสดงกระทู้รวมในหมวดหนึ่งๆ ที่เราคลิกจากหน้าแรกมีโครงสร้างเป็นตาราง Table

4. Display.template.php
แสดงรายละเอียดของกระทู้ พร้อมทั้งคำตอบ

5. Post.template.php
 ไฟล์นี้จัดการฟอร์มสำหรับโพสต์กระทู้

 เมื่อรู้ว่าไฟล์ไหนทำอะไรแล้ว เวลาจะทำการจัดการแก้ไข ก็ง่ายขึ้นครับ

วันพุธที่ 18 มิถุนายน พ.ศ. 2557

[SMF] การใส่ TextEditor สำหรับ smf เวอร์ชั่น 2++


จุดที่เป็นเอกลักษณ์ แต่บางคนอาจมองว่าเป็นจุดด้อยของ smf  อีกข้อหนึ่ง ก็คือ TextEditor 
ถ้าใครคิดภาพไม่ออกว่า TextEditor คืออะไร?
ผมจะสาธยายให้ฟัง..

TextEditor  ก็คือ ฟอร์มสำหรับตั้งหรือตอบกระทู้นั่นแหละครับ ที่อื่นเขามีฟอร์มโพสต์ง่ายๆ ใช้คำสั่ง html หรือใช้ตัวหนา ตัวหนา ใส่ลิงค์ก็ง่ายๆ เบสิกๆ แต่พี่ SMF เรานั่นไม่
แกใช้ bbccode  มีความเป็นเอกลัษณ์ของเอกบุรุษ แต่สร้างความยุ่งยากสำหรับคนที่ไม่่ชินอยู่ไม่น้อย

วันนี้เลยขอเสนอ TextEditor ที่จะช่วยให้การโพสต์ข้อความง่ายขึ้น เหมือนชาวบ้านมากขึ้น
มันคือ  CKEditor  http://ckeditor.com/demo

ตัวนี้ใช้ง่ายแสนง่ายครับ

ขั้นตอนที่ 1. ไปดาวน์โหลดมาก่อนเลยที่  http://ckeditor.com/download

ขั้นตอนที่ 2. เอา ckeditor  ที่ดาวน์โหลดมาแล้วไปไว้ที่โฟลเดอร์ธีมของเรา \Themes\YourTheme_naja

ขั้นตอนที่ 3. เปิดไฟล์ Post.template.php ใน \Themes\default เสร็จแล้ว Save as.. ไปไว้ที่โฟลเดอร์ธีมของเรา  \Themes\YourTheme_naja

ขั้นตอนที่ 4. เปิดไฟล์  Post.template.php ในโฟลเดอร์ธีมของเรานะครับ ไม่ใช่ธีม default เพื่อไม่ให้กระทบกับธีมหลัก แล้วหาคำว่า

// Finally, the submit buttons.
echo '
 
 เพิ่มโค๊ดนี้เข้าไปต่อท้าย คำที่ค้นหา

<script type="text/javascript" src="',$settings['theme_url'],'/ckeditor/ckeditor.js"></script>
    <script src="',$settings['theme_url'],'/ckeditor/samples/sample.js" type="text/javascript"></script>
    <link href="',$settings['theme_url'],'/ckeditor/samples/sample.css" rel="stylesheet" type="text/css" />

ขั้นตอนที่ 5. เปิดไฟล์ GenericControls.template.php ใน\Themes\default  ค้นหาคำว่า
<textarea class="editor"
ใส่คำนี้ไปแทน
<textarea class="ckeditor"

ขั้นตอนที่ 6 . เปิดไฟล์ Subs-Post ในโฟลเดอร์ Sources
หา $message = strtr(implode('', $parts), array('  ' => '  ', "\n" => '
',

แทนที่ด้วยคำสั่งนี้
$message = strtr(implode('', $parts), array('  ' => ' ', "\n" => '
', '&lt;' => '<', '<' => '<', '&gt;' => ">", '>' => '>', '"' => '"', '&nbsp;' => ' ', '&ldquo;' => '“', '&rdquo;' => '”',

เป็นอันเสร็จพิธีครับ

ปล. วิธีนี้ผมทดสอบใช้กับเวอร์ชั่น 2.0.7 หากจะใช้กับเวอร์ชั่นต่ำกว่านี้ ลองเข้าไปดูวิธีได้ที่   http://htmlthai.com/index.php?topic=597.0


ที่มา http://htmlthai.com/index.php?topic=597.0




วันพุธที่ 29 มกราคม พ.ศ. 2557

SMFเดินทางมาถึงเวอร์ชั่น 2.0.7 แล้ว

เผลอแป๊บเดียวก็เข้าปีใหม่ ปี 2014 มาตั้งเดือนหนึ่งแล้ว 
เช่นเดียวกันเผลอแป๊บเดียว SMF ก็ออกมาถึงเวอร์ชั่น 2.0.7 แล้ว นั่นแสดงให้เห็นว่า กลุ่มผู้ใช้ SMF มีไม่น้อย ผู้พัฒนาถึงได้พัฒนาเวอร์ชั่นออกมาเรื่อยๆ
 
 เท่าที่อ่านใน log ของ SMF 2.0.7 เวอร์ชั่นนี้ปรับปรุงจากเดิมไม่มาก ส่วนใหญ่เป็นรายละเอียดเล็กๆน้อยๆในระบบ ซึ่งจะไม่เกี่ยวข้องในส่วน Design ภายนอก เช่น
 เรื่องของการsupport ก็ PHP 5.5 มากขึ้น , เรื่องชื่อยาวเมื่อล็อกอินระบบจะตัดให้สั้นโดยอัตโนมัติ , แก้ไขปฏิทินวันหยุด
 
จะเห็นว่ารายละเีอียดที่เพิ่มเติมมาในเวอร์ชั่นใหม่ ก็ไม่มีอะไรมากนัก จะยังไม่อัพเกรดเวอร์ชั่นก็ไม่มีปัญหาอะไร

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


คิดไรไม่ออก :o

วันศุกร์ที่ 8 พฤศจิกายน พ.ศ. 2556

[SMF] ระบบไม่ส่งอีเมล์ให้สมาชิก เมื่อสมาชิกลงทะเบียนใหม่

ไม่ได้อัพเดทซะนาน สถานการณ์บ้านเมืองตอนนี้ คนไทยทุกหมู่เหล่า คณะอาจารย์  นักศึกษาทั้งศิษย์เก่า และศิษย์ปัจจุบัน หลายๆมหาวิทยาลัย หมอ พยาบาลทุกแห่งลุกฮือ ต่อต้าน พรบ. นิรโทษกรรมแบบสุดซอย

ดูเหมือนว่า คนมีอำนาจและคนมีกะตังค์ชอบคิดว่าคนอื่นจะโง่กว่าตัวเองอยู่เสมอ  อยู่ๆก็จะมายกความผิดตัวเองทิ้งแล้วจะกลับบ้านเหมือนไม่มีอะไรเกิดขึ้น .. มันง่ายขนาดนั้นเลยรึ?


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

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

ปัญหานี้แก้ไขได้โดยให้ทางผู้ให้บริการเซิฟเวอร์ หรือถ้าท่านเช่าโฮสท์แบบ vps ก็สามารถเข้าไปแก้ไขได้ที่ไฟล์ php.ini ใน cpanel

ค้นหาคำว่า ;extension=php_openssl.dll 
เจอแล้วให้เอา ; ด้านหน้าออก เสร็จแล้ว restart apache เป็นอันเสร็จพิธี

ต่อแต่นี้ ปัญหาสมาชิกจะไม่ได้รับอีเมล์จากท่านจะหมดไปอย่างแน่นอน

วันจันทร์ที่ 25 มีนาคม พ.ศ. 2556

[CSS] ปัญหา @font-face ไม่ทำงาน!!

ปัจจุบันหลายๆเว็บใช้วิธี import @font-face นำฟ้อนท์แปลกๆ สวยๆมาใช้ในเว็บ
และนั่นคือเรื่องที่่จะมาเขียนในวันนี้ครับ

ผมจะไม่พูดถึงการใช้งาน @font-face  แต่จะมาพูดวิธีแก้ไขปัญหาเมื่อ @font-face ไม่ทำงาน !!!

ปกติเวลาใช้งาน @font-face เราก็จะได้ฟ้อนท์สวยๆ งามๆมาใช้งาน แต่บางครั้งเกิดปัญหาคือ ฟ้อนท์สวยๆงามๆนั้นมันไม่ทำงาน ในie8+ หรือใน chrome ใช้งานได้ปกติ แต่ปรากฏว่าใน firefox เจ้าหมาไฟ มันไม่ทำงานซะอย่างนั้น

วันนี้มีวิธีแก้ครับ
เปิดไฟล์ .htaccess แล้วเพิ่มคำสั่งนี้ลงไป

 <FilesMatch "\.(ttf|otf|eot)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>

แค่นี้ @font-face ก็จะใช้งานได้อย่างดีเช่นเดิมแว้ว

วันจันทร์ที่ 29 ตุลาคม พ.ศ. 2555

[SMF] ข้อควรระวังก่อนการอัพเกรดเวอร์ชั่น


ข้อควรระวังก่อนการอัพเกรดเวอร์ชั่นจาก 1.10++ เป็นเวอร์ชั่น 2.0

วันก่อนนั่งอัพเกรอบอร์ดเวอร์ชั่น  1 เป็นเวอร์ชั่น 2.0.2 มั่นใจเต็มที่เพราะเคยอัพเกรดมาแล้วหลายต่อหลายครั้ง
ครั้งนี้เลยไม่คิดจะbackup ข้อมูลอะไรไว้ก่อนเลย

อัพเกรดครั้งแรก ..ไม่สำเร็จ
ครั้งที่สอง...เหมือนจะสำเร็จ
ครั้งที่สาม..ล้มเหลวเหมือนเดิม
ครั้งนี้ ผมเลยมานั่งหาสาเหตุ ... และก็พบสาเหตุ คือ มีmod บางตัวที่เข้าไปสร้างตารางไว้ในดาต้าเบสและเป็นตารางที่เวลาอัพเกรดแล้ว ไม่ยอมรับการเปลี่ยนแปลง พอระบบมาเจอตารางนี้เข้าก็หยุดทำงาน
ที่ถูกต้องเอา mod ทั้งหมดออกก่อน ก่อนทำการอัพเกรด แต่ครั้งนี้ผมถอดมอดไม่ทันแล้ว ต้องเดินหน้าต่อไป วิธีแก้คือ ลบตารางของมอดเจ้าปัญหาทั้งหมดออก!!

แล้วลองอัพเกรดใหม่..

ครั้งนี้..สำเร็จ แต่..ข้อมูลที่ดึงจากฐานข้อมูลเป็นตัวประหลาดหมดเลย!!

ทั้งๆที่เมนูต่างๆเป็นภาษาไทย แต่กระทู้ทั้งหมดกลายเป็นตัวประหลาด นั่งแก้ทั้งคืนก็ไม่หาย เลยต้องเข้านอนก่อนพรุ่งนี้ค่อยว่ากันใหม่

เช้าต่อมา นำดาต้าเบสข้างบนลงมาข้างล่างและลอง install ลงในเครื่องทุกอย่างปกติ ตัวหนังสือปกติ ..ผมค่อยใจชื้นขึ้นมาหน่อย
แต่ปัญหาที่ตามมาติดๆ  คือ ไม่สามารถเอาฐานข้อมูลจากเครื่องขึ้นไปข้างบนได้เลย!!

วิธีแก้ ดูจะง่อยไปหน่อย แต่เหมือนว่าจะเป็นวิธีสุดท้ายที่เหลืออยู่
ผมนั่ง dump ตารางของ smf ทุกตัว ซึ่งมี 63 ตารางลงมาข้างล่างก่อน แล้วค่อย import เข้าฐานข้อมูลผ่าน PHPMyAdmin ทีละตารางๆ

เรียบร้อยครับ บอร์ดผมมามีชีวิตและมีชาติไทยเหมือนเดิมแล้ว

ข้อควรระวังสำหรับเรื่องนี้ คือ ก่อนอัพเกรด ต้อง
1. เลือกธีมให้เป็นธีมdefault 
2. เลือกภาษาอังกฤษ
3. ถอด mod ทั้งหมดออกก่อน

วันพฤหัสบดีที่ 11 ตุลาคม พ.ศ. 2555

"เว็บดีไซน์" ควรคำนึงอะไรบ้าง??


ไม่ได้เขียนเองครับ ไปเจอบทความของฝรั่งมา เขาเขียนไว้เกี่ยวกับนักออกแบบเว็บว่าควรคำนึงอะไรบ้างในยุคปัจจุบัน ก่อนลงมือทำเว็บ
ม่ะ มาดูกัน


1. Responsive Design
ยุคนี้คงไม่พูดถึงไม่ได้แล้วว่าคนเข้าเว็บของเราจากช่องทางไหนบ้าง มันเข้ามาจากทุกช่องทาง นี่ถ้าตู้เย็นต่ออินเทอร์เนตได้ ก็คงจะมีคนเข้าเว็บเราจากตู้เย็น วิทยุ หรือหม้อหุงข้าว!!
Responsive คือ การออกแบบเว็บไซต์ให้แสดงผลได้ดีในทุกแฟลตฟอร์ม ไม่ว่าจะเป็นสมาร์ทโฟน ไอโฟน หรือเซ็กโฟน (อันหลังนี่ไม่ใช่นะครับ ไม่รู้จะตลกไปไหน)  ต้องให้เว็บดูดีทั้งใน PC , Notebook  และโทรศัพท์มือถือ

2. HTML5 & CSS3
เริ่มไม่ใหม่เท่าไรแล้วสำหรับ HTML5 & CSS3 เมื่อก่อนเรายังกล้าๆกลัว ๆ กั๊กๆ ไม่อยากใช้ เพราะมีบราวเซอร์รุ่นพ่อของพ่อของพ่อของพ่อของพ่อ ฯลฯ อย่างไออี6อยู่  แต่ปัจจุบันบราวเซอร์ที่ตอบสนองทุกท่วงท่าและลีลาอยาง Chrome , Firefox หรือ IE8 มีคนเริ่มใช้กันเยอะขึ้นมาก และทางเจ้าของเว็บไซต์ก็ไม่ค่อยแคร์ด้วยว่ายูเซอร์จะใช้ ie6 หรือไม่? ประมาณว่า ถ้ามึงจะเข้าเว็บกู อย่ามาด้วยie6  จะเข้าคฤหาสน์แต่ดันปั่นจักรยานมาใครจะให้เข้า!!

3. Minimalistic Design
ไปเจอคำจำกัดความของคำนี้ คือ "เรียบง่ายแต่ได้ประโยชน์มาก" ว่ากันว่าคนที่เข้ามาในเว็บเรานั้น เขาต้องการอ่านข้อมูลแบบสบายๆ ไม่ถูกบีบด้วยพื้นที่อันคับแคบ หรือดีไซน์ที่จัดจ้านจนอ่านลำบาก ดังนั้น การออกแบบที่เรียบง่า่ย แต่แฝงด้วยกึ๋นส์ จึงเป็นคำตอบสำหรับเว็บในปัจจุบัน

4. Content First Approach
เว็บในปัจจุับันเริ่มแข่งขันกันที่ content หรือเนื้อหาเป็นหลัก ดังนั้น เมื่อยูเซอร์คลิกเข้าเว็บมาแล้ว ต้องเสนอเนื้อหาให้อยู่ในระดับสายตาที่เห็นก่อน โดยไม่ต้องลากสโคลบาร์ลงล่าง หรือปิดโฆษณาก่อนถึงจะเห็นเนื้อหา มันจะทำให้หงุดหงิดใจเปล่าๆ


5. Rich Typography
การเลือกใช้ฟ้อนท์ ขนาด และสีที่อ่านง่ายเหมาะสมกับเว็บ ประเภทพื้นสีแดง ตัวหนังสือสีเหลือง ไม่ไหวนะครับ ตาจะบอด


6. Social Media Friendly
ทุกวันนี้คนเป็นประเภทพวกขี้อวด ขี้แบ่ง เจออะไรดีๆ (หรือไม่ดี) ไม่กดlike ก็ตกกด share ดังนั้น หาปุ่ม like หรือปุ่ม share ให้เขาหน่อย เผื่อเขาแบ่งไปยังเพื่อนๆของเขาแล้ว เพื่อนๆพวกนั้นจะช่วยแบ่งต่อไปอย่างไม่รู้จักสิ้น

ต้องขออภัยคนที่ต้องการเนื้อหาสาระแน่นๆนะครับ ผมเอาแค่หัวข้อของฝรั่งมา ส่วนรายละเอียดสรุปเอามาเีขียนใหม่ เพราะถ้าขืนแปลตามฝรั่งเขา คงออกทะเลจมน้ำตายไปแล้วครับ

อย่างไรก็ดี 6 ข้อนี้ ก็ควรระลึกถึงเสมอเมื่อจะออกแบบเว็บนะครับ

คลิกเข้าไปดูต้นฉบับเขาได้ที่ http://www.cssreflex.com/2012/08/consider-these-web-design-trends-in-your-next-project.html/

วันพุธที่ 10 ตุลาคม พ.ศ. 2555

ปัญหา fgetcsv กับ ภาษาไทย

เขียนโปรแกรมให้เขาupload ไฟล์ .csv แล้วบันทึกลง MySQL  ทดสอบในเครื่องก็ได้ทุกอย่าง แต่พอเอาขึ้นเซิฟเวอร์ ปรากฏว่าฟิลด์ที่เป็นภาษาไทย ใช้ไม่ได้เลย  งัดมาสารพัดวิธี ทั้ง iconv ทั้งแปลงไฟล์ให้เป็น utf-8 ก็ยังไม่ได้ สุดท้ายได้คำตอบจากคุณ เล็กน้ำ http://www.leknarm.com/2010/03/fgetcsv-php.html  ซึ่งมีใจความว่า..

เนื่องจากได้เขียน php โดยอ่านไฟล์จากไฟล์ csv ซึ่งมีข้อความภาษาไทยอยู่ โดยเมื่อทดสอบบนเครื่องตัวเองนั้นไม่มีปัญหาใดๆ ทั้งสิ้นแต่เมื่อ deploy ขึ้นไปบน server ดันเกิดปัญหาขึ้นโดย ภาษาไทยนั้นไม่แสดงผล

จากที่ลอง research ดูก็ไล่ไปเรื่อยๆ ตั้งแต่ check ว่าเปิดไฟล์ได้ไหม echo ภาษาไทยได้ไหม และก็มาเจอประเด็นที่ fgetcsv

จากที่อ่านใน http://php.net/manual/en/function.fgetcsv.php ซึ่งมีเขียนไว้ว่า

Note: Locale setting is taken into account by this function. If LANG is e.g. en_US.UTF-8, files in one-byte encoding are read wrong by this function.

แสดงว่าเราต้องทำการ set locale ให้กับ apache การแสดงผลจึงจะถูกต้องโดยใช้คำสั่ง


setlocale ( LC_ALL, 'en_US.UTF-8' );

แค่นี้ก้จะทำให้การ get csv ที่มีภาษาไทยภายในไฟล์แสดงผลได้ถูกต้องแล้วครับ

..

แต่มันก็ยังไม่หาย 100% คือเป็นภาษาไทยครับ แต่ทุกฟิลด์ที่เป็นภาษาไทย คำแรกจะหายไป เลยลองแก้จาก
setlocale ( LC_ALL, 'en_US.UTF-8' ); เป็น setlocale ( LC_ALL, 'Thai' );

ปรากฏว่าใช้ได้ครับ ..

ในวันที่ "แกมี" มา

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

คำถามไหนที่เห็นว่าเป็นประโยชน์กับคนอื่นๆด้วย ผมจะเขียนเป็นบทความแทน

วันนี้มาสั้นๆ ลากันด้วยภาพขำๆ ภาพนี้ละกันครับ

ป.ล. กลัวเนื้อหาจะไม่เข้ากับชื่อ ขอพูดถึง "แกมี" สักหน่อย เพราะตอนนี้กำลังหวั่นเกรงว่าเจ้าแกมีจะเข้าประเทศ หลังจาก "แกมี" ผ่านมาแว่บๆ มีผลทำให้ฝนตกเกือบทุกวัน แต่ตอนนี้ "แกมี" เริ่มจากไปแล้วละ ทุกอย่างกำลังจะกลับสู่ภาวะปกติ โชคดีนะ "แกมี" แต่วันหลังไม่ต้องมา

กูเหนื่อยรถติด ~

วันเสาร์ที่ 29 กันยายน พ.ศ. 2555

[SMF]การปรับpermission หรือการอนุญาตในบอร์ด



โจทย์ คือ ต้องการให้สมาชิกบางกลุ่ม อ่านได้อย่างเดียวในบางบอร์ด

1. ล็อกอินเข้าระบบแอดมิน
2. ไปที่ ผู้ดูแล > ควบคุมสมาชิก > Permissions > Edit Profiles
3. ดูด้านล่างที่แทบ New Profile มี 2 ช่องในการสร้าง Profile ใหม่
    -  Profile Name:  ตั้งชื่อโปรไฟล์ใหม่
    - Copy Permissions From: เลือกโปรไฟล์ต้นแบบ
4. คลิกCreate

5. หลังจากสร้างแล้วเราจะได้ Profile ตัวใหม่ที่เกิดจากน้ำมือที่เราสร้างขึ้นมา คลิกไปที่โปรไฟล์ใหม่นั้นเลย
6. ระบบจะนำไปยังหน้าจัดการ 'การอนุญาต' ทีนี้เราจะกำหนดให้กลุ่มไหนทำอะไรได้ ก็กำหนดตรงนี้เลยให้เสร็จ  (อย่าลืมกำหนดให้อ่านได้อย่างเดียวด้วยตามโจทย์ที่ตั้งไว้)

7. จากนั้นไปที่เมนู Permission By Board
8. เราอยากให้บอร์ดไหนอ่านได้อย่างเดียว คลิกที่ชื่อบอร์ดนั้นเลย
9. หลังจากคลิกแล้ว ดูด้านล่าง เมนู Permission Profile:
 เลือกโปรไฟล์ที่เราได้สร้างไว้ในข้อที่ 3  แล้วคลิกปุ่ม แก้ไข
10. เสร็จพิธี

วันพฤหัสบดีที่ 30 สิงหาคม พ.ศ. 2555

[SMF] เพิ่ม thumbnail ในหน้ากระทู้รวม


วันนี้มานำเสนอไอเดีย การปรับแต่งบอร์ดให้มีความน่าสนใจมากขึ้น ด้วยการเพิ่ม thumbnail และหัวข้อกระทู้ในหน้ากระทู้รวม ตามภาพ


(ดูตัวอย่างจริงที่ http://phithan-toyota.com/forums/index.php/board,18.0.html)

ดูภาพประกอบคำอธิบายนะครับ
ผมดึงภาพเป็น thumbnail จากกระทู้โดยการสุ่ม ดึงมาแค่ 4 กระทู้และดึงสุ่มมาทุกครั้งที่แสดงพร้อมกับหัวข้อกระทู้ เพื่อเพิ่มความน่าสนใจกับบอร์ดมากขึ้น

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

เป็นทิปสั้นๆนะครับ ลองเข้าไปปรับดูที่ไฟล์  MessageIndex.template.php ส่วนรายละเอียดว่าปรับยังไง ตรงจุดไหนบ้าง เดี๋ยวค่อยว่ากันต่อในบทความถัดไป

อันนี้แค่เกริ่นนำพอเป็นไอเดียก่อน

วันพุธที่ 29 สิงหาคม พ.ศ. 2555

SMF เวอร์ชั่นไหนดี??

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

แต่สำหรับคนที่มีบอร์ดอยู่ก่อนแล้ว ต้องไปดูครับว่าบอร์ดของท่านเวอร์ชั่นไหน
ถ้าเป็นเวอร์ชั่น 1 ก็อัพเวอร์ชั่นให้ใหม่ที่สุดของเวอร์ชั่น 1  ก็คือ  1.1.16  
แต่ถ้าเป็นเวอร์ชั่น 2 ก็อัพเวอร์ชั่นให้ใหม่ที่สุดของเวอร์ชั่น 2 นั่นก็คือ 2.0.1 

แบบนี้ก็ได้เหมือนกัน
แต่บางท่านอยากอัพเวอร์ชั่นจาก 1 ไป 2 เลยแบบนี้ก็ได้ แต่ก็มีความเสี่ยงอย่างที่ผมเคยเขียนไว้แล้วในวิธีอัพเกรดเวอร์ชั่น (อ่านที่นี่ http://nevikup.blogspot.com/2011/08/smf-upgrade-smf-20.html)

คำถามต่อมาก็คือ เวอร์ชั่น 1 กับ 2 มันต่างกันยังไง และมีข้อดีข้อเสียอย่างไร?

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

ส่วนเรื่องของโครงสร้าง เวอร์ชั่น 1 เน้นตารางเป็นหลัก แต่พอมาเป็นเวอร์ชั่น 2 ตารางเหลือน้อยจนแทบจะไม่มีแล้วครับ ใช้ div เป็นหลัก ซึ่งนั่นเป็นข้อดี เพราะจะทำให้เราออกแบบและปรับปรุงในเรื่องของหน้าตา ดีไซน์ได้ง่ายขึ้น

ข้อดีอีกอย่างของเวอร์ชั่น 2 คือ บอร์ดจะเร็วกว่าเวอร์ชั่น 1 ค่อนข้างเห็นได้ชัด
จริงๆมีมากกว่านี้ครับ แต่พอที่เราเห็นได้ด้วยตาเปล่าก็ประมาณนี้

่ส่วนข้อเสีย สแปมมีมั้ย? ก็มีพอๆกับเวอร์ชั่น 1 ครับ  แต่ก็มีตัวจัดการให้อยู่หมัดได้ ถ้าเป็นเวอร์ชั่น 1 ต้องลง mod ไว้ดักสแปม

สรุป  จัดเวอร์ชั่น 2 ไปเลยครับท่านมันส์กว่ากันเยอะ


วันพฤหัสบดีที่ 23 สิงหาคม พ.ศ. 2555

[SMF] Quick Post เติมเครื่องมือให้ตอบด่วน



เพิ่มเครื่องมือเครื่องไม้ให้เต็มสูบในช่อง Quick Post ประโยชน์คือทำให้ผู้ตอบกระทู้ไม่ต้องคลิก ตอบ เพื่อเปิดไปหน้าใหม่
แต่ให้สามารถโพสต์ในหน้านั้นได้เลย (ดูภาพ)


สะดวกต่อผู้ใช้ครับ อะไรที่ทำให้ผู้ใช้สะดวกและง่าย ถือเป็นสิ่งควรปฏิบัติครับ คลิกไปดูวิธีทำได้ที่ลิงค์ด้านล่างนี้นะ
http://nevikup.blogspot.com/2012/07/smf-quick-post-full-post.html

วันพุธที่ 1 สิงหาคม พ.ศ. 2555

[SMF] ตัวอย่างธีม SMFแสดงกระทู้เป็นลิสต์แบ่งเป็นห้อง

วันนี้หากินง่าย ๆ
เอาตัวอย่างเว็บบอร์ดของ smf มาให้ชมครับ
เป็นบอร์ดของเว็บที่เป็นdealer ของโตโยต้า

บอร์ดตัวนี้ใช้ Tab jQuery มาดึงกระทู้ล่าสุดของทุกห้องมาแสดง ห้องละ 5 กระทู้ แบ่งcontent เป็น 2 คอลัมน์ เนื้อหาหลักยังฝั่งซ้ายและมีเมนูย่อยอยู่ฝั่งขวา
ดูภาพตัวอย่างและดูของจริงกันเลยดีกว่าครับ

ดูตัวอย่างจริงที่ www.phithan-toyota.com/forums/