12 พฤษภาคม 2010XHTML+CSS to WordPress theme class by @iMenn
สองวันสร้างธีมจริงๆครับ สำหรับคลาสเรียน XHTML + CSS เพื่อไปเป็นธีมสำหรับ WordPress
ซึ่งผมได้ติดต่อพี่เม่นแห่ง imenn.com ผู้เชี่ยวชาญด้านการสร้างเว็บไซต์และธีมใน WordPress มา
เป็นผู้สอนพวกผมและเพื่อนๆ ในครั้งนี้ครับ รายชื่อนักเรียนก็มีดังต่อไปนี้ครับ
- เฟรมคุง ผมมาจากโคราช เพื่อมาเรียนโดยเฉพาะครับ (สุดท้ายมันก็ไม่เรียนโดยเฉพาะ - -)
- โฟน เพื่อนผมมาจากโคราชครับ
- ฟัก @LifeZ ซึ่งเป็นคนแรกที่ผมชวนคุยเรื่องเรียนคลาสนี้ครับ ทำงานด้วยกัน มาจาก
นครสวรรค์ - บี้ @biekub มาจากจังหวัดสกลนคร แต่กำลังจะไปตั้งหลักปักฐานที่เชียงใหม่แล้ว
- แบงค์ @iBankstory บินตรงมาจากภูเก็ต อย่างเดียวที่แบงค์ไม่ให้บอกคือ อายุ
เพราะเป็นคลาสเล็กๆ ที่พวกผมรวมตัวกันขึ้นครับ ทำเว็บก็ตั้งนาน หลงรักใน WordPress
อยากจะเรียนให้เข้าใจ ให้รู้เรื่องกันไปข้างเลยทีเดียว ก็ต้องลงทุนกันหน่อยล่ะครับ
Day 1 : XHTML + CSS Class
วันแรกเราตั้งใจว่า เราจะเรียนตัด XHTML+CSS จากกราฟิกครับ เรื่องสถานที่เรียน เราใช้วิธี
ลิสต์รายชื่อร้านกาแฟที่รองรับพวกเราทั้งหมดในกรุงเทพมหานคร จากนั้นเราก็นำไปใส่กล่องแล้ว
เขย่าๆครับ ก็เลยได้มาเป็นที่ร้านกาแฟวาวี (จริงๆแล้วน้องฟักเลือกมา ไม่เกี่ยวกับจับอะไรมาเขย่า - -”)
ร้านนี้น้องฟักเล่าเหตุผลในการให้พี่เฟรมมาถึงที่นี่ได้ก็เพราะว่า เป็นสถานที่ที่ทวิตเพิลหลายๆคนมาครับ
กับอีกเหตุผลคือมีความทรงจำดีๆที่ร้านนี้ของครูผู้สอน ผมจึงจำเป็นต้องคล้อยตาม ถึงแม้ว่าผมจะมีใจให้ทองหล่อมากก็ตามที
วิดิโอบรรยากาศขณะรออยู่หน้าร้านกาแฟครับ ไม่ได้ตัดต่อนะครับ ไปชมความรั่วได้
ไม่นานสมาชิกครบ อาจารย์มาแล้ว ! เราก็เดินเข้าไปครับ พี่เม่นติดต่อเรื่องสถานที่ อยากจะใช้
ห้องประชุมใหญ่ชั้นบน ครั้งแรกเราเข้าใจว่าไม่มีค่าใช้จ่ายครับ ด้วยเหตุผลนี้เราเลยยืนอึ้งในร้าน
กันสักพักหนึ่ง ก่อนที่จะมูฟว์ มาที่ทองหล่อ (555)
เราแยกกันเดินทางไปที่ทองหล่อครับ สถานที่ที่เราเล็งๆไว้คือ True Coffee เราตรงกันมาที่
The Eight ทองหล่อ ซ.8 ร้าน True Coffee ครับ ก่อนที่เราจะสั่งกาแฟและเริ่มเรียนกัน
เนื้อหาโดยภาพรวม พี่เม่นพาไปดู CSS พื้นฐานที่จำเป็นครับ โดยเข้าไปดูความเป็นมา เกี่ยวกับ
การแยกเนื้อหา กับ การนำเสนอ ซึ่งก็อาจจะหมายถึง HTML ที่เป็นส่วนเนื้อหา และการกำหนด
รูปแบบนำเสนอให้ CSS ช่วยจัดการ , เรื่องของ CSS Reset ที่กลับไปเคลียร์ค่า stylesheet
เดิม , Box modules ที่เข้าไปเล่นกับ div , padding , margin พี่เม่นสามารถถ่ายทอด
ด้วยการให้ลองทำจริง เขียนกันจริงๆ และเอาเว็บไซต์หลายๆเว็บไซต์มาให้ดูเป็นตัวอย่างด้วยครับ
พี่เม่นจะพูดถึงอะไรที่สำคัญกับงานเราจริงๆครับ การแก้ปัญหา พี่เม่นบอกว่ามันไม่ไม่มีอะไรมาก
ผมก็มองว่ามันไม่มีอะไรมากไปเลย เทพสั่งได้จริงๆครับ
บ่ายวันนั้น เราคิดใหม่ครับ เราคิดต่อไปว่า สถานที่นั้นก็ยังถือว่าเล็กไปสำหรับเราอยู่ นั่งคุยๆกัน
ระหว่างทานข้าว จึงลองเปลี่ยนไปสถานที่อื่นดู ซึ่งก็เล็งๆไว้ที่ร้านบ้านไร่กาแฟ ตรง BTS เอกมัย
ครับ ผลออกมาก็เป็นที่น่าพอใจ สถานที่กว้างใหญ่ เหมาะสำหรับเป็นสถานที่เรียนพวกเราได้ !!!
เราเริ่มต้นเรียนกันต่อครับ เราลองสร้างไซต์จากไฟล์กราฟิกที่พี่เม่นตัดไว้เป็นตัวอย่างด้วย XHTML
และ CSS ขึ้นเป็นเว็บไซต์ เป็นโครงพื้นฐาน (ซึ่งผมว่าจริงๆแล้ว เรื่องนี้ทั้งหมดมันก็ยากอยู่ตรงนี้)
มีอะไรเล็กๆน้อยๆที่เราจะเห็นตอนทำงาน ซึ่งพี่เม่นก็ไกด์ให้ได้ตลอดทางครับ
ระหว่างเรียนเจอเครื่องแอบงอนพี่เม่นนิดหน่อยครับ เรามาดูกันว่าพี่เม่นจัดการกับ MacBook ยังไง
เฮ้ยยย พี่ทำอย่างงี้เลยเหรอครับเนี่ย !!!
เย็นวันนั้น ก็ได้งานกันทุกคน เราจะต้องกลับไปตัดไซต์มาส่งครูเม่นครับ แต่เรา ไหนๆก็มาเจอกันทั้งที
ขอมาหาอะไรดีๆกินกันที่ทองหล่อหลังจากเลิกเรียนครับ (เอ๊ะ ! หรือนี่มันจะเป็นประเด็นหว่า - - ?)
พวกเราแท็กซี่มาถึงทองหล่อครับ ตรงมาที่ซอย 10 แถวนั้นเป็นถนนสายของคุณตันและครอบครัว
วันนี้เรามาอุดหนุนคุณตันที่ OISHI Express ครับ เป็นฤดูปลาฮามาจิ เหมือนจะเป็นไฮไลท์ครับ
ผมก็มีโอกาสได้จัดการไปถ้วยเดียว จากนั้น มันก็ถูกแย่งจากประชาชนี่เข้ามาใช้บริการอย่างต่อเนื่อง
อิ่มแบบ เดินไม่ได้กันเลยทีเดียว ก่อนที่ผมจะเดินตรงไปอีกหน่อย ไปยังสถานที่ ที่ทั้งน้องชาย
ทั้งเพื่อน พ่อแม่พี่น้อง บอกให้ผมไปซื้อมาฝาก นั่นก็คือช็อคโกแลตจากเดี่ยว 8 ร้าน melt-me
นั้นเอง ผมเข้าไปค้นราคาในเน็ตมาก่อนหน้านี้แล้ว แล้วก็เตรียมใจมาแล้วด้วยล่ะ
ก็จัดไปครับ ได้ฮอกไกโด ดาร์ค ช็อคโกแลตมา ผมจัดการไป ก็เลยลองเหลือมาไว้บ้างครับ ทางร้าน
เค้าไม่รับประกันการละลายที่เกินระยะเวลา 4 ชม. แต่ผมก็ฝืนมันเป็นระยะเวลาร่วมสิบชม. มาถึงบ้าน
ก็พบว่ามันเสียหายเล็กน้อย รีบเอาไปแช่เย็นซะครับ (จะลำบากทำไมเนี่ย - - ”)
พนักงานบริการดีมากครับ 15 ชิ้น สนนราคาอยู่ที่ 250 บาท ช็อคโกแลตเป็นกรัม กรัมละ 3 บาทนะครับ
(ขอค่าโฆษณาด้วยครับ - -’)
Day 2 : XHTML+CSS to WordPress theme
วันนี้พวกผมขนของกันมาด้วยครับ มาถึงร้านแต่เช้า 9 โมง ชั้นบนซึ่งเป็นสถานที่เรียนสุดแสนกว้างขวาง
เปิดให้บริการ 10.30 น. ครับ ผมจึงนั่งคุยปัญหา ขณะทำงาน ให้พี่เม่นฟัง แลกเปลี่ยนและลองทำ
ไซต์เพื่อไปประกอบเป็นธีม WordPress ขณะรอไปพลางๆ ทำงานไปด้วย กินกาแฟกันไปด้วย
(ถือโอกาสขอบคุณพี่เม่นค่ากาแฟด้วยนะครับ ทุกมื้อเลย T T)
กินเวลาไปอยู่นาน กับเรื่อง CSS ครับ เราทำเราเจอปัญหามากมาย ซึ่งตอนนี้คือเราจะต้องทำโครง
สร้างที่เป็น XHTML+CSS เพื่อมารองรับตัวแปร ค่าต่างๆในการทำเป็นธีม WordPress ครับ
เมื่อได้ไฟล์ที่เรานำไปทำเป็น XHTML+CSS เราก็จัดการนำค่าตัวแปรต่างๆ ไปใส่ในธีม WordPress
โดยพี่เม่นได้อธิบายโครงสร้างของธีม 1 ธีม การประยุกต์ใช้ต่างๆ เรียกว่าครบเครื่อง นำไปต่อยอด
ได้เลยครับ โดยทางเราก็หวังว่าเราจะขยัน และลุกขึ้นมาธีมกัน 5555
เรียกว่าเป็นประสบการณ์ที่ดีของพวกเราที่ได้ลองทำจริง เรียนรู้จริง กับพี่เม่นเทพเฉพาะทางทางด้าน
นี้โดยตรงครับ การเรียนครั้งนี้ทำให้เราได้เจอปัญหาจริง ลองทำงานจริงๆ เพื่อที่จะทำให้เรามาใช้
ประยุกต์ได้ และคำแนะนำ case study ต่างๆ ทำให้ 2 วัน สามารถเรียนวิธีเนรมิตธีม WordPress
ด้วย CSS+XHTML ได้อย่างเหลือเชื่ออออ !! (ผมท้าพิสูจน์)
สำหรับใครที่อยากเรียนกับพี่เม่นคอร์สลักษณะเดียวกันนี้สามารถติดตามได้จากเว็บไซต์ที่พี่เม่น
ไปเป็นวิทยากรอบรมให้กับบริษัท Marvelic ก็ติดตามได้นะครับ หรือจะทางบล็อกของพี่เม่นก็ได้ครับ
อ่านบล็อกของเพื่อนๆ ที่พูดถึง #iMennworkshop
- Workshop : CSS+XHTML and WordPress Themes By @iMenn โดย @iBankstory
- ไปเรียน XHTML+CSS+Wordpress Theme กับ @iMenn โดย @LifeZ
Tags: class, css, imenn, wordpress, xhtml











inatmon
12 พฤษภาคม 2010, 2:47 am
อยากเรียน..แต่ขาดปัจจัยหลายๆอย่าง มากๆ - -”
iMenn
12 พฤษภาคม 2010, 2:48 am
จ๊ากกก พี่ไม่ได้จ้างโฆษณาน้าาาา
ขอบคุณน้องๆ เช่นกัน และขออภัยที่เรื่องสถานที่ยังไม่สะดวกมากนัก เลยทำให้เสียเวลาบางอย่างไป ทั้งย้ายที่และเรื่องอินเตอร์เน็ทความเร็วสูงๆ ต่ำๆ - -”
อยากให้ทำกับรูปแบบอื่นๆ ดูนะครับ แล้วเจอปัญหาจะได้มาช่วยกันแก้ จะถามที่เว็บพี่หรือที่ WordPress.in.th ก็ได้นะครับ
BieKuB
12 พฤษภาคม 2010, 5:47 am
โอ้ว…คิดถึงร้านบ้านไร่กาแฟจังเลยครับ ~
ToT
Gotta
12 พฤษภาคม 2010, 11:44 am
อยากเรียน ยิ่งไม่เซียนเลยเนี่ย
ปล. เฟรม นี่เป็นครั้งแรกๆ จริงๆ พี่เห็นเฟรมรั่ว 5555+
(หรือรั่วก่อนแล้ว? :P)
ปล.2 หน้าเฟรมตอนคีบปลา แบ๊วไปไหน? lolz
ปล.3 NB พี่เค้า อาการหนักใช่ย่อย - -”
Lifez
12 พฤษภาคม 2010, 12:28 pm
มายืมแนวคิด กับรูปไปใช้นะครับ ^_^
TogetherWay.Com
12 พฤษภาคม 2010, 7:07 pm
อยากเรียนง่า..
เคาะ Macbook ได้เจ๋งมาก
มี แงะ ออกมาก่อนด้วย 55
uๅeวี
12 พฤษภาคม 2010, 8:23 pm
อะไรไม่ฮาเท่าตอนที่ไหว้พระกับพี่เม่นเคาะเรียก Mac ละ 55+
Mekz
12 พฤษภาคม 2010, 10:26 pm
น่าไปจังเลยๆๆๆๆๆๆ
เสียดายๆๆๆๆ (งืมงำๆ)
iBankstory
12 พฤษภาคม 2010, 11:43 pm
ฮ่าๆ วันนี้ได้เข้ามาอ่านเต็มๆ เพราะว่า net เล่นไม่ได้หลายวัน
ประทับใจจริงๆ ได้เจอเด็กเก่งๆเนี้ยยยยย นับถือในความเป็นผู้นำอย่างมาก
สู้ต่อไปเรื่อยๆนะ (ปล.ขอโต๊ดก๊าบบบที่ลืมใส่ชื่อ ใน My Blog)
Framekung
13 พฤษภาคม 2010, 1:16 am
@ inatmon:
เอาไว้โอกาสหน้า หรือลองทำเอง สงสัยก็ลองมาพูดคุยกันได้นะครับ
ผมเองจะได้ไม่ลืมด้วย - -”
@ iMenn:
ยังไงก็ขอการันตีในความสามารถด้านการถ่ายทอดของพี่เม่นนะครับ
เป็นกำลังใจ และติดตามผลงานใหม่ๆต่อไปครับ (:
@ BieKuB:
คิดถึงเหมือนกันฮ้าฟฟ กาแฟเค้าแหล่มดีนะ มันเข้มข้น (เกิน)
@ Gotta:
ครับไปที่นั่นรั่วเยอะครับ 555
@ Lifez:
ครับผม
@ TogetherWay.Com:
จริงๆแล้วพี่ก็ชวนเรานะ แต่เราไม่สะดวก อิอิ พลาดแล้วๆ
@ uๅeวี:
เท่ห์มากครับ มีครั้งนึงเครื่องดับ เคาะๆ เขย่าๆ แล้วเครื่องเปิดนี่ เทพจริงๆ ^^
@ Mekz:
ฮ่าๆ เอาเป็นว่าน้องเมษเมพอยู่แล้ว สงสัยตรงไหน ช่วยได้จะช่วยนะครับ ^^
@ iBankstory:
ขอบคุณมากครับพี่ เขียนไว้ดี ละเอียด ยาวมาก (ได้ดูรูปจากมุมมองใหม่ๆด้วย
อ่านของน้องฟักแล้ว เหมือนอ่านบล็อกตัวเองอยู่ 555 ) ขอบคุณมากครับ
ที่เห็นเฟรมในมุมมองนั้น (แต่กินเยอะนี่ไม่ใช่ตัวตนที่แท้จริงนะ)
นายอาร์ม
13 พฤษภาคม 2010, 6:58 pm
555 ไ้หว้พระ
มันเตรียมการมาดีจริงๆ
NaiTan
26 มิถุนายน 2010, 1:59 pm
โอ้โห้ลงทุนไปเรียนกันถึงที่กรุงเตพเลย แถมยังเรียนกับคนเทพๆด้วย ขยันเรียนรู้ดีครับ ช่วงนี้ไม่ค่อยได้ศึกษาหาความรู้อะไรพวกนี้เพิ่มเติมเลย เทอมนี้เยอะ 7 วันไม่มีวันหยุด
turn
22 กรกฎาคม 2010, 5:15 pm
สุดยอด นับถือความสามารถเเละขยันจริงๆครับ
เเบบอย่างที่ดี
สู้ๆครับ
ติดตามผลงานตลอด
teamofze
28 กรกฎาคม 2010, 1:57 pm
อ๊าก!!! อยากเรียนๆ
พ่อปัน ปัน
5 สิงหาคม 2010, 9:45 pm
เด็กสมัยนี้มีโอกาศเยอะครับ…พ่อปัน ปัน ขอสนุบสนุนอีกคน
และอีกอย่างก็เป็น “หลานย่าโม” เหมือนกันครับ
JoeKung
7 สิงหาคม 2010, 3:24 am
เห็นแล้วอยากไปเรียนด้วยจังเลย d^_^b”