สร้างตาราง WordPress

การสร้างตารางเป็นการนำเสนอข้อมูลบน Website ให้ชัดเจน ง่ายต่อการอ่าน โดย WordPress จะมีฟังก์ชั่น Table ในการสร้างตาราง แต่ด้วยความยากในการจัดการ และลูกเล่นที่น้อยมาก ทำให้เราต้องหาตัวช่วยเพิ่ม นั่นก็คือ Plugin มาช่วยให้การสร้างนั้นง่ายขึ้นและสีสันสวยมากขึ้นเป็น 100 เท่า

ตัวอย่างการสร้างตารางบน WordPress ปกติทั่วไป หรือ โดยการใช้ Copy (Ctrl+c) มาจากไฟล์ Excel

รายชื่อผู้ถือหุ้นรายใหญ่ของ PTT : บริษัท ปตท. จำกัด (มหาชน)

ลำดับ ผู้ถือหุ้นรายใหญ่ จำนวนหุ้น (หุ้น) % หุ้น
1.  กระทรวงการคลัง 14,598,855,750 51.11
2.  กองทุนรวม วายุภักษ์หนึ่ง โดย บลจ.เอ็มเอฟซี จำกัด (มหาชน) 1,736,895,500 6.08
3.  กองทุนรวม วายุภักษ์หนึ่ง โดย บลจ.กรุงไทย จำกัด (มหาชน) 1,736,895,500 6.08
4.  บริษัท ไทยเอ็นวีดีอาร์ จำกัด 1,462,447,998 5.12
5.  SOUTH EAST ASIA UK (TYPE C) NOMINEES LIMITED 572,602,103 2.00
6.  สำนักงานประกันสังคม 538,355,200 1.88
7.  STATE STREET EUROPE LIMITED 387,927,495 1.36
8.  ชุมนุมสหกรณ์ออมทรัพย์แห่งประเทศไทย จำกัด 366,396,500 1.28
9.  GIC PRIVATE LIMITED 218,951,400 0.77
10.  THE BANK OF NEW YORK (NOMINEES) LIMITED 193,355,400 0.68
11.  สหกรณ์ออมทรัพย์ การไฟฟ้าฝ่ายผลิตแห่งประเทศไทย จำกัด 183,871,800 0.64

 

ตัวอย่างตารางด้านบนเป็นการดึง Copy ข้อมูลตรงๆ จาก Excel หรือ บน Website ซึ่งถ้าใครจะสร้างตารางแบบนี้บน WordPress ด้วยตัวเอง โดยไม่ใช้ Plugin ช่วย อาจจะค่อนข้างเหนื่อย และการปรับแต่งค่อนข้างเป็นการอย่างยากลำบาก (แค่ขยับนิดๆหน่อยๆ หรือกดลบยังยากเลย ตารางใน WordPress ถ้าใครใช้งานบ่อยๆจะรู้ดี) 

ที่สำคัญไม่ค่อยสวย แถมลูกเล่นน้อย (ถ้าตารางดีๆ จะมีช่อง Search หรือ กดเรียงลำดับได้) 

ซึ่งผมอยากแนะนำ Plugin ตัวนึงในการสร้าง Table ที่ชื่อว่า “Ninja Tables

จะมีเป็นพระเอกในการช่วยจัดการในการสร้างตารางบน WordPress ของ Website เราได้เป็นอย่างดี

ninja tables - best wp datables plugin for wordpress

ตัวอย่างตารางที่สร้างโดย Ninja Tables (ฟรี Version)

ตารางเดิม คือ รายชื่อผู้ถือหุ้นรายใหญ่ของ PTT : บริษัท ปตท. จำกัด (มหาชน)

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

Mobile friendly

ข้อสำคัญอีกอย่างหนึ่งสำหรับตารางของ Ninja Tables คือ “Mobile friendly” นั่นหมายความว่า ตารางที่สร้างโดย Ninja tables จะสามารถเปิดดูบนมือถือได้อย่างชัดเจน (ไม่ตกขอบ!) เพราะ ตารางทั่วไปส่วนมาก มักเปิดในมือถือแล้วเพี้ยน

PC Tablet Mobile table

โดยเราสามารถปรับแต่งการแสดงได้ทั้งบน Desktop , Tablet และ Mobile

บอกเลยครับว่า ตารางที่ให้ใน WordPress หรือพวก Plugin ตารางอื่นๆ มักตกขอบ แต่ Ninja ไม่ครับ

ใส่ลูกเล่นตาราง

เราสามารถปรับตัวสีสันของตารางให้สวยงามได้ด้วยเช่นเดียวกัน

color tables

ตัวอย่าง ตารางขายสินค้าที่สร้างโดย Ninja tables plugin บน WordPress

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

league points table

ลองเข้าไปดู Demo ตารางต่างๆ ที่ Ninja เค้าทำไว้เป็นตัวอย่างได้ที่นี่ คลิ๊ก : ดู Demo ตาราง

การสร้างตารางโดยใช้ Ninja Tables

add table ninja table

เมื่อเราติดตั้ง Plugin Ninjatables โดยจะให้ทำการสร้างตารางได้จำนวน 7 วิธีด้วยกัน 

ต้องบอกก่อนว่า บางวิธีฟรี แต่บางวิธีเสียเงิน

  1. Default : เป็นการสร้างตารางทั้วไป โดยให้เราทำการ Add column / row และใส่ข้อมูลเข้าไปในแต่ละช่องเอง 
  2. Import Table : อันนี้เป็นการดึงตารางจากไฟล์ Excel ที่นามสกุล .CSV (เวลาจะดึงข้อมูลจาก Excel ก็ต้อง Save เป็น นามสกุล .CSV ก่อนนะครับ)
  3. Connect Fluent Form : เป็นการดึงข้อมูลจาก Fluent Form ที่เป็น Plugin แบบฟอร์มของทาง Ninja เพื่อนำมาสร้างตารางข้อมูล
  4. WP Posts : เป็นการดึงหน้า Post/Page บน WordPress มาทำเป็นตาราง 
  5. Connect Google Sheets : เชื่อมต่อ Google Sheets เพื่อดึงตารางข้อมูลมาแสดงบน Website 
  6. Connect External CSV : อันนี้สำหรับ ใครที่จะใช้ข้อมูลที่อัพเดทเปลี่ยนแปลงอยู่ตลอด เหมาะมากครับ เพราะ เราสามารถเชื่อมต่อข้อมูลตารางบน Website กับ ไฟล์ .CSV ให้มัน Link กัน 
  7. Custom SQL Query : อันนี้สำหรับโปรแกรมเมอร์ที่จะใช้ดึงข้อมูลด้วยภาษา SQL มาสร้างเป็นตารางเป็น Website

ราคา Premium Version

ทาง Ninja มีให้เลือกอยู่ 2 แพคเกจหลักๆ คือ

  1. Annual (ระยะเวลา 1 ปี)
    1. 1 เว็บ – 49 USD (ประมาณ 1,500 บาท)
    2. 20 เว็บ – 99 USD (ประมาณ 3,000 บาท)
    3. ไม่จำกัดจำนวนเว็บไซต์ – 199 USD (ประมาณ 6,000 บาท)
  2. Lifetime (ตลอดชีวิต) 
    1. 1 เว็บ – 199 USD (ประมาณ 6,000 บาท) *** แนะนำ : คลิ๊กเพื่อดูรายละเอียด
    2. 20 เว็บ – (ประมาณ 12,000 บาท)
    3. ไม่จำกัด – 599 USD (ประมาณ 18,000 บาท)

โดยถ้าใครอยากลองใช้ก่อน ก็สามารถใช้ฟรีไปก่อนได้ หรือ ลองซื้อตัว 1 ปี ที่ประมาณ 1500 บาท มาเล่นดูก่อน แต่ผมแนะนำให้ซื้อตัว Lifetime ไปเลยดีกว่า ค่อนข้างคุ้ม เพราะ เราสามารถใช้ได้ยาวๆ ไม่มีหมดอายุ

Tip : ดึงตารางจาก Google Sheets

https://www.youtube.com/watch?v=ai8-badNhXQ&ab_channel=WPManageNinja