สิ่งหนึ่งที่เรามักจะเห็นในเว็บไซต์องค์กรที่มีประวัติความเป็นมาอย่างยาวนาน หรือเว็บไซต์ที่มีการนำเสนอข้อมูลเกี่ยวกับประวัติที่มีระยะเวลายาวนาน เช่น การแข่งขันฟุตบอลโลก, มหกรรมกีฬาโอลิมปิก หรือประวัติของบริษัทชั้นนำของโลก นั่นคือการนำเสนอข้อมูลแบบ Timeline
Timeline เป็นการนำเสนอข้อมูลที่มีเส้นตรงเป็นแกนหลัก โดยที่เส้นตรงดังกล่าวเป็นได้ทั้งแบบแนวนอนและแนวตั้ง ทำหน้าที่เป็นเส้นของเวลา เส้นตรงที่เป็นแกนก็จะมีไอคอนที่ระบุวันเดือนปีไล่ลงมาตั้งแต่ปีเก่าสุดไปจนถึงปีปัจจุบัน และก็จะมีรายละเอียดทั้งหัวข้อ รูปภาพ รายละเอียด เป็นลักษณะกล่องข้อความแยกออกมาทางซ้ายและขวาของเส้นแกนที่ทำหน้าที่เป็นของเส้นของเวลา
การสร้าง Timeline ใน WordPress นั้นทำได้ไม่ยาก ใน Page Builder ส่วนใหญ่ก็สามารถทำได้ทั้งจากตัว Page Builder เองหรือลงปลั๊กอินเสริมสำหรับ Page Builder นั้นๆ ซึ่งปลั๊กอินที่จะมาแนะนำในวันนี้มีชื่อว่า Cool Timeline (Horizontal & Vertical Timeline) จากผู้พัฒนา Cool Plugins
Cool Plugins เป็นบริษัทน้องใหม่ที่มุ่งเน้นการพัฒนาปลั๊กอิน WordPress ก่อตั้งขึ้นในปี 2016 ในเมือง Mohali ประเทศอินเดีย โดยเรื่องราวเริ่มต้นจากเพื่อนสองคนคือ Satinder Singh และ Narinder Singh ได้ออก Plugin ฟรีตัวหนึ่งใน WordPress.org ในปี 2016 ซึ่งได้รับการตอบรับอย่างล้นหลาม พวกเขาทุ่มเทเวลาในการพัฒนา Plugin มากขึ้น ในปัจจุบัน Cool Plugins มีทีมงาน Developers and Designers กว่า 15 คน มีปลั๊กอิน WordPress ทั้งแบบ Free และ Premium มากกว่า 20 รายการ
สำหรับปลั๊กอิน Cool Timeline (Horizontal & Vertical Timeline) นั้นก็ถือเป็นปลั๊กอินที่ใช้สร้าง Timeline ที่ได้รับความนิยมตัวหนึ่ง โดยมียอดดาวน์โหลดตั้งแต่เวอร์ชั่นแรกถึงปัจจุบันรวมแล้วกว่า 6 แสนครั้ง โดยมีทั้งเวอร์์ชั่น Free และเวอร์ชั่น Pro
ราคาและแพลนของ Cool Timeline Pro
แบบรายปี
Personal | $29/Year | ใช้ได้ 1 เว็บไซต์
Professional | $59/Year | ใช้ได้ 5 เว็บไซต์
Agency | $99/Year | ใช้ได้ 25 เว็บไซต์
แบบตลอดชีพ
Personal | $59/Year | ใช้ได้ 1 เว็บไซต์
Professional | $149/Year | ใช้ได้ 5 เว็บไซต์
Agency | $299/Year | ใช้ได้ 25 เว็บไซต์
คุณสมบัติเด่นของปลั๊กอิน Cool Timeline เวอร์ชั่น Free
Gutenberg Timeline Block
Gutenberg Block ช่วยให้คุณสร้าง Timeline แบบ Vertical ได้สวยงามและง่ายดาย
Compact Timeline
ในเวอร์ชั่น Free การสร้าง Timeline จะเป็นแบบ Compact คือจะไม่มีช่องว่างระหว่าง Story มากนัก
Clean Layout
ใช้โครงสร้างที่สะอาดตา สีไม่จัด
Advanced Design & Optimized Code
ออกแบบมาให้เป็นมึตรกับนักพัฒนา โดยสามารถปรบแต่ง Timeline ได้อย่างง่ายดาย
Timeline Shortcode
รองรับการสร้าง Timeline ด้วย Classic Editor ของ WordPress และนำไปใช้ในหน้า Post หรือ Page ที่เป็น Gutenberg ได้ด้วยการวาง Block Shortcode
คุณสมบัติเด่นของปลั๊กอิน Cool Timeline เวอร์ชั่น Pro
Horizontal Roadmap Timeline
มี Timeline แบบ Horizontal เหมาะสำหรับการนำเสนอแผนและขั้นตอนของโครงการหรือบริษัท
40+ Timeline Designs
มี Timeline Designs ให้เลือกใช้มากกว่า 40 แบบ
Gutenberg / Elementor / WPBakery
นอกจากนี้มี Block ของ Gutenberg แล้ว ยังรองรับการใช้งานกับ Page Builder Elementor และ WPBakery
15+ Animation Effects
มีเอฟเฟกต์แอนิเมชั่นสุดเจ๋งมากกว่า 15+ แบบ เพื่อประสบการณ์การออกแบบ Timeline ระดับ Premium
การติดตั้งปลั๊กอิน Cool Timeline
ที่หลังบ้าน WordPress ไปที่ Plugins -> Add New Plugin
ที่หน้า Add Plugins ให้ใส่คำว่า Cool Timeline ที่ช่อง Keyword
Install และ Activate ให้เรียบร้อย
อธิบายเมนูของปลั๊กอิน Cool Timeline
เมื่อ Install และ Activate เรียบร้อยแล้ว จะเข้าไปตั้งค่าต่างๆของ Cool Timeline ได้จาก -> Timeline Addons โดยมีเมนูทั้งหมด 4 เมนู
Dashboard
เป็นหน้าท่ีแสดงปลั๊กอิน Timeline ทั้งหมดของ Cool Timeline โดยจะแสดงปลั๊กอินที่ลงและ Active อยู่ ซี่งในตัวอย่างก็จะลง Cool Timeline (Horizontal and Vertical Timeline) เอาไว้ โดยจะเห็นว่ามี Timeline Block For Gutenberg ตัวนี้จะเป็นปลั๊กอินที่เพื่อสร้าง Timeline ด้วย Gutenberg Block ซึ่งมีอยู่แล้วใน Cool Timeline จึงไม่จำเป็นต้องลงอีก
Cool Timeline Stories
เป็นหน้าที่ใช้ Timeline ด้วย Classic Editor ของ WordPress และนำไปใช้ด้วยการเพิ่ม Block ใน Gutenberg Editor โดยจะสร้างได้แค่ 1 Timeline เท่านั้น เมื่อคลิกที่ปุ่ม Add New จะเป็นการสร้าง Story ที่ 1 และสร้าง Story ที่ 2 ด้วยการคลิกปุ่ม Add New อีกครั้ง สร้างไปจนครบที่ต้องการ ซึ่งทุก Story ก็จะรวมกันเป็น 1 Timeline
Add New Story
เมื่อเลือกเมนูนี้จะไปที่หน้า Add New Story สำหรับใช้สร้าง Story
Timeline Settings
หน้าสำหรับตั้งค่าต่างๆที่ใช้ใน Story ที่สร้างด้วย Classic Editor ของ WordPress สามารถตั้งค่าได้ทั้งสี รูปแบบตัวอักษร และจะมี tab ที่แนะนำขั้นตอนการสร้างแบบ Classic Timeline Shortcode, Modern Timeline Block และ Elementor Timeline Widgets
ข้อแตกต่างระหว่าง Cool Timeline Free กับ Pro
ตัวอย่างการสร้าง Timeline แบบ Classic Timeline Shortcode
ไปที่ Timeline Addons -> Add New Story หรือจะคลิกปุ่ม Add New จากหน้า Cool Timeline Stories ก็ได้
ตั้งชื่อ Story และใส่รายละเอียดข้อความลงไป (เวอร์ชั่นฟรี ใส่รูปภาพไม่ได้) จากนั้นตรง Story Type เลือก Date/Year ของ Story จากนั้นคลิกที่ปุ่ม Publish
สร้าง Story ลำดับถัดไปด้วยการคลิกที่ปุ่ม Add New ที่อยุ่ด้านบนสุดของหน้าที่เพิ่งสร้าง Story 1 ไป
สร้าง Story ให้ครบตามที่ต้องการ เมื่อกลับไปดูที่หน้า Timeline Stories ก็จะแสดง Story ทั้งหมดที่สร้างไว้
หลังจากนั้นไปที่หน้า Post หรือ Page โดยการใช้ Gutenberg Editor แล้วเพิ่ม Block -> Cool Timeline Shortcode ลงไป และคลิกที่ปุ่ม Publish
เมื่อไปดูที่หน้าเว็บ ก็จะเห็น Timeline ที่สร้างไว้
ตัวอย่างการสร้าง Timeline แบบ Modern Timeline Block
ไปที่หน้า Post หรือ Page โดยการใช้ Gutenberg Editor แล้วเพิ่ม Block -> Cool Timeline Block ตัวปลั๊กอินจะลงตัวอย่างให้ 3 Story
โดยในแต่ละ Story สามารถเปลี่ยนภาพ แก้ไขวันเดือนปีของ Story รวมถึงหัวข้อและรายละะอียดของ Story ได้เหมือนการแก้ไข Block ทั่วไปเลย
ถ้าต้องการเพิ่ม Story ก็เลื่อนลงไปด้านล่างสุด และคลิกที่ปุ่ม + Add Story
นอกจากนี้ยังแก้ไขเส้นและไอคอนของ Timeline ได้ โดยคลิกที่ Block Cool Timeline Block และดูที่แถบเมนูทางด้านขวา จะสามารถแก้ไขตั้งค่าต่างได้จากที่นี่ เหมือนกับการแก้ไขตั้งค่าต่างๆของ Block ทั่วไปนั่นเอง
General ใช้เลือก Layout ของ Timeline, Timeline Design และการเลือกว่าจะให้ Full Story อยู่ด้านซ้ายหรือขวา
Style ใช้ตั้งค่าเกี่ยวกับตัวอักษรใน Story ทั้งหมด ทั้งหัวข้อและรายละเอียด ทั้งรูปแบบตัวอักษร ขนาด น้ำหนัก รวมถึงสีของตัวอักษร
Advanced ใช้ตั้งค่าสีของเส้น Timeline, Icon รวมถึงตวามหนาของเส้น Timeline และขนาดของ Icon Timeline
เมื่อสร้าง Story เสร็จเรียบร้อยแล้ว ให้คลิกที่ปุ่ม Publish เพื่อบันทีกการเปลี่ยนแปลง
เมื่อไปดูที่หน้าเว็บ ก็จะเห็น Timeline ที่สร้างไว้
สรุป
สำหรับคนที่กำลังอยากจะสร้าง Timeline Story ลงในเว็บไซต์ และมองหาปลั๊กอินแนวนี้อยุ่ละก็ ขอแนะนำตัวนี้เลยครับ ปลั๊กอิน Cool Timeline เป็นปลั๊กอินที่ใช้งานง่าย สร้าง Timeline Story ได้สวยงาม ถ้าในเวอร์ชั่นฟรีไม่เพียงพอ ก็ยังมีเวอร์ชั่น Premium ที่ราคาค่อนข้างย่อมเยา $29 ต่อปี หรือ $59 ในแบบตลอดชีพ ก็จะมี Timeline Layout ให้เลือกมากกว่า 40 แบบ