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

เพิ่มตัวเลือกสีตัวอักษร สวยๆ ให้ 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

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

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง สมัครสมาชิก หรือ ลงชื่อเข้าระบบ
(http://upic.me/show/58443640)

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง สมัครสมาชิก หรือ ลงชื่อเข้าระบบ
(http://upic.me/show/58443642)

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง สมัครสมาชิก หรือ ลงชื่อเข้าระบบ
(http://upic.me/show/58443643)

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง สมัครสมาชิก หรือ ลงชื่อเข้าระบบ
(http://upic.me/show/58443645)

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง สมัครสมาชิก หรือ ลงชื่อเข้าระบบ
(http://upic.me/show/58443646)

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

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

ตรงนี้มีภาพ! แต่ท่านจะมองไม่เห็น , ท่านต้อง สมัครสมาชิก หรือ ลงชื่อเข้าระบบ
(http://upic.me/show/58447296)