TimelineJS สุดยอดเครื่องมือสร้างไทม์ไลน์ที่ใช้ง่ายและงดงาม

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

วิธีใช้งาน TimelineJS มีอธิบายในเว็บอย่างละเอียดแล้ว คุณไม่ต้องมีความรู้เรื่อง JavaScript, CSS, HTML อะไรพวกนี้เลย เพียงแค่ใช้ Google Spreadsheet Template ที่ทางผู้พัฒนาเตรียมไว้แล้ว นำมาแก้ไขโดยใส่ข้อมูลของคุณเอง

ตัวอย่างการใส่ข้อมูลไทม์ไลน์ลงใน Google Spreadsheet

ตัวอย่างการใส่ข้อมูลไทม์ไลน์ลงใน Google Spreadsheet

ข้อมูลที่คุณใส่ลงไทม์ไลน์ได้ไม่ได้มีแค่ข้อความแห้งๆ แต่สามารถใส่รูปภาพได้ทั้งแบบที่อยู่บนเว็บของคุณเอง หรือฝากรูปไว้บน Flickr ก็ได้ ใส่แผนที่ Google Maps ได้ ใส่คลิปวิดีโอ YouTube, Vimeo, Vine, Dailymotion ได้ ใส่ข้อความจาก Twitter หรือ Wikipedia ได้ หรือใส่คลิปเสียงจาก SoundCloud ก็ได้ และทางผู้พัฒนาก็จะใส่มีเดียแบบอื่นๆ เพิ่มเข้าไปมากขึ้นในอนาคต

จากนั้นก็นำ URL ของ Spreadsheet ของคุณไปใส่ในเว็บ TimelineJS เพื่อสร้างเป็นโค้ดสำหรับนำไปแปะในเว็บของคุณ เพียงเท่านี้ก็เรียบร้อย

ตัวอย่างไทม์ไลน์ของผมที่สร้างโดย TimelineJS

ตัวอย่างไทม์ไลน์ของผมที่สร้างโดย TimelineJS

นอกจากจะใช้บันทึกประวัติการทำงานของตัวเองแล้ว ยังเอามาใช้ทำอย่างอื่นได้อีกหลายอย่างเลย เช่น บันทึกเหตุการณ์สำคัญของบริษัทตัวเอง บันทึกช่วงเวลาดีๆ ที่มีร่วมกับคนรัก บันทึกพัฒนาการของลูก ฯลฯ

ลองดูคลิปวิดีโออธิบายการใช้งานด้านล่างนี้ แล้วดูตัวอย่างของจริงว่าทำแล้วออกมาเป็นยังไงได้ที่หน้าประวัติการเป็นวิทยากรของผม หรือดูตัวอย่างสวยๆ ที่คนอื่นทำ และลองใช้งานจริงได้ที่เว็บ TimelineJS ได้เลย

ถ้าอ่านแล้วชอบ ฝากแชร์ด้วยนะครับ
  •  
  •  
  •  
  •  
  •  
  •  
  •