Wordpress Theme Baby to Ninja

wave
Wordpress Theme Baby to Ninja

Chapter 1 - หลักการออกแบบ

เตรียมเครื่องมือ ตัวอย่าง
Photoshop Baby to Ninja เครื่องมือที่เราจะใช้คือ ตามชื่อเลย Photoshop CC 2014 ซึ่งเป็นเวอร์ชั่นล่าสุดตัวนี้จะเป็นโปรแกรมในรูปแบบของ Creative Cloud ซึ่งมีค่าบริการรายเดือน ๆ 300 บาท มาพร้อมกับ Adobe Light Room 300 บาท จะได้ทั้ง 2 โปรแกรมนี้ ใช้งานแบบถูกลิขสิทธิ์ สำหรับ Photoshop ผู้เรียนคงรู้แล้วเพรา...

5:53

สอนใช้งาน brackets.io ตัวอย่าง
สอนใช้งาน brackets.io ตัวนี้จะเป็น code editor หรือที่เรามักจะเรียกกันว่า text editor นั้นเอง ก่อนอื่นเลยสร้าง folder project ไว้ชื่อ html จะสร้างที่ีไหนก็ได้ จากนั้นก็ทำการเปิด brackets ขึ้นมา จากนั้นผมจะลาก Folder html เข้ามายัง ซ้ายของ panels brackets จะติดตั้ง plug-in ก่อนอื่นจะ New flie index.h...

11:00

สอนใช้ photoshop cc 2014 เบื้องต้น ตัวอย่าง
หลังจากที่เราได้ทดลองใช้งานตัว brackets.io แล้วใน VDO นี้ เราจะมาทำการเรียนรู้ สอนใช้ photoshop cc 2014 เบื้องต้น เปิดโปรแกรมขึ้นมาเลย เดี๋ยวผมจะอธิบายเมนูและการใช้งานอย่างคร่าวๆใน VDO นี้ คำสั่ง File จะเป็นส่วนของ จัดการเอกสารต่างๆที่อยู่ project นี้ แล้วจะมีส่วนของการ Save for Web การ Extract Ass...

14:28

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

9:37

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

9:44

แนะนำเรื่องโครงร่าง หรือ Wireframing
Wire framing หลังจากที่เราได้รู้จักกับทฤษฎีและหลักกการในการออกแบบ การใช้สี การรูปภาพ ตัวอักษร ช่องว่างหรือ white Space ทำไมเราต้องมีเรื่องของการออกแบบเว็บไซต์ การที่เราจะออกแบบเว็บไซต์ต้องมีแบบร่างขึ้นมาก่อน เพื่อเป็นต้นแบบหรือแนวทาง ต่อไปในส่วนของการทำ box up หรือ prototype ในเรื่องของ box up หรือ...

2:38

หลักการเลือกใช้รูปภาพประกอบ
ในหัวข้อนี้จะเป็นการเลือกใช้ภาพในงานออกแบบ การเลือกใช้ภาพในงานออกแบบก็เป็นเรื่องสำคัญ เพราะว่าเวลามีคนเข้ามาดูผลงานของเรา ประเภทเว็บไซต์หรือ portfolio ดึงดูดให้คนเข้ามาดูงานของเราได้ด้วย 3-5 วิแรก การสร้าง first impression ให้กับ User ที่เข้ามาชมเว็บไซต์เรา ตัวแรก Monochromatic Style เป็นภาพของสีโทน...

5:03

Chapter 2 - การออกแบบโครงร่างเว็บไซต์

ออกแบบโครงร่าง service
การออกแบบโครงร่างหน้า Service

4:50

ออกแบบโครงร่าง portfolio
ออกแบบโครงร่างหน้า Portfolio

3:50

ออกแบบโครงร่าง archive
ออกแบบหน้า Archive

6:53

ออกแบบโครงร่าง contact
ออกแบบโครงร่างหน้า Contact

3:28

ออกแบบโครงร่าง search
ออกแบบโครงร่างหน้า Search

3:02

ออกแบบโครงร่าง 404
ออกแบบโครงร่างหน้า 404

5:16

ออกแบบโครงร่าง index
ออกแบบโครงร่าง index

41:06

ออกแบบโครงร่าง about
ออกแบบโครงร่าง about

39:7

Chapter 3 - การออกแบบเว็บไซต์จริง

ออกแบบ Contact Page
ออกแบบ Contact Page

12:37

ออกแบบ Service Page
การออกแบบ Service Page

7:17

ออกแบบ Portfolio Page
การออกแบบ Portfolio Page

6:49

ออกแบบ Archive Page
การออกแบบ Archive Page

17:49

ออกแบบ Search Page
การออกแบบ Search Page

5:06

ออกแบบ About US
การออกแบบ About US

7:55

Chapter 4 - พื้นฐานการเขียนเว็บไซต์

พื้นฐาน jQuery Travelsing and Filtering
พื้นฐาน jQuery Travelsing and Filtering

27:11

พื้นฐาน jQuery Expanding on()
พื้นฐาน jQuery Expanding on()

9:38

พื้นฐาน jQuery KeyBoard Events
พื้นฐาน jQuery KeyBoard Events

14:49

พื้นฐาน jQuery Link layover
พื้นฐาน jQuery Link layover

7:04

พื้นฐาน jQuery Taming CSS
พื้นฐาน jQuery Taming CSS

9:34

พื้นฐาน Jquery Animation
พื้นฐาน Jquery Animation

10:58

แนะนำ Bootstrap 3
แนะนำ Bootstrap 3

5:28

Chapter 5 - การแปลงไฟล์ PSD เป็น HTML

แปลงไฟล์ Portfolio
แปลงไฟล์ Portfolio

10:33

แปลงไฟล์ Service
แปลงไฟล์ Service

4:46

แปลงไฟล์ Archive ตอนที่ 1 ส่วน Blog List
แปลงไฟล์ Archive ตอนที่ 1 ส่วน Blog List

29:44

แปลงไฟล์ Archieve ตอนที่ 2 ส่วน Side bar
แปลงไฟล์ Archieve ตอนที่ 2 ส่วน Side bar

22:03

แปลงไฟล์ Search
แปลงไฟล์ Search

10:43

แปลงไฟล์ 404 page
แปลงไฟล์ 404 page

21:47

Chapter 1 - พื้นฐานการสร้าง WordPress Theme

Chapter 2 - WordPress Theme Workshop

ในหัวข้อนี้ผมจะมาเสนอหลักสูตรสอนเขียน WordPress Theme ในขั้น Advanced ครับ แต่อย่าพึ่งตกใจไปครับ ถึงผมจะบอกว่า Advanced ผมไม่ปล่อยให้ผู้เรียนเผชิญชะตากรรมในขณะเรียนแน่นอนครับ ในคอร์สนี้ผมได้รวบรวมองค์ความรู้ที่จำเป็นทั้งหมดมาให้ผู้เรียนแล้วครับ ไม่ว่าจะเป็นเรื่องของการออกแบบโดยจะสอนตั้งแต่เรื่องของหลักการการออกแบบ ทฤษฎีของสี การจัดการเรื่อง White Space และรวมไปถึงการออกแบบเทมเพลตเว็บไซต์ด้วยโปรแกรม Photoshop CC 2014 และ 2015 ซึ่งเป็นเวอร์ชั่นล่าสุดในขณะนี้ หลังจากที่เราออกแบบเสร็จเรียบร้อย ผมก็จะพาผู้เรียนไปทำความรู้จักการเขียนเว็บไซต์ขั้นพื้นฐาน โดยที่ผมจะปูพื้นความรู้ให้ทั้งหมดไม่ว่าจะเป็น Html, CSS, CSS3, JavaScript, Jquery และ Bootstrap 3 ที่จำเป็นต้องใช้ในการแปลงไฟล์จาก PSD เป็น HTML Template เพื่อใช้ในการแปลงเป็น WordPress Theme ต่อไปครับ ในบทสุดท้ายจะเป็นเรื่องของ WordPress Theme เพียวๆเลยครับ แต่ผมจะแบ่งออกเป็น 2 ส่วนเพื่อให้ผู้เรียนสามารถกลับมาทบทวนได้ง่ายๆครับในส่วนแรกผมจะแบ่งออกเป็นพื้นฐานของ WordPress Theme ครับโดยที่ผมได้แบ่งออกเป็นหัวข้อย่อยๆไว้แล้ว และหลังจากที่จบพื้นฐานแล้วเราจะนำความรู้ทั้งหมดมาใช้เพื่อประยุกต์เป็น WordPress Theme ครับส่วนเรื่องเด่นๆ ที่ผมนำมาใส่ไว้ในคอร์สของ WordPress Theme นั้นก็จะมีพวกการ Hooks ครับและการทำให้ Theme ของเรา Support กับปลักอิน Ecommerce ยอดนิยมอย่าง WooCommerce แค่นี้ยังไม่พอครับ ผมยังได้สอนถึงการ Hooks และ Overrides เจ้าตัว WooCommerce อีกด้วย

ข้อมูลหลักสูตร
  • ลงทะเบียน 1
  • เพิ่มเมื่อ 17 ธ.ค. 2015
  • ปรับปรุงเมื่อ 17 ธ.ค. 2015
  • หมวดหมู่ Web Design
ข้อมูลผู้บรรยาย
naphapat kongoon

naphapat kongoon

สมาชิกเมื่อ: 22 พ.ย. 2013 15:55:26

Thapwaris Chinsirirathkul

Thapwaris Chinsirirathkul

สมาชิกเมื่อ: 25 ก.พ. 2014 19:49:37

คอร์สเรียนที่น่าสนใจในหมวดหมู่ Web Design

เขียน Responsive Website ด้วย Bootstrap 3

เขียน Responsive Website ด้วย Bootstrap 3

147 บทเรียน 8 ชั่วโมง 34 นาที
7

Bootstrap 3 เป็น front end framework ในการออกแบบหน้าเว็บ คอร์สนี้จะทำให้ผู้เรียนเข้าใจภาพรวมของ fram...

สร้างเว็บไซต์ด้วย DREAMWEAVER CC สไตล์ BOOTSTRAP3

สร้างเว็บไซต์ด้วย DREAMWEAVER CC สไตล์ BOOTSTRAP3

6 บทเรียน 0 ชั่วโมง 38 นาที
682

สร้างเว็บไซต์ด้วย DREAMWEAVER CC สไตล์ BOOTSTRAP3

สร้างคอร์สเรียนของคุณ

เรามี 45 คอร์สเรียน เพิ่มคอร์สเรียนของคุณเพิ่อรับรายได้แบบไม่จำกัด และเผยแพร่องค์ความรู้ของคุณกับคอร์สการเรียนรู้ออนไลน์ที่ทุกๆ คนสามารถเข้าถึงได้ทุกที่ทุกเวลา

สร้างคอร์สเรียน