[smf] แจกธีมsmf Blue Theme 2.0

หลังจากเคยแจกไปแล้วสำหรับ Theme smf Blue Theme เวอร์ชั่น 1 (สำหรับ smf เวอร์ชั่น 1.1.1x) คลิกดูที่นี่

วันนี้ขอเอาใจคนใช้ smf เวอร์ชั่น 2.0 ย้ำนะครับว่าเป็นเวอร์ชั่น 2.0 finalเท่านั้น ประเภทเวอร์ชั่น 2 rc1 หรือ rc 3 rc 5 ใช้ไม่ได้นะครับ

หน้าตาอาจไม่ต่างจาก Blue Theme เวอร์ชั่น 1 มากนัก มาดูหน้าตาก่อนดีครับ



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

ดาวน์โหลดคลิกที่นี่

สำหรับ Blue Theme ตัวนี้ผมได้ปรับแต่งจากธีม Default ของ smf ดังนั้นหน้าตาจึงดูไม่แตกต่างจากธีมดีฟอลต์สักเท่าไร แต่ถ้าใครต้องการหนีจากความซ้ำซากของธีมดีฟอลต์ ธีมนี้คือคำตอบ

สิ่งที่เพิ่มเติมให้ใน Blue Theme นี้คือ แบนเนอร์ และเมนูหลักเพื่อลิงค์ไปยังหน้าแรกของเว็บไซต์

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

แล้วพบกันใหม่ในตอนนั้น

[smf] ศัลยกรรมหน้าบอร์ดให้เป็นหน้าเว็บ

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

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

หลายๆเว็บก็ทำกันแบบนั้น ประมาณว่าเข้ามาในเว็บปุ๊บก็เจอบอร์ดปั๊บเลย แบบนั้นมันธรรมดาไป

ในฐานะคนแต่งบอร์ดต้องรู้จักจัดวางตำแหน่งใหม่ ให้คนเข้ามาในเว็บแล้ว ไม่รู้สึกว่าเข้ามาในบอร์ด หน้าเว็บนะ ไม่ใช่หน้าบอร์ด
หน้าบอร์ดเป็นยังไง? แล้วหน้าเว็บต้องเป็นยังไง?

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

เมื่อแยกความแตกต่างได้แล้ว ทีนี้ก็ไม่ยากเลย เราต้องทำหน้าบอร์ดให้กลายเป็นหน้าเว็บ!!!





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

เดี๋ยวตอนต่อไปจะพาไปดูว่า วิธีศัลยกรรมหน้าตาบอร์ดให้เป็นหน้าเว็บนั้นทำอย่างไร?

[smf] ขอแนะนำ Anti-Spam Verification มอดดักสแปม

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

ดังนั้น วันนี้จึงต้องพาพระเอกมาให้รู้จักกันซะหน่อย เขามีชื่อว่า

Anti-Spam Verification

คลิกเข้าไปดูไปดาวน์โหลดที่นี่ http://custom.simplemachines.org/mods/index.php?mod=1516

ท่านไหนที่ยังไม่เคยติดตั้ง mod วันนี้เป็นโอกาสดีแล้วครับ ผมจะชวนท่านติดตั้ง แล้วท่านจะอุทานว่า บ๊ะๆ ๆ ๆ ..มันง่ายแค่นี้เองนิ !

หลังจากดาวน์โหลดมอดมาแล้ว ก็ไม่ต้องแตกซิบนะครับ ทิ้งไว้งั้นแหละ หลังจากนั้นล็อกอินเข้าสู่ระบบแอดมิน เลือกเมนู -> ศูนย์จัดการแพ็คเกจ > Download Packages

พอคลิกมาถึงหน้านี้แล้ว ลงไปด้านล่างสุดครับ จะเจอเมนู "อัพโหลดแพ็คเกจ" ให้ท่านทำการ Browse แล้วเลือกหามอดที่เป็นไฟล์ซิบที่เราดาวน์โหลดมาไว้เมื่อตะกี้นี้

หลังจากเลือกแล้วคลิกอัพโหลดเลยครับ ระบบจะทำการดึงข้อมูลมาแสดง ให้เราคลิกปุ่ม บันทึก mod

ระบบจะแสดงรายละเอียดอีกครั้ง ตามภาพ

ให้คลิกปุ่ม ติดตั้งเดี๋ยวนี้(น๊าาาาาาา )

เป็นอันเสร็จพิธีการติดตั้งmodครับ

ทีนี้ไปดูการใช้งาน

ไปที่เมนูด้านซ้ายมือ ศูนย์จัดการลงทะเบียน > การตั้งค่า

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

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

[smf] เปลี่ยนชื่อโฟลเดอร์บอร์ดเถิด..จะเกิดปัญหา

ในโลกนี้ไม่มีอะไรที่ได้ดั่งใจทุกอย่างหรอกครับ
เกือบ 90 % ผู้แทนที่เราไปกาเลือก ไม่ได้เป็นสส. หรอก !!

นอกเรื่องละ วกเข้ามาเรื่องเราดีกว่า
เรื่องโฟลเดอร์ชื่อของบอร์ดก็เช่นกัน เดี๋ยวใช้ชื่อ board/ เดี๋ยวใช้ชื่อ forum/ เดี๋ยวก็อยากใช้ forums/ ฯลฯ
จะบอกว่าเปลี่ยนชื่อโฟลเดอร์นั้นมันไม่ยากเลย แต่พอเปลี่ยนแล้วปุ๊บ ..เกิดปัญหาทันที

บางคนรู้มาก(เช่นผม 555) รีบไปเปิดดาต้าเบสตาราง _theme เพื่อแก้พาธของธีม พาธภาพ ฯลฯ และเปิดตาราง _settings แก้พาธอีกที่หนึ่งเหมือนกัน แก้จนหมดทุกที่ทุกตารางที่เก็บพาธของธีม แต่ปรากฏว่าบอร์ดก็ไม่มา มันหายสาปสูญ หน้าบอร์อเป็นสีขาวเนียนนวล ไม่แจ้งเอ่อเร่อห่าเหวอะไรมาให้อุ่นใจเลยแม้แต่บรรทัดเดียว !!!

เหี้ยแล้วสิ (ขอโทษที่เผลออุทานหยาบ)

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

เราไม่ต้องไปเปลี่ยนข้อมูลในดาต้าเบสครับ เปลี่ยนแค่ข้อมูลในไฟล์พอ มี 2 ไฟล์ คือ
Settings_bak.php และ Settings.php

$boardurl ="http://xxxx.com/forums";
$boarddir="http://xxxx.com/forums";
$sourcedir ="/home/xxxx.com/forums/Sources";
$cachedir ="/home/xxxx.com/forums/cache";

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

เมื่อแก้เสร็จแล้ว ให้ไปดาวน์โหลดไฟล์ repair_settings.php ที่หน้านี้ http://download.simplemachines.org/?tools

อัพไปไว้ในโฟลเดอร์ของบอร์ด(ที่เปลี่ยนชื่อใหม่แล้วนั้น) เสร็จแล้วรันมันขึ้นมาครับ

ตรวจสอบดูในฟอร์มที่รันขึ้นมานั้น ว่าถูกต้องไหม? ถ้าถูกต้องแล้วก็คลิก Save Settings

เสร็จแล้ว ไปดูบอร์ดของเรา ณ โฟลเดอร์ใหม่นั้นสิ มารึยัง?

จะพบว่ามันมาบ้างแล้ว แต่ยังเอ่อๆ มาขาดๆเกินๆ ไม่ครบบาท ไม่ต้องตกใจครับ เพราะยังไม่เสร็จพิธี

ให้เขาคลิกไปที่เมนู admin (ถึงแม้หน้าตามันจะเ่อ่อๆ แต่ก็พอเดาได้ว่าลิงค์ไหนอยู่ตรงไหน ใช่มั้ยครับ)
คลิกไปที่เมนู admin > Themes and Layout > Themes Setthings
พอถึงหน้านี้ ให้ลงไปดูที่ด้านล่างสุดเลย จะเจอปุ่มนี้ Attempt to reset all themes ปุ่มนี้คือการพยายามคืนค่าของธีมทั้งหมดครับ คลิกเลยอย่ารอช้า

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

เท่านี้ก็เสร็จสมบูรณ์แล้วครับบ ..

[smf] เพิ่มเมนูเปลี่ยนภาพส่วนตัวให้หาง่ายๆ

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

ทีนี้มาผันตัวเองมาในฐานะผู้ทำบอร์ดให้คนอื่นใช้บ้าง เราจะปล่อยให้ผู้ใช้ประสบชะตากรรมเช่นนั้นอีกต่อไปไม่ได้ครับ เราต้องช่วยฉุดเขาจากความมืดบอด ชี้ทางสว่างให้

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



ว่าแต่วิธีทำละ?

ความต้องการของเราคือเพิ่มเมนู "เปลี่ยนภาพส่วนตัว" ใต้ข้อความส่วนตัวที่มีอยู่แล้ว
อันดับแรกต้องหาตำแหน่งให้เจอก่อนว่ามันอยู่ตรงไหน
ค้นหาคำนี้ก็ได้ครับ // Show the total time logged in?

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

echo '<a href="', $scripturl, '?action=profile;u=', $context['user']['id'],';sa=forumProfile;" title="เปลี่ยนภาพส่วนตัว">เปลี่ยนภาพส่วนตัว</a>';

เพียงเท่านี้ เราก็จะมีเมนูด่วนทันใจให้ผู้ใช้สามารถใช้ได้ง่ายๆแล้วนะครับคุณขาาาาาาาา

หมายเหตุ : link นี้ใช้ได้เฉพาะเวอร์ชั่น 1 เท่านั้นนะครับ

[smf] ว่าด้วยการ include ไฟล์มาในหน้าบอร์ด

หากคุณมีไฟล์ .php ตัวหนึ่งและอยากแสดงข้อมูลในไฟล์ .php ออกมาในหน้าแรกของบอร์ด หรือในหน้าไหนก็แล้วแต่ในบอร์ดของท่าน ท่านจะใช้วิธีดึงมาอย่างไร

หลายคนคงคิดถึงฟังก์ชั่นนี้ include(); require(); หรือ require_once();

ผมมีความเสียใจที่จะบอกว่า มันใช้ไม่ได้ครับ !!

วันนี้เลยอยากจะนำเสนอวิธีการเรียกไฟล์จากภายนอกเข้ามาในบอร์ด หลายคนอาจสงสัยว่า จะเรียกไฟล์เข้ามาในบอร์ดทำไม

คืองี้ครับ พอดีผมมีไฟล์ .php ตัวหนึ่งไว้แสดงแบนเนอร์ และลิงค์

<a href="xxx"><img src="xxxx"/></a>
<a href="xxx"><img src="xxxx"/></a>
<a href="xxx"><img src="xxxx"/></a>

อยากเก็บไว้ไฟล์หนึ่งต่างหาก ก็เลยจำเป็นจะต้องเรียกไฟล์จากภายนอกมาฉะนี้แหละ

เกริ่นมาเยอะละ มาดูสิว่าวิธีที่ว่านั้นทำอย่างไร??

เขียนเป็นฟังก์ชั่นเลยครับ

function banner() {

global $settings, $context, $txt, $scripturl;

$path = $settings['theme_url'].'/banner.php' ;

$ads_file = fopen( $path , 'r');

$banner = stream_get_contents( $ads_file );

echo $banner;

}

จากตัวอย่างนี้ ผมมีไฟล์ banner.php ก็แค่เขียนคำสั่งดึงไฟล์ออกมา ทีนี้อยากให้ไฟล์นี้ไปโผล่ที่ไหนก็แค่เอาฟังก์ชั่นนี้ไปแหมะตรงนั้น

banner();

ทุกสิ่งทุกอย่างที่อยู่ในไฟล์ banner.php ก็จะพรั่งพรูออกมาหมด ด้วยประการฉะนี้แล

[smf] แต่งธีม ตอน เพิ่มปุ่มใส่ภาพแต่เก็บไฟล์ไว้ที่ upic.me

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

นั่นคือ การโพสต์ภาพ

ประสิทธิภาพของบอร์ด smf เกี่ยวกับการโพสต์ภาพนั้นอย่างที่เราเห็นๆ มีสองอย่างคือ เอาภาพมากจากเว็บอื่นโดยใช้ใช้ bbc โค๊ดมาคร่อม [img]http://xxxx[img]

อีกวิธีหนึ่งคือการแนบไฟล์ อย่างที่ผมเคยได้เขียนไว้แล้ว http://nevikup.blogspot.com/2011/07/smf_26.html

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

วันนี้เลยมีอีกหนึ่งวิธีเกี่ยวกับการโพสต์ภาพ ในบอร์ด แต่ไม่ต้องเก็บไว้ในโฮสท์ของเรา หลายคนรู้จักเว็บสำหรับฝากไฟล์ซึ่งมีมากมายไม่ว่าจะเป็น flickr.com ,picasa.google.com, uploadtoday.com ฯลฯ

แต่ที่ผมจะแนะนำในบทความนี้คือเว็บฝากไฟล์ที่ชื่อว่า upic.me

upic.me เขามีดีอะไร?

ผมก็ไม่แน่ใจว่าเขามีดีอะไรที่ต่างจากเว็บฝากไฟล์อื่นๆนะครับ แต่ที่แน่ๆคือเราสามารถสร้างปุ่มสำหรับเลือกไฟล์จากเครื่องเรา แต่เก็บไฟล์ไว้ที่ upic.me และดึงมาแสดงในบอร์ดได้ !!!

เจ๋งมั้ยละครับ

และที่เจ๋งไปกว่านั้นครับ มันยังสามารถเลือกอัพไฟล์พร้อมกันหลายๆไฟล์ได้ บร๊ะเจ้า!!

พูดไป ไม่เห็นภาพ เดี๋ยวมาดูการปรับแต่งกันดีกว่าว่าทำไง?

ขบวนการนี้มีไฟล์ที่เกี่ยวข้องแค่ตัวเดียวครับ คือไฟล์ Themes/default/Post.template.php เปิดมันขึ้นมาครับ และก่อนอื่นใด Save as.. ไปไว้ที่โฟล์เดอร์ของธีมของเราก่อน (ถ้าในธีมของเรามีแล้ว ก็เปิดมันขึ้นมาโดยไม่ต้องไปเปิดจากโฟล์เดอร์ default/นะครับ)

ไปที่บรรทัดที่ 647 ถ้าในบรรทัดดังกล่าวเจอคำสั่ง <td colspan="2"></td> แสดงว่ามาถูกทางแล้ว แต่หากไม่ใช่คำสั่งนี้ ลองมองหาในบรรทัดถัดไปขึ้นบนหรือลงล่างดูในแถวนี้แหละครับ หาแท็กนี้ให้เจอ เสร็จแล้วแปะโค๊ดนี้ลงไปตรงกลางระหว่าง <td colspan="2"> และ </td>

โค๊ดที่ว่านี้คือ โค๊ดนี้ครับ

<script type="text/javascript" src="http://upic.me/js/embedupload.js"></script>

<script type="text/javascript">

upic_target = document.postmodify.message;

upic_type = "bbfull";

upic_buttoncss += "color:#000000;";

</script>

<style type="text/css">

#upic_uploader{}

#upic_uploadprogress{}

.progressWrapper{margin-top:5px;}

.progressContainer{border-bottom:1px dotted #ddd;padding:2px;}

.progressName{text-align:left;color:black;margin-left:2px;float:left;}

.progressBarStatus{color:#666;text-align:right;margin:1px 1px 0 0;font-size:9px;}

.red{border:solid 1px #B50000;background-color:#FFEBEB;}

.green{border:solid 1px #DDF0DD;background-color:#EBFFEB;}

.blue{border:solid 1px #CEE2F2;background-color:#F0F5FF;}

.progressBarInProgress,.progressBarComplete,.progressBarError{clear:both;font-size:0;width:0%;height:2px;background-color:blue;margin-top:4px;}

.progressBarComplete{width:100%;background-color:green;visibility:hidden;}

.progressBarError{width:100%;background-color:red;visibility:hidden;}

</style>

ไฟล์ css นี้เราสามารถตกแต่งให้งดงามกว่านี้ได้ครับ อยู่ที่ท่านแล้วละ

มีจุดหนึ่งที่อยากให้ดูครับ ตรงที่เป็นสีน้ำเงิน ตรงนี้เราสามารถกำหนดให้ภาพที่โพสต์มานั้นเป็นแบบไหน มีให้เลือก htmlfull / htmlthumb / bbfull / bbthumb

htmlfull คือ ภาพที่โพสต์ลงในบอร์ดจะเป็นคำสั่ง html แบบนี้ <img src="ภาพ"/> ขนาดภาพเท่าขนาดจริง

htmlthumb จะคล้ายกับ htmlfull แต่ขนาดภาพที่โพสต์ลงจะเป็นภาพเล็ก สองวิธีนี้ใช้ไม่ได้ในบอร์ด smf เพราะบอร์ด smf ใช้คำสั่งbbc

bbfull และ bbthumb เหมาะกับบอร์ดsmf แนะนำให้เลือกใช้ 2 ตัวนี้ bbfull ภาพที่โพสต์ลงจะมีขนาดเท่าภาพจริง ส่วน bbthumb จะเป็นภาพเล็ก

เมื่อแก้ไขเสร็จแล้วก็เซฟ ทีนี้ลองไปตั้งกระทู้ดูครับ ใต้คำว่าตั้งกระทู้ใหม่ จะมีคำว่า Select images ลองเลือกดู

เจอกันใหม่ตอนหน้าคร้าบ

[smf] แต่งธีม ตอน เปลี่ยนและเพิ่มสัญลักษณ์แสดงอารมณ์ smf emotion

ต่อจากตอนที่แล้ว มาว่าด้วยเรื่องเล็กๆน้อยๆที่ควรปรับเพื่อให้บอร์ดดูดี

วันนี้เรามาว่าด้วยเรื่องการเปลี่ยนและเพิ่มสัญลักษณ์แสดงอารมณ์หรือ emotion ในบอร์ดกันเลยดีกว่าครับ

เบื้องต้นล็อกอินเข้าสู่ระบบแอดมิน ไปที่เมนู การวางรูปแบบฟอรั่ม -> ชุดสัญลักษณ์แสดงอารมณ์

เสร็จแล้วติ๊กเลือก 'ใช้สัญลักษณ์แสดงอารมณ์ส่วนตัวเหล่านี้ : ' แล้วคลิกปุ่ม บันทึกการเปลี่ยนแปลง

จะเห็นว่าตรงเมนูแท็บมีเมนูเพิ่มมา จากก่อนหน้านี้มีแค่เมนู 'ชุดสัญลักษณ์แสดงอารมณ์' และ การตั้งค่า แต่ตอนนี้เพิ่มขึ้นมามีเมนู

ชุดสัญลักษณ์แสดงอารมณ์ เพิ่มสัญลักษณ์แสดงอารมณ์ แก้ไขสัญลักษณ์แสดงอารมณ์ จัดเรียงสัญลักษณ์แสดงอารมณ์ การตั้งค่า

ให้คลิกเมนูเพิ่มสัญลักษณ์แสดงอารมณ์ พอมาถึงหน้านี้แล้วคิดว่าคงเข้าใจกันไม่ยากแล้ว

เลือกอัพโหลดไฟล์ หาไฟล์ที่เป็นสัญลักษณ์แสดงอารมณ์ที่ต้องการจะเพิ่มใหม่ ในช่องโค๊ด: ใส่รหัสคำสั่งสำหรับemotionของเรา เช่น :(): หรือ -ea: พยายามอย่าใช้ภาษาไทย หรือใช้ภาษาอังกฤษที่เป็นคำ เช่นคำว่า hello, hi หรือ yo เพราะถ้ามีการโพสต์กระทู้ที่ใช้คำที่ซ้ำกับโค๊ดของเรา แทนที่จะกลายเป็นคำพูด emotion จะโผล่มาแทน

ส่วนชองคำอธิบาย Tooltip ใส่ภาษาไทยคำอธิบายสั้นๆของemotion นั้น เช่นคำว่า ยิ้มแย้ม, โกรธ, ร้องไห้ ฯลฯ

เสร็จแล้วอย่าลืมบันทึกการเปลี่ยนแปลง แล้วไปดูผล..ว่ามีไอค่อนโผล่มารึยัง??

ตอนนั้นมาว่าก่อนต่อฮะ

[smf] แต่งธีม ตอน วิธีทำsmf ให้โพสต์วีดีโอจากyoutubeได้

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

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

เรามาดูกันเลยว่าต้องทำอย่างไร?

การแก้ไขมี 2 ไฟล์ที่เกี่ยวข้องครับ
1. Sources/Subs.php
เปิดไฟล์ขึ้นมาแล้วค้นหาคำนี้
array(
'tag' => 'hr',
'type' => 'closed',
'content' => '<hr />',
'block_level' => true,
),

เจอแล้วตบเอ็นเทอร์ลงบรรทัดหนึ่ง เพิ่มโค๊ดนี้ลงไป
array(
'tag' => 'youtube',
'type' => 'unparsed_commas_content',
'test' => '\d+,\d+\]',
'content' => '<object width="$2" height="$3"><param name="movie" value="http://www.youtube.com/v/$1" ></param><embed src="http://www.youtube.com/v/$1" type="application/x-shockwave-flash" width="$2" height="$3"></embed></object>',
'validate' => create_function('&$tag, &$data, $disabled', '
if (isset($disabled[\'url\']))
$tag[\'content\'] = \'$1\';'),
'disabled_content' => '<a href="$1" target="_blank">$1</a>',
),

เซฟไฟล์แล้วปิดทิ้งไปเลยครับ
2. ไฟล์ Themes/default/Post.template.php เปิดเสร็จแล้วก่อนอื่นใดเลย เลือก Save as.. เซฟเก็บไว้ในโฟลเดอร์ธีมของเรา

เสร็จแล้วค้นหาคำนี้
'flash' => array('code' => 'flash', 'before' => '[flash=200,200]', 'after' => '[/flash]', 'description' => $txt[433]),

หลังจากเจอแล้ว ตบลง 1 บรรทัด และวางโค๊ดนี้ลงไป
'youtube' => array('code' => 'youtube', 'before' => '[youtube=425,350]', 'after' => '[/youtube]', 'description' => $txt['youtube']),

เสร็จแล้วเซฟปิดทิ้งไปเลยครับ

ยังไม่เสร็จเพียงเท่านี้ เพื่อง่ายต่อการเรียกใช้งานของผู้ใช้ เราจำเป็นต้องหาไอค่อน youtube มาใส่ด้วย
เช่น (ควรจะหาไอค่อนที่เล็กกว่านี้เพื่อความสวยงาม)

เมื่อได้ไอค่อนที่ถูกใจแล้วไปเก็บไว้ในโฟลเดอร์ images/bbc
เพียงเท่านี้ก็เสร็จแล้วละครับ

ทีนี้มาดูการใช้งาน..
เมื่อลองคลิก เริ่มต้นกระทู้ใหม่ ..จะพบไอค่อนของ youtube พอคลิกปุ๊บจะเกิดโค๊ดตัวนี้มา[youtube=425,350][/youtube] ให้เราไปที่เว็บยูทูป หาวีดีโอที่ต้องการโพสต์ ด้านใต้วีดีโอจะมีคำว่า Share คลิกปุ๊บจะเกิดโค๊ด เช่น http://youtu.be/88M_UCWyWvM ให้เราก็อปปี้เฉพาะตัวหนังสือที่เป็นสีแดง เอามาใส่ในบอร์ด ก็จะได้แบบนี้

[youtube=425,350]88M_UCWyWvM[/youtube]

เพียงเท่านี้ก็เรียบร้อยแล้วละครับบบ

หมายเหตุ : วิธีนี้ใช้ได้กับเวอร์ชั่น 1 เท่านั้น !!

[smf] แต่งธีม ตอน ปรับปรุงหน้าตาตั้งชื่อธีมว่า "Blue Theme"

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

ธีมที่ผมแต่งเป็นตัวอย่างนี้เป็นเวอร์ชั่น 1.1.14 นะครับ แต่ใครที่่กำลังแต่งธีมเวอร์ชั่น 2 ไม่ว่าจะ RC-1 หรือ RC-3 ก็ไม่ต้องห่วงครับ ถึงแม้มันไม่เหมือนกันเปะๆทุกอย่าง แต่มันก็ไม่ได้ต่างกันมากนัก

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

เริ่มตั้งแต่ธีมเิดิมๆ หน้าตาแบบนี้

http://nevikup.blogspot.com/2011/07/smf_18.html

ได้หน้าใหม่มาแบบนี้

http://nevikup.blogspot.com/2011/07/smf_2473.html

และระหว่างนั้นก็มีการปรับแต่งเล็กๆน้อยๆภายในบอร์ด

ครั้งสุดท้ายคือปรับหน้าตาใหม่ให้ดูเข้ากับชื่อธีม Blue Theme ก็ได้หน้าตาใหม่มาแบบนี้

สามารถคลิกไปดูตัวจริงได้ที่นี่ครับ

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

หลังจากแต่งธีมเสร็จเรียบร้อยแล้ว เดี๋ยวจะได้ปล่อยให้ดาวน์โหลดกันไปใช้ หรือไปปรับปรุงต่อครับ

วันนี้มาอัพเดทเท่านี้ก่อน

[smf] แต่งธีม ตอน เปลี่ยนปุ่ม "ตั้งกระทู้ใหม่" เป็น "ตอบกระทู้"

ด้วยความที่ smfบอร์ดไม่ใช่สัญชาติไทยแท้ โอนสัญชาติมาอีกทีหนึ่ง ดังนั้นเมนูภาษาไทยที่ถูกโอนมาจึงมีความผิดพลาดอยู่บ้าง

วันนี้จะมาดูการแก้ไขความผิดพลาดเล็กๆน้อยๆที่บางทีก็ทำให้วุ่นวายใจได้

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

ทีนี้มาดูการแก้ปัญหาครับ

ไฟล์ที่เกี่ยวข้องมี 2 ตัว

1../Themes/languages/index.thai-utf8.php

2../Sources/Post.php

เบื้องต้นเกิดไฟล์ index.thai-utf8.php มาก่อน แล้วเพิ่มคำสั่งนี้ไป

$txt['post'] = ‘ตั้งกระทู้’;
$txt['post_post'] = ‘ตอบกระทู้’;

เพิ่มตรงไหน?

ลงไปยังบรรทัดล่างสุดเลยก็ได้ครับ แต่ต้องอยู่ภายใน ?> นะ

อันดับต่อไปเปิดไฟล์ Post.php

ค้นหาคำสั่ง $context['submit_label'] = $txt[105];

เมื่อเจอแล้วอย่ารอช้า ลบทิ้งหรือคอมเมนต์ไว้ก็ได้ (//)

จากนั้นใส่คำสั่งนี้ไปแทนครับ

if(!(isset($_GET['topic']))) {

$context['submit_label'] = $txt['post'];
}else {
$context['submit_label'] = $txt['post_post'];
}

คำสั่งของมันก็แค่เช็คว่า เป็นการตั้งกระทู้ใหม่มั้ย? (ถ้าตั้งกระทู้ใหม่ต้องมี ($_GET['topic']) ถ้าตั้งกระทู้ใหม่ก็ให้แสดงปุ่ม “ตั้งกระทู้ใหม่” ถ้าไม่ใช่ก็ให้แสดงปุ่ม “ตอบกระทู้” แทน

เป็นทริกเล็กๆน้อยๆ แต่เวลาจะใช้งานจริงๆก็หากันแทบแย่

อ้อ..ทิปนี้ใช้ได้ทั้งเวอร์ชั่น 1 และเวอร์ชั่น 2 นะคร้าบ

[smf] แต่งธีม ตอน เอาไอค่อนหน้าบอร์ดตัวเก่าออก!

ใน smf เวอร์ชั่น 2 ไม่เจอไอค่อนตัวนี้นะครับ แต่ถ้าใครยังพัฒนาเวอร์ชั่น 1 อยู่ ก็จะเจอไอค่อนตัวที่ว่านี้


(ไอค่อน กระทู้ใหม่ , ไม่มีกระทู้)

ถามว่า มีไอค่อน แล้วมีปัญหาอะไร?

ก็ไม่ได้มีปัญหาอะไรหรอกครับ เพียงแต่ว่าจะเก็บไว้หาห่าอะไรในเมื่อมันไม่ได้สื่ออะไรเลย

ก็เราได้เปลี่ยนไอค่อนหน้าบอร์ดเป็นภาพใหม่หมดแล้ว ไอ้เจ้าไอค่อนนี้ก็เลยหมดประโยชน์ด้วยประการฉะนี้แล

เอาออกก็มิยากเลยครับ เปิดไฟล์ BoardIndex.template.php ที่อยู่ในธีมของเรานะครับ (อย่าไปยุ่งกะธีมคนอื่นโดยเฉพาะธีม Default )

ค้นหาด้วยคำว่า new_some.gif

เจอแล้วก็ลบทิ้งทั้งเครือญาติเลยครับ

<img src="' . $settings['images_url'] . '/new_some.gif" alt="" align="middle" /> ', $txt[333], '

<img src="' . $settings['images_url'] . '/new_none.gif" alt="" align="middle" style="margin-left: 4ex;" /> ', $txt[334], '

หลังจากลบทิ้งแล้ว ตรงพื้นที่ว่างๆนี้จะหาอะไรมาใส่ก็สุดแท้แต่ท่านจะคิดได้นะครับ

[smf] แต่งธีม ตอน แต่งภาพแนบให้เป็นภาพใหญ่(โดยไม่ต้องคลิก)

(ไม่ต้องอารัมภบทนะครับ ตอนนี้ต่อจากตอนที่แล้วถ้าไม่เข้าก็กลับไปอ่านตอนก่อนนี้ละกัน)

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

เปิดไฟล์ Themes/default/Display.template.php
แล้ว save as.. เซฟไปไว้ที่โฟลเดอร์ของธีมเรา (เหตุผลเคยบอกไปแล้วในบทแรกๆ)

เปิดไฟล์ Display.template.php ขึ้นมาครับ

ค้นหาด้วยคำว่า // Assuming there are attachments...

เพื่อไม่ให้เกิดการผิดพลาด หรือตกหล่น เพราะแก้ไขผิดจุด ผมจะแก้ไขกันทั้งกลุ่มเลยนะครับ

จากตำแหน่งที่ค้นหาเมื่อตะกี้ // Assuming there are attachments... ไล่ลงมาจนถึงคำว่า // Show "« Last Edit: Time by Person »" if this post was edited.

// Assuming there are attachments...
..............
.....
......
// Show "« Last Edit: Time by Person »" if this post was edited.

ลบทิ้งให้หมดครับ แล้วใส่อันนี้แทน

// Assuming there are attachments...
if (!empty($message['attachment']))
{
echo '

<hr width="100%" size="1" class="hrcolor" />
<div style="overflow: auto; width: 100%;">';
foreach ($message['attachment'] as $attachment)
{
if ($attachment['is_image'])
{
if ($attachment['thumbnail']['has_thumb'])


echo '<img src="', $attachment['href'], ';image" id="link_', $attachment['id'], '" border="0" /><br/>';

else

echo '<img src="', $attachment['href'], ';image" id="link_', $attachment['id'], '" border="0" /><br/>';

}


echo '
<a href="' . $attachment['href'] . '"><img src="' . $settings['images_url'] . '/icons/clip.gif" align="middle" alt="*" border="0" />&nbsp;' . $attachment['name'] . '</a> (', $attachment['size'], ($attachment['is_image'] ? ', ' . $attachment['real_width'] . 'x' . $attachment['real_height'] . ' - ' . $txt['attach_viewed'] : ' - ' . $txt['attach_downloaded']) . ' ' . $attachment['downloads'] . ' ' . $txt['attach_times'] . '.)<br />';
}


echo '
</div>';
}
echo '
</td>
</tr><tr>
<td valign="bottom" class="smalltext" id="modified_', $message['id'], '">';
// Show "« Last Edit: Time by Person »" if this post was edited.


แค่นี้แหละครับ เสร็จแล้ว ลองคลิกไปดูของจริง ที่นี่ view demo

[smf] แต่งธีม ตอน ดึงภาพจากกระทู้มาแสดงthumbnail

การดึงภาพมาแสดงในหน้ากระทู้รวม ต้องใช้ Mod มาช่วยครับ
ถ้ายังคิดไม่ออกว่า การดึงภาพมาแสดงเป็นอย่างไร ลองดูภาพด้านล่างนี้ก่อน

ถ้าในกระทู้นั้นๆมีการโพสต์ภาพที่ไม่ใช่การแทรกภาพโดยคำสั่ง [img][/img] ต้องเป็นการแนบไฟล์ภาพเท่านั้น ระบบก็จะดึงภาพแรกมาแสดงเป็น thumbnail ในหน้ารวม (ดังภาพ)

วิธีทำ ทำได้โดยใช้ mod ตัวนี้ครับ http://custom.simplemachines.org/mods/index.php?mod=1151

คลิกเข้าไปและทำตามวิธีที่เขาแนะไว้ครับ ไม่ยากเท่าไร

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