เพิ่มตัวเลือกสีตัวอักษร สวยๆ ให้ SMF

[Auto Man]

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


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

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ


วิธีทำครับ

เปิดไฟล์ Themes/default/scripts/editor.php

หา

โค๊ด: [Select]

for (var sSelectValue in oCurButton.oOptions)
                        // we've been through this before
                        if (sSelectValue != '')
                            sOptions += '<option value="' + sSelectValue.php_htmlspecialchars() + '">' + oCurButton.oOptions[sSelectValue].php_htmlspecialchars() + '</option>';
แก้เป็น

โค๊ด: [Select]

for (var sSelectValue in oCurButton.oOptions)
                    {
                        // we've been through this before
                        if (sSelectValue != '')
                        {
                                var optionStyle = '';
                               
                                if (oCurButton.sName == 'sel_color')
                                    optionStyle = 'style="color: ' + sSelectValue.php_htmlspecialchars() + ';"';
                                else if (oCurButton.sName == 'sel_size')
                                    optionStyle = 'style="font-size: ' + oCurButton.oOptions[sSelectValue].php_htmlspecialchars() + ';"';
                                else if (oCurButton.sName == 'sel_face')
                                    optionStyle = 'style="font-family: ' + sSelectValue.php_htmlspecialchars() + ';"';   
                               
                                sOptions += '<option style="color:' + sSelectValue.php_htmlspecialchars() + ';background:' + sSelectValue.php_htmlspecialchars() + '" value="' + sSelectValue.php_htmlspecialchars() + '" ' + optionStyle + '>' + sSelectValue.php_htmlspecialchars() + '</option>';
                        }
                   }
ปิดไฟล์ Themes/default/GenericControls.template.php

หา

โค๊ด: [Select]

\'\': ', JavaScriptEscape($txt['change_color']), ',
                                    \'black\': ', JavaScriptEscape($txt['black']), ',
                                    \'red\': ', JavaScriptEscape($txt['red']), ',
                                    \'yellow\': ', JavaScriptEscape($txt['yellow']), ',
                                    \'pink\': ', JavaScriptEscape($txt['pink']), ',
                                    \'green\': ', JavaScriptEscape($txt['green']), ',
                                    \'orange\': ', JavaScriptEscape($txt['orange']), ',
                                    \'purple\': ', JavaScriptEscape($txt['purple']), ',
                                    \'blue\': ', JavaScriptEscape($txt['blue']), ',
                                    \'beige\': ', JavaScriptEscape($txt['beige']), ',
                                    \'brown\': ', JavaScriptEscape($txt['brown']), ',
                                    \'teal\': ', JavaScriptEscape($txt['teal']), ',
                                    \'navy\': ', JavaScriptEscape($txt['navy']), ',
                                    \'maroon\': ', JavaScriptEscape($txt['maroon']), ',
                                    \'limegreen\': ', JavaScriptEscape($txt['lime_green']), ',
                                    \'white\': ', JavaScriptEscape($txt['white']), '
แก้เป็น

โค๊ด: [Select]

\'\': ', JavaScriptEscape($txt['change_color']), ',
                                    \'#000000\': ', JavaScriptEscape(), ',
                                    \'#333333\': ', JavaScriptEscape(), ',
                                    \'#666666\': ', JavaScriptEscape(), ',
                                    \'#999999\': ', JavaScriptEscape(), ',
                                    \'#DDDDDD\': ', JavaScriptEscape(), ',
                                    \'#990000\': ', JavaScriptEscape(), ',
                                    \'#CC0000\': ', JavaScriptEscape(), ',
                                    \'#FF0000\': ', JavaScriptEscape(), ',
                                    \'#FF6666\': ', JavaScriptEscape(), ',
                                    \'#FF9999\': ', JavaScriptEscape(), ',
                                    \'#FF3300\': ', JavaScriptEscape(), ',
                                    \'#FF6600\': ', JavaScriptEscape(), ',
                                    \'#FF9900\': ', JavaScriptEscape(), ',
                                    \'#FFCC00\': ', JavaScriptEscape(), ',
                                    \'#FFFF33\': ', JavaScriptEscape(), ',
                                    \'#003300\': ', JavaScriptEscape(), ',
                                    \'#006600\': ', JavaScriptEscape(), ',
                                    \'#009900\': ', JavaScriptEscape(), ',
                                    \'#00CC00\': ', JavaScriptEscape(), ',
                                    \'#00FF33\': ', JavaScriptEscape(), ',
                                    \'#000066\': ', JavaScriptEscape(), ',
                                    \'#0000CC\': ', JavaScriptEscape(), ',
                                    \'#0033FF\': ', JavaScriptEscape(), ',
                                    \'#00CCFF\': ', JavaScriptEscape(), ',
                                    \'#00FFFF\': ', JavaScriptEscape(), ',
                                    \'#FFFFFF\': ', JavaScriptEscape(), '
ขอให้สนุกกับสีสันนะครับ

ขอขอบคุณ ที่มา http://post-nook.com/topic/8094
และมาจากกระทู้นี้ http://www.banpongpond-src.com/smf/index.php?topic=846.0#msg1141

[Auto Man]

สำเร็จไปแล้ว มันเยี่ยมมากเลย กับ smf 2.0.11
ลองดูบรรทัดการปรับแต่งโค๊ด

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ


ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ


ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ


ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ


ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ


   มีไฟล์ที่ยังไม่ได้แก้ไข ลองเอาไปลองค้นหาและแทนดูเล่นๆ ว่าท่านจะค้นและแทนได้มั๊ย
ไฟล์ editor.php ใน smf 2.0.11 จะเป็นคนละนามสกุลคือเป็น editor.js นะครับ

[Auto Man]

  หลังติดตั้งเสร็จ เจอปัญหาตรงการเลือกขนาดฟ้อนต์ จากเดิมบอกเป็น 8pt 10 pt 12pt....
กลายมาเป็นหมายเลข 1,2,3........... แทน แบบนี้แย่กว่าเดิมแฮะ ...ผลพวงจาการการ
ปรับค่าสี

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง  สมัครสมาชิก หรือ ลงชื่อเข้าระบบ