สร้างเว็บบอร์ดให้มีชีวิตชีวามากขึ้นด้วยไอค่อนหรือรูปภาพหน้าบอร์ด
สิ่งเล็กๆน้อยๆ บางครั้งก็ทำให้เว็บบอร์ดเรามีชีวิตชีวาและเข้าใจได้ง่ายขึ้นเยอะ เช่น ไอค่อนหรือรูปภาพหน้าห้องแต่ละห้อง ถ้าเราเปลี่ยนให้แต่ละห้องมีภาพไม่ซ้ำกัน และใช้ภาพที่เกี่ยวข้องกับเนื้อหาในเว็บบอร์ดของเราด้วยแล้ว ก็จะทำให้เว็บบอร์ดน่าสนใจและชัดเจนใจตัวตนยิ่งขึ้น
แต่เดิมหน้าห้องแต่ละห้องจะเป็นภาพนี้ครับ
กรณีไม่มีกระทู้ใหม่
แต่หากมีกระทู้ใหม่จะเป็นภาพนี้
ทีนี้ผมจะเปลี่ยนไอค่อนพวกนี้ละ ใช่จะเปลี่ยนแค่ภาพสองภาพเท่านั้น แต่จะให้แต่ละห้องมีภาพไม่ซ้ำกันด้วย!!
อันดับแรกไปเปิดโฟลเดอร์ Themes/default /BoardIndex.template.php
ก็อปปี้ไฟล์ BoardIndex.template.php มาไว้ในโฟลเดอร์ธีมของเรา (ถ้าอ่านมาแต่แรกจะรู้ว่าธีมตัวใหม่นี้ผมตั้งชื่อว่า Blue_theme ดังนั้น ผมจะก็อปปี้ไฟล์นี้มาไว้ในโฟล์เดอร์ Blue_theme นะ)
อย่างที่เคยบอกไปในบทแรกๆแล้วว่า การจะแก้ไขไฟล์อะไรก็แล้วแต่ที่อยู่ในโฟลเดอร์ธีม Detault เราควรจะก็อปปี้ไฟล์นั้นมาไว้ในโฟลเดอร์ธีมใหม่ของเราครับ เพื่อที่ว่าเวลาอัพเดทเวอร์ชั่นหรือการหาไฟล์ที่แก้ไขแล้วจะได้หาง่ายๆ
อะ มาเข้าเรื่องของเราต่อ
หลังจากก็อปปี้ไฟล์ดังกล่าวมาไว้ในโฟล์เดอร์ธีมของเราแล้ว ทีนี้เปิดไฟล์ขึ้นมาครับ
ให้ไปบรรทัดที่ 121 หรือค้นหาด้วยคำว่า // If the board is new, show a strong indicator.
ให้ไปดูคำสั่งนี้ครับ
echo '<img src="', $settings['images_url'], '/on.gif" alt="', $txt[333], '" title="', $txt[333], '" />';
เห็นคำนี้มั้ยครับ on.gif มันคือภาพนี้
และลองมองไล่ลงต่ำมาอีก 2-3 บรรทัดก็จะเจอคำสั่งนี้
echo '<img src="', $settings['images_url'], '/off.gif" alt="', $txt[334], '" title="', $txt[334], '" />';
คำสั่งนี้ off.gif ก็คือภาพนี้
ทั้งสองภาพนี้อยู่่ในโฟลเดอร์images ในธีมของเรานี่เอง เมื่อเรารู้ที่ตั้งของมันแล้ว ก็เราไปเปลี่ยนภาพได้ หาภาพอะไรก็ได้มา 2 ภาพ และเปลี่ยนชื่อภาพให้เป็น on.gif และ off.gif (ลบอันเก่าหรือวางทับได้เลย)
ทีนี้เราก็จะได้ภาพไอค่อนหน้าห้องบอร์ดไม่เหมือนเดิมแล้ว ...วี้ด วิว
แต่เดี๋ยวก่อน..
ในบทนี้เราไม่ได้ต้องการแค่นั้น เพราะนั่นมันง่ายไป ..ความต้องการของเราคือ...
ต้องให้ภาพแต่ละห้องไม่ซ้ำกันด้วยยยยยยยย ย ย ..
ไม่ยากครับ
ไปที่คำสั่งสองบรรทัดข้างบนอีกครั้ง
echo '<img src="', $settings['images_url'], '/on.gif" alt="', $txt[333], '" title="', $txt[333], '" />';
echo '<img src="', $settings['images_url'], '/off.gif" alt="', $txt[334], '" title="', $txt[334], '" />';
เปลี่ยนสองบรรทัดนี้ใหม่เป็น ..
echo '<img src="', $settings['images_url'], '/brd_',$board['id'],'_on.gif" alt="', $txt[333], '" title="', $txt[333], '" />';
echo '<img src="', $settings['images_url'], '/brd_',$board['id'],'_off.gif" alt="', $txt[334], '" title="', $txt[334], '" />';
มาดูคำอธิบายเพิ่มเติมอีกนิดครับ
เห็นคำสั่งนี้มั้ยครับ /brd_',$board['id'],'_on.gif
จากคำสั่งนี้จะได้ชื่อภาพเป็น brd_(idของบอร์ด)_on.gif
idของบอร์ดคืออะไร ?
ห้องแต่ละห้องที่ท่านสร้างขึ้นมาจะมีไอดีหรือรหัสประจำห้องไล่ตั้งแต่ 1 2 และ 3 4 เรื่อยๆ แล้วแต่ว่าท่านสร้างไว้กี่ห้อง
ดังนั้น คำสั่งนี้ /brd_',$board['id'],'_on.gif ก็จะเท่ากับชื่อภาพ brd_1_on.gif สำหรับบอร์ดห้องแรก และชื่อ brd_2_on.gif สำหรับบอร์ดห้องที่สอง ห้องที่สาม ห้องที่สี่ ก็จะมีชื่อคล้ายกัน เปลี่ยนแต่ตัวเลขไปตามลำดับ
อีกภาพสำหรับบอร์ดที่ยังไม่มีกระทู้ ก็เหมือนกัน จะได้ชื่อภาพว่า brd_1_off.gif ไล่ไปเรื่อยๆ ตามจำนวนบอร์ด
ชื่อภาพ brd_1_on.gif และ brd_1_off.gif ผมตั้งขึ้นมาเอง ส่วนถ้าท่านต้องการชื่อแปลกพิสดารหรืออะไรแบบไหน อยากให้ภาพเป็นนามสกุลอะไร ก็สุดแท้แต่ท่านนะครับ ใช้อะไรยังไงก็ได้ แต่ต้องอย่าลืมไอดีหรือรหัสของบอร์ด เพื่อให้เกิดความแตกต่างระหว่างภาพแต่ละภาพของห้องแต่ละห้อง
แค่นี้ก็เสร็จแล้วครับ ..ลองดูตัวอย่าง
หรือดูตัวอย่างจริง คลิกที่นี่
ไม่มีความคิดเห็น:
แสดงความคิดเห็น