การปรับแต่ง Theme ตามใจเรา #1

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


เริ่มต้นด้วยการ เข้าใจโครงสร้างของ ธีม

โดยปรกติแล้วเนี่ย ธีม แต่ละอันที่เราใช้ มันจะมีโครงสร้างที่แตกต่างกันไปพอประมาณ ผมขอยกตัวอย่างมาส่วนนึง ซึ่งเป็น ธีมอันเดิมๆของ php Fusion นั่นคือ ธีม milestone ครับ ผมจะเอาโค้ดมาส่วนนึง จากไฟล์ theme.php ซึ่งเป็นไฟล์ที่สำคัญที่สุดในแต่ละ ธีม นั่นคือ

โค้ดที่เป็นองค์ประกอบของ panel php-fusionซึ่งจะเห็นได้ว่ามันเป็นฟังก์ชั่นอันนึงใน ภาษา PHP ครับ แล้วส่วนนี้คือฟังก์ชั่นการเปิดหัวตารางครับ ซึ่งมันคือตรงนี้

function เปิดตาราง head panel php-fusionโดยการทำงานของธีมนั้น มันจะมีการเรียกใช้เป็นฟังชั่นเป็นส่วนๆไปครับ ซึ่งผมจะชี้ให้เห็นดังนี้

องค์ประกอบของตาราง panelจะเห็นได้ว่า ใน1กรอบตารางที่เรามองเห็นเนี่ย จะมีการเรียกสองฟังก์ชั่นนั่นคือ

1. function openside($title) จะเป็นส่วนที่เปิดของตารางและส่วนขอบซ้ายมือของตารางครับ

2.function closeside() จะเป็นส่วนขอบขวามือของตารางและส่วนปิดตารางตามลำดับ

ซึ่งเรื่องตาราง จะขออธิบายโดยละเอียดดังนี้ครับ

ตำแหน่งของตารางอันนี้คือรูปตาราง โดยที่ผมกำหนดให้ C=Column(ช่องในแนวตั้ง) R=Row (ช่องในแนวนอน) แล้วด้านล่างคือโค้ดที่ใช้ในการแสดงผล

โค้ดตาราง html tableอธิบาย ได้คือ เป็นคำสั่ง สร้างตาราง โดยเรากำหนดให้มันกว้าง 120 ครับ แล้วก็ต่อมาคือ กำหนดให้เส้นหนา 0(คือไม่มีเส้น) แล้วต่อมาคือช่องว่างระหว่างตัวหนังสือกับเส้นคือ0 แล้วสุดท้ายคือสั่งให้ตารางแต่ละช่องห่างกัน0ครับ ต่อมาคือเนื้อในตารางครับ <tr> ให้เข้าใจคือ Row (แถว) ครับ <td> คือ Column คอลัมน์ ซึ่งถ้าเราเอาไปเทียบระหว่างโค้ดกับตารางเราจะได้ดังนี้ครับ

row ที่ 1 >>>จะได้>>>โค้ดของ row ที่ 1

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

รูปแบบของตาราง php-fusionคือจะมีการเรียงจากบนลงล่างตามแถว แล้วค่อยเรียงจากซ้ายไปขวาครับเช่นว่าเรามีโค้ด

โค้ดที่ตัดออก 1 column>>จะได้>>>จะ เห็นได้ว่า มันไม่สนใจเลย ว่าโค้ดเราจะอยู่บรรทัดใหน หรือกำหนดข้อความว่าให้มันอยู่ในตำแหน่งใด แต่มันจะทำการแสดงผลตามที่โค้ดมันมีอยู่เท่านั้นครับ

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

โค้ดตารางแบบ html

ให้ได้เป็นอย่างดีครับ ว่าการสร้างตารางมันมี TAG อะไรบ้าง ซึ่งส่วนวันนี้เราจะกล่าวแต่ของ HTML นะครับ พรุ่งนี้มาว่ากันต่อ


เขียน: 2006-11-19 07:00:00 แก้ไข : 2006-11-19 07:00:00 อ่าน : 4560
tag :