Requirements

ตั้งโจทย์  ต้องการแสดงผลหน้าเว็บแบบไหน? เขียนขึ้นมาทั้งหมด เพื่อการสร้างธีม การทำเว็บตอบโจทย์ได้

วางแผนงาน

อาจทำ template 2 ไฟล์ หน้าลิสโพส (index.php) และหน้าแสดง content แบบเต็ม (single.php , page.php)

เตรียม

– เครื่องมือต่างๆ ใช้ opensource frameworks ที่มีอยู่แล้วช่วยการทำงาน

• Bootstrap สำหรับ HTML  CSS front-end
• Underscore เป็น starter theme สำหรับทำ wordpress

– ข้อมูลเว็บ รูปภาพ ข้อความ ฯลฯ

Design : ออกแบบ

ใช้การวาดกับมือคร่าวๆ เรียกว่า wireframe อาจจะเรียกว่าเป็น low-fi wireframe

Coding : html ,css

เลือกใช้ bootstrap framework สำหรับ HTML&CSS เพื่อประหยัดเวลา

1. ดาวน์โหลด bootstrap framework และอ่านหน้า Getting Started เพื่อเริ่มใช้งาน
2. สำหรับเว็บใหญ่ๆ อาจจะใช้ css frameworks อย่าง SASS หรือ LESS เข้ามาช่วยด้วย แต่งานนี้เราไม่ได้ใช้ เนื่องจากเว็บเล็กมาก ลุย css ไปเพียวๆ เลยดีกว่าไม่ต้องเสียเวลา setup
3. เริ่มโค้ดโดยใช้ code editor มีทั้งแบบฟรีและเสียเงิน ที่เค้าฮิตๆ กัน ใช้แล้วดูโปร ดูเขียนโค้ดเป็น ก็คือ Sublime Text ($70) หรือจะใช้ของฟรีอย่าง brackets (by Adobe, FREE) ก็ไม่มีปัญหา

Transform html to WordPress Theme

อาจใช้ stater theme ยี่ห้อ Underscore เมื่อดาวโหลดมาแล้ว แก้แค่ไฟล์ที่จำเป็น