การสร้างเว็บไซต์ด้วย
1
เนื้อหา >>
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
Part 3 : สร้างเนื้อหา (Posts)
Part 1 : แนะน าเกี่ยวกับ WordPress
Part 4 : สร้างเพจและเมนู (Pages & Menus)
Part 5 : ติดตั้งและปรับแต่งธีม (Theme)
Part 6 : เพ่ิมลูกเล่นและติดตั้งปลั๊กอิน (Widgets & Plugins)
Part 7 : อัพโหลดขึ้นโฮสจริง
2
WordPress เป็น CMS (Content Management System)เหมาะส าหรับสร้างเว็บไซต์ ท าบล็อก พัฒนาโดยใช้ภาษา PHP ใช้งานร่วมกับฐานขอ้มูล MySQL
Part 1 : แนะน าเกี่ยวกับ WordPress
3
1. เป็น CMS แบบ OpenSource ประหยัดค่าใช้จ่าย2. ปรับแต่งธีม (Theme) ได้ง่ายและมีให้เลือกเยอะ3. มีฟังก์ชั่นการท างานมากมาย (Plugins/ Widgets)4. จัดการข้อมูลในเว็บไซต์ได้ง่าย5. อัพเดทง่าย
ข้อดีของ WordPress
Part 1 : แนะน าเกี่ยวกับ WordPress
4
• Bitly.com
ตัวอย่างเว็บไซต์ที่สร้างจาก WordPress
• Discovery.com
• Time.com
• Neverland.naver.jp
• Shopathome.com
Part 1 : แนะน าเกี่ยวกับ WordPress
6
วิธีการติดตั้ง WordPress และโปรแกรมที่จ าเป็นบน localhost (AppServ)
• ติดตั้ง Server จ าลอง (AppServ)
• ติดตั้ง WordPress
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
7
วิธีการติดตั้ง AppServ
1 2
3
4
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
8
Server Name: localhost
Email: ระบุอีเมล์ผู้ติดตั้ง5
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
9
ระบุรหัสผ่านให้ตรงกัน (**ควรจดบันทึก )
6
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
10
7
8
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
11
การสร้างฐานข้อมูล• เปิดเบราเซอร์ พิมพ์ URL “localhost”
• คลิกเลือก “phpMyAdmin Database Manager Version 2.10.3”
• ระบุชื่อผู้ใช้ : root
• รหัสผ่าน : *******
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
1 2
3
12
• ตั้งชื่อฐานข้อมูล จากนั้นคลิก“สร้าง”
• จะปรากฎชื่อฐานข้อมูลที่เราสร้างทางซ้ายมือ
13
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
4
5
การติดต้ัง WordPress
• คัดลอกโฟล์เดอร์ WordPress ไปวางใน Drive C:/AppServ/www
14
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
• เปิดเบราเซอร์ พิมพ์ URL “localhost/wordpress”
• เลือกภาษา
• คลิก Continue
15
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
• คลิก “Let’s go!”
16
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
• ระบุข้อมูลต่างๆ ให้ถูกต้องและครบถ้วน จากนั้นคลิกปุ่ม “Submit”และ Run the install ตามล าดับ
17
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
***
• ระบุข้อมูลต่าง ๆ ให้ครบถ้วนจากนั้นคลิก“Install WordPress”
18
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
กรณีที่ติดตั้งเสร็จเรียบร้อยจะปรากฎข้อความ “Success!”จากนั้น คลิก“Log in”
19
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
• Log in เพื่อเข้าสู่หน้าการจัดการเว็บไซต์
20
Part 2 : ติดตั้ง WordPress และโปรแกรมที่จ าเป็น
สร้างเนื้อหา (Post)
12
21
Part 3 : สร้างเนื้อหา (Post)
• คลิกเมนูบาร์ Posts
จากนั้นคลืกเลือก Add New
3
45
สร้างเนื้อหา (Post)
22
Part 3 : สร้างเนื้อหา (Post)
12
3
4
การใส่วิดีโอลงในเนื้อหา (Post)
23
Part 3 : สร้างเนื้อหา (Post)
สร้างเพจ (Pages)
24
12
• คลิกเมนูบาร์ Pages
จากนั้นคลืกเลือก Add New
Part 4 : สร้างเพจและเมนู (Pages & Menus)
25
4
3
5
Part 4 : สร้างเพจและเมนู (Pages & Menus)
สร้างเมนู (Menu)
• คลิกเมนูบาร์ Appearance
26
Part 4 : สร้างเพจและเมนู (Pages & Menus)
จากนั้นคลืกเลือก Menus
1
2
• ท่ี Menu Name ตั้งชื่อเมนู จากนั้น คลิก Create Menu
27
Part 4 : สร้างเพจและเมนู (Pages & Menus)
4 5
• ท่ี Pages ไปที่แท็บ View All คลิก Select All เพ่ือเลือกเพจทั้งหมด จากนั้น คลิก Add to Menu
28
Part 4 : สร้างเพจและเมนู (Pages & Menus)
6
7 8
• ที่ Menu Settings คลิกเครื่องหมาย / หน้า Main Header Menu จากนั้น คลิก Save Menu
ย้ายล าดับเมนูได้โดยใช้เมาส์เลื่อนขึ้น-ลงตามต้องการ
29
Part 4 : สร้างเพจและเมนู (Pages & Menus)
9
10
ติดตั้งธีม (Theme)
1. Add New Theme
2. Upload Theme
3. น าธีมที่ดาวน์โหลดวางในต าแหน่งของโฟลเดอร์ที่จัดเก็บธีม
30
Part 5 : ติดตั้งและปรัปแต่งธมี (Theme)
ท าได้ 3 วิธี
1. Add New Theme• ไปที่เมนูบาร์ Appearance > Themes
• เลือกธีมที่ต้องการ จากนั้น คลิก“Install”
• คลิกเลือก“Activate”
• คลิก “Add New”
31
Part 5 : ติดตั้งและปรัปแต่งธมี (Theme)
2. Upload themes…
• ไปที่เมนูบาร์ Appearance > Themes
• เลือกไฟล์ที่ต้องการ จากนั้น คลิก“Install Now”
• คลิก “Upload Theme”
• คลิกที่ “เลือกไฟล์”
• คลิก “Add New”
• คลิก“Activate” เพื่อเปิดใช้งาน
32
Part 5 : ติดตั้งและปรัปแต่งธมี (Theme)
3. น าธีมที่ดาวน์โหลดวางในต าแหน่งของโฟลเดอร์ที่จัดเก็บธีม
33
Part 5 : ติดตั้งและปรัปแต่งธมี (Theme)
34
Part 5 : ติดตั้งและปรัปแต่งธมี (Theme)
ส่วนประกอบของธีม (Theme)
• Header
• Content
• Sidebar
• Footer
35
Part 5 : ติดตั้งและปรัปแต่งธมี (Theme)
การปรับแต่งธีม
• คลิกเมนูบาร์ Appearance จากนั้นเลือก Customize
12
36
Part 5 : ติดตั้งและปรัปแต่งธมี (Theme)
• แก้ไขปรับเปลี่ยนธีมตามต้องการ จากนั้นคลิก Save & Publish
3
4
37
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
Widgets คือเครื่องมือเพิ่มความสวยงามให้กับเว็บไซต์ จะฝังอยู่ใน Sidebar หรือ Footer
38
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
การเพ่ิมลูกเล่น (Widgets)
• คลิกเมนูบาร์ Appearance จากนั้นเลือก Widgets
12
39
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
• เลือก Widgets และต าแหน่งที่ต้องการจัดวาง จากนั้น คลิก Add Widgets
3
4
5
40
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
ปลั๊กอิน (Plugin) คือเครื่องมือเสริมความสามารถในแต่ละด้านให้กับ WordPress
41
การติดตั้งปลั๊กอิน (Plugin) ท าได้ 2 วิธี
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
วิธีที่ 1 : Add New
วิธีที่ 2 : Upload Plugin
42
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
วิธีที่ 1 : Add New
• คลิกเมนูบาร์ Plugins จากนั้นเลือก Add New
12
43
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
• เลือกปลั๊กอินที่ต้องการติดตั้ง จากนั้น คลิก Install Now
3
• คลิก Activate Plugins เพ่ือเปิดใช้งาน
44
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
วิธีที่ 2 : Upload File
• คลิกเมนูบาร์ Plugins จากนั้นเลือก Add New
12
45
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
• คลิก Upload Plugin
46
Part 6 : เพิ่มลูกเล่นและตดิตั้งปลั๊กอิน (Widgets & Plugins)
• เลือกไฟล์ปลั๊กอินที่ต้องการติดตั้ง (.zip) จากนั้น คลิก Install Now
• Activate Plugins เพ่ือเปิดใช้งาน
47
Part 7 : อัพโหลดขึ้นโฮสจริง
• Export Database จาก phpMyAdmin
ขั้นตอนการอัพโหลด
• สร้างและ Import Database ลงบนโฮส
• อัพโหลดไฟล์ WordPress
• แก้ไขไฟล์ wp-config.php ให้ถูกต้อง
• เปิด permission โฟล์เดอร์ wp-content/uploads เป็น 777
48
ธัชชา นามนนท์[email protected]
Tel.02-470-8239
ปัญจลักษณ์ ธาดาวุธ[email protected]
Tel.02-470-9692
สอบถามข้อมูลเพิ่มเติม >>