สร้างรูปแบบใหม่ด้วย Module Class Suffix
joomla นั้นองค์ประกอบบนหน้าเว็บไซค์ต่างๆจะประกอบไปด้วย module ต่างๆมาประกอบกันเป็นเว็บไซค์ โดย module ต่างๆบนน้าเว็บไซค์ของเราถ้าเราสร้างออกมาไม่ว่าจาก module ที่เราโหลดมาติดตั้งหรือสร้างมาเอง รูปแบบโดยพื้นฐานจะมาจาก template ที่เราเรื่องไว้ เช่น ผมเลือก template ชื่อ rhuk_milkyway ถ้าเรานำ module มาติดตั้งและใช้งานรูปแบบก็จะออกมาเป็นดังรูปด้านล่างเสมอๆ
ทำให้หน้าเว็บเราก็จะมีแต่แบบนี้ดูแล้วน่าเบื่อชะมัดยาก ฉะนั้นเราจะมาทำให้ module ที่เราต้องการมีสีหรือรูปแบบตามที่เราต้องการได้
โดยเราต้องเข้าใจก่อนว่า module ต่างๆถูกกำหนดด้วย Div และชื่อ class ก็คือ div.moduletable ซึ่งทุกครั้งที่ถูกสร้างขึ้นมาก็จะเป็นชื่อนี้หมด ทีนี้เราจะมาสร้างรูปแบบเฉพาะให้กับ Module กันนะครับ โดยให้เราสังเกตุว่าใน Parameter ของ Module นั้นแทบทุก Module จะต้องมีอยู่หัวข้อหนึ่งเสมอ นั้นก็คือ Module Class Suffix
โดย module class suffix จะเป็นการกำหนดรูปแบบ css ที่เราสร้างเองแยกมาอีกชุด เพื่อให้นำมาแสดงรูปแบบเฉพาะของ Module นั้นเองครับ โดยในช่องว่างจะเป็นการใส่ชื่อ css ใหม่ลงไป ซึ่งชื่อนี้จะนำมาต่อท้าย div.moduletable เช่น
div.moduletable_news
ชื่อที่กำหนดต่อท้าย (_news) เราจะตั้งเป็นอะไรก็ได้ครับ (ในที่นี้ผมใช้เป็น news) แต่ที่สำคัญคือต้องมีการใส่เครื่องหมาย “_” ก่อนหน้าเสมอหรือจะใส่ “-” ขั้นไว้ก็ได้ และเวลาที่เราจะใส่ชื่อในช่อง Module Class Suffix ก็จะใส่เต็มคือ _news
ที่นี้เรามาดูรูปแบบของ css ใน module ก่อนครับจะทำให้เราเขียนกำหนดได้ถูกต้อง ในส่วนหัวข้อจะถูกำหนดเป็น .moduletable h3 และตัว module จะเป็น .moduletable
1. ในส่วนนี้จะใช้ชื่อว่า .moduletable_news h3
2. ในส่วนนี้จะใช้ชื่อว่า .moduletable_news
ให้เราเข้าไปที่ templates/[ชื่อ template]/css/template.css ซึ่งของผมก็คือ templates/rhuk_milkyway/css/template.css ให้เราแก้ไขไฟล์ตัวนี้และใส่ class css เพิ่มเข้าไปในไฟล์
กำหนด css ได้ตามต้องการครับ จะสวยไม่สวยก็อยู่ตรงนี้ละครับในการจัดรูปแบบ css เสร็จแล้วถ้าเราต้องการใช้ซ้ำ ก็ให้กำหนด module class suffix ของ module ตัวอื่นให้ชื่อเป็นตามเดิมที่เราได้สร้างไว้ _news
บทความแนะนำ
