เว็บไซต์สำเร็จรูป - จัดระเบียบข้อมูลบนหน้าเว็บไซต์ด้วยเครื่องมือตาราง

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

1. Log in เข้าส่วนสมาชิก ที่เมนู "ระบบพื้นฐาน" คลิก "จัดการกลุ่มบทความ / บทความ" (หรือเมนูอื่น ๆ ที่ต้องการเพิ่มรูปภาพเพื่อผูกลิงค์จากภาพเล็กไปยังภาพใหญ่ค่ะ)

2. เข้าสู่หน้า "จัดการกลุ่มบทความ / บทความ" คลิกที่ชื่อกลุ่มบทความ จากนั้นคลิก เพื่อเพิ่มบทความใหม่ หรือคลิก เพื่อแก้ไขบทความเดิมที่สร้างไว้แล้วตามต้องการ

3. คลิกแท็บ "เนื้อหาของบทความ" คลิกเลือกคำสั่งสร้างตารางด้วยเครื่องมือ Insert/Edit Table

4. จะปรากฏเป็นหน้าต่างย่อยที่ชื่อ Table Properties สามารถทำการกำหนดขนาดและรายละเอียดของตารางได้ โดยในตัวอย่างจะกำหนดอยู่ที่ 8 แถว 2 คอลัมน์ เมื่อกำหนดรายละเอียดแล้ว จากนั้น คลิก OK

     Rows คือ จำนวนแถวที่ต้องการสร้าง
     Columns คือ จำนวนคอลัมน์ที่ต้องการสร้าง
     Alignment คือ รูปแบบการแสดงผลของตาราง โดยสารมารถเลือกการแสดงผลได้ หลายแบบ
     Border Thickness คือ ขนาดความหนาของเส้นขอบตาราง (หากใส่เลข 0 จะเป็นการซ่อนเส้นขอบตารางไม่ให้แสดงค่ะ)
     Height คือ ขนาดความสูงของตาราง
     Width คือ ขนาดความกว้างของตาราง
     Cell Spacing คือ ขนาดพื้นที่ความกว้างของเส้นขอบตาราง
     Cell Padding คือ ขนาดพื้นที่ความกว้างของช่องตาราง
     Caption คือ คำอธิบายหรือหัวข้อตาราง (แสดงผลเหนือตาราง)
     Summary คือ คำอธิบายรายละเอียดสรุปของตาราง (ไม่แสดงผลบนหน้าเว็บไซต์ แต่จะปรากฎเมื่อแสดงรายละเอียดตารางในลักษณะโค้ด HTML)

5. จะปรากฏตารางในเนื้อหาของบทความ   ท่านสามารถทำการอัพโหลดภาพ และตัวอักษรใส่ลงไปในตารางตรงตำแหน่งที่ต้องการได้

6. นอกจากนี้ ยังสามารถปรับแต่งการแสดผลของตารางได้ ด้วยเครื่องมือต่าง ๆ ดังต่อไปนี้

     Insert Cell Before (แทรกช่องด้านหน้า) : ใช้สำหรับการแทรกช่องของตารางหน้าตำแหน่งของ cursor
     Insert Cell After (แทรกช่องด้านหลัง) : ใช้สำหรับการแทรกช่องของตารางหลังตำแหน่งของ cursor
     Delete Cells (ลบช่อง) : ใช้สำหรับลบช่องตารางที่ตำแหน่ง cursor
     Merge Right (ผสานช่องด้านหน้า) : ใช้สำหรับผสานคอลัมน์ของตาราง
     Merge Down : (ผสานช่องด้านหลัง) : ใช้สำหรับผสานแถวของตาราง
     Split Cell Horizontally : ใช้สำหรับเพิ่มช่องตารางแบบแนวตั้ง
     Split Cell Vertically : ใช้สำหรับเพิ่มช่องตารางแบบแนวนอน
     Cell Properties : ใช้สำหรับปรับแต่งการแสดงผลของช่องตารางเพิ่มเติม เช่น ขนาดความกว้าง ความสูงของช่องตาราง สีพื้นหลังและสีเส้นขอบของช่องตาราง การจัดตำแหน่งของตัวอักษรในช่องตารางแบบแนวตั้งและแนวนอน เป็นต้น

     Insert Row Before (แทรกแถวน์ด้านบน) : ใช้แทรกแถวด้านบนของตำแหน่ง cursor
     Insert Row After (แทรกแถวด้านล่าง) : ใช้แทรกแถวด้านล่างของตำแหน่ง cursor
     Delete Row (ลบแถว) : โดยกำหนดให้ cursor วางในแถวที่ต้องการจะลบ
     Insert Column Before (แทรกคอลัมน์ด้านหน้า) : ใช้สำหรับแทรกคอลัมน์ด้านหน้าตำแหน่ง cursor
     Insert Column After (แทรกคอลัมน์ด้านหลัง) : ใช้สำหรับแทรกคอลัมน์ด้านหลังตำแหน่ง cursor
     Delete Column (ลบคอลัมน์) : ใช้สำหรับลบแถวที่ตำแหน่ง cursor

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