basic wordpress¸„ู่มือwordpress.pdf · 2018-04-09 · basic wordpress...
TRANSCRIPT
Basic WordPress
สรางเวบไซตดวย WordPress “มเวบไซตงายๆในไมกขนตอน”
พงษศธร เชดสม www.naygho.org
2
ความรพนฐานกอนการท าเวบ
โฮมเพจ (Home Page)
หนาแรกของเวบไซต ซงเวบเพจทกๆ หนาของเวบไซทจะถกเชอมโยงมาจากโฮมเพจ
บางครงผใชเขาใจค าวาโฮมเพจหมายถงเวบไซททงหมด แตความจรงแลวโฮมเพจหมายถงหนา
แรกเทานน โดย ถาเปรยบกบหนงสอ โฮมเพจกเปนเสมอนหนาปกหรอสารบญซงจะเปน การ
แสดงใหเหนวาในเวบไซตของเรานนมอะไรบาง ผพฒนาเวบไซตจงตองออกแบบใหสวยงามและ
นาสนใจใหมากทสด
3
เวบเพจ (Web Page)
หนาเวบแตละหนาทแสดงขอมลตางๆ โดยปกตแลวจะถกสรางใหอยในรปแบบไฟล HTML
(Hyper Text Markup Language) โดยไฟล HTML 1 ไฟลกคอเวบเพจ 1 หนา ซงภายใน
เวบเพจอาจประกอบไปดวยขอความ ภาพ เสยง วดโอ และภาพเคลอนไหวแบบมลตมเดย ซง
นอกจากเวบเพจในแตละหนาจะมการแสดงขอมลตางๆแลวยงสามารถ เชอมโยงกนในแตละหนา
เพอใหผชมเวบไซตนนเรยกดเอกสารหนาอนๆ ทเกยวของไดสะดวกและรวดเรวอกดวย
เวบไซต (Website)
เวบเพจหลายๆ หนารวมถงหนา
โฮมเพจดวยทแสดงขอมลทงหมด
และเชอมโยงกน โดยน าเสนอ
ขอมลผานคอมพวเตอร ถกจดเกบ
ไ ว ใ น เ ว ล ด ไ ว ด เ ว บ เ ว บ ไ ซ ต
โดยทวไปจะใหบรการตอผใชฟร
แตในขณะเดยวกนบางเวบไซตจ าเปนตองมการสมครสมาชก และเสยคาบรการเพอทจะดขอมล
ในเวบไซตนน ซงไดแกขอมลทางวชาการ ขอมลตลาดหลกทรพย หรอขอมล
4
โดเมนเนม (Domain Name)
ชอทใชระบลงในคอมพวเตอร เพอไปคนหาในระบบ โดเมนเนมซสเทม เพอระบถง ไอพ
แอดเดรส ของชอนนๆ เปนชอทผจดทะเบยนระบใหกบผใชเพอเขามายงเวบไซตของตน บางครง
เราอาจจะใช "ทอยเวบไซต" แทนกได มทงแบบเสยคาเชารายปและแบบฟร
โดเมนเนม หรอ ชอโดเมน เปนชอทตงขนเพอใหงายตอการจดจ า เนองจากไอพแอดเดรสนน
จดจ าไดยากกวา และเมอการเปลยนแปลงไอพแอดเดรส ผใชไมจ าเปนตองรบรหรอจดจ าไอพ
แอดเดรสใหม ยงคงใชโดเมนเนมเดมไดตอไป อกขระทจะใชในการตงชอโดเมนเนม ไดแก
ตวอกษรภาษาองกฤษ ตวเลข และ "-" คนดวย "."โดยปกต จะขนตนดวยตวอกษร และลงทายดวย
ตวอกษรหรอตวเลข มความยาวตงแต 1 ถง 63 ตวอกษร ตวอกษรตวใหญ A - Z หรอตวอกษรตว
เลก ถอวาเหมอนกน 1 ไอพแอดเดรส สามารถใชโดเมนเนมไดมากกวา 1 โดเมนเนม และหลายๆ
โดเมนเนมอาจจะใชไอพแอดเดรสเดยวกนได เชน www.naygho.org
เวบโฮสตง(Web Hosting)
รปแบบการใหบรการส าหรบผใชอนเทอรเนต อยางหนง ซงผใชงานนนมความตองทจะ
ฝากเวบไซตของตนเองไว กบผใหบรการเซฟเวอร (HSP: Hosting Service Provider) เพอให
5
เวบไซต ของตนเองนน ออนไลนอยบนโลกอนเทอรเนตตลอด 24 ชม. โดยททางผ ใหบรการจะจดเกบขอมลเวบไซต ฐานขอมล อเมล ฯลฯ ไวในเครองเซฟเวอรหรอทเรยกกนวาเวบเซฟเว อร (Web Server) ซงเวบเซฟเวอรจะท าหนาท เปนสอกลางทจะแสดงผลหนาเวบไซตใหกบผทองอนเทอรเนตทวไป ไดเชาชมผานโดเมนเนมไดตลอดเวลา WordPress คออะไร
WordPress เปน open source web software ทเราสามารถตดตงบนเวบ server ของ
เราเพอสรางเวบไซต, blog หรอ community ตอนเรมแรก WordPress เปนเครองมอไวส าหรบสราง blog แตไดรบการพฒนามาเรอย ๆ จนสามารถสรางเปนเวบไซต หรอ เวบ community ไดแลว โดยมระบบจดการบทความ หรอ Content Management System (CMS) เชน joomla, simple machines, open cart, magento เปนตน ท าใหงายตอการใชงาน ซง WordPress สรางขนโดย Matt Mullenweg และ Mike Little ในป 2003 นบวามการพฒนามาถง 9 ปแลว
6
เวบไซตจะออนไลนไดมสวนประกอบอะไรบาง?
Domain Name >> คมอเลมนจะพาท าโดยใช sub domain ฟรจากเวบwww.hostinger.in.th Web Hosting >> คมอเลมนจะพาท าโดยใช sub domain ฟรจากเวบwww.hostinger.in.th File Website >> คมอเลมนจะพาท าโดยใช WordPress
สงทผออกแบบเวบไซตจ าเปนตองเตรยมกอนการออกแบบจรง บทความจาก (http://www.superwebsite.com/th/tips/view/4-ความรพนฐานเกยวกบการสรางเวบไซต)
ขนตอนการพฒนาเวบไซต การออกแบบเวบไซตใหมขอมลและรายละเอยดทครบถวนและครอบคลมกบความตองการ เวบไซตมความสวยงาม อกทงงายตอการดและปรบเปลยนขอมลในภายหลงนน ควรมการวางแผนในการพฒนาเวบไซตทด ซงพอสรปขนตอนไดดงนคอ
▪ ก าหนดวตถประสงคของเวบไซต การพฒนาเวบไซต ควรเรมจากการก าหนดวตถประสงคใหเหนภาพชดเจนวาตองการน าเสนอหรอตองการใหเกดผลอะไร เมอทราบวตถประสงคแลวกจะสามารถก าหนดรายละเอยดอนๆ ทเกยวของได เชนลกษณะหนาตาและสสนของเวบเพจ
7
▪ ก าหนดกลมผชมเปาหมาย เมอทราบวตถประสงคของการพฒนาเวบไซตแลว ขนตอนตอมาจะเปนการก าหนดกลมผชมเปาหมายทจะเขาชมและใชบรการเวบไซตน เพอออกแบบเวบไซตใหตอบสนองความตองการของคนกลมนมากทสด ไมวาจะเปนการเลอกเนอหา โทนส กราฟก และเทคโนโลยทน ามาสนบสนนการสรางเวบไซต
▪ เตรยมแหลงขอมล เนอหาหรอขอมลนบเปนสาระส าคญของการสรางเวบไซต ดงนนผออกแบบเวบไซตจงจ าเปนทจะตองรวาตองน าขอมลจากแหลงใดบาง เพอใหขอมลบนเวบไซตสมบรณทสด
เนอหาทควรมในเวบไซต การศกษาตวอยางจากเวบไซตทวไป จะชวยใหเรามองเหนวาในเวบไซตของเราควรม
เนอหาอะไรบาง อยางไรกตามเนอหาตาง ๆ บนเวบไซตนนไมมขอก าหนดทเปนมาตรฐานตายตว แตขนอยกบสงทจะน าเสนอและจดเดนทเราตองการใหม ซงจะท าใหรายละเอยดปลกยอยของแตละเวบไซตแตกตางกนออกไป แตหลก ๆ ส าคญแลว พอสรปไดวาขอมลพนฐานทควรมในเวบไซตควรประกอบดวย
▪ ขอมลเกยวกบบรษท องคกร หรอผจดท า (About Us) คอขอมลเกยวกบเจาของเวบไซต เพอบอกใหผชมรวาเราเปนใคร มาจากไหน และตองการน าเสนออะไร เชน วตถประสงคของเวบไซต ประวตความเปนมา สถานทตงของหนวยงาน เปนตน
▪ รายละเอยดของผลตภณฑหรอบรการ (Product/Service Information) คอขอมลหลกทเราน าเสนอในเวบไซต ซงหากเปนเวบไซตทางธรกจ ผเขาชมอาจตองการรรายละเอยดของผลตภณฑหรอบรการในเวบไซตของเรา เพอประกอบการตดสนใจในการซอสนคาหรอบรการ แตหากเปนเวบไซตทใหความร สวนนกอาจจะประกอบดวยบทความ ภาพกราฟก มลตมเดย และการเชอมโยงไปยงเวบไซตอนเพอใหไดขอมลเพมเตม
▪ ขาวสาร (News / Press Release) อาจเปนขาวสารทตองการสงถงบคคลทวไปหรอสมาชก เพอใหรบรความเคลอนไหวเกยวกบบรษทหรอเวบไซตของเรา เชนการเปดตวสนคาบรการใหม ๆ โปรโมชนสนคาประจ าเดอน หรอกจกรรมตาง ๆ ทเกดขน
▪ ค าถามค าตอบ (Frequently Asked Question) ค าถามค าตอบมความจ าเปน เพราะผเขาชมบางสวนอาจไมเขาใจขอมลหรอมปญหาทตองการสอบถาม การตดตอทางอเมลหรอชองทางอน แมวาจะท าไดแตเสยเวลา ดงนนเราควรคาดการณหรอรวบรวมค าถามทเคย
8
ตอบไปแลวใสไวในเวบเพจ ซงผเขาชมทสงสยจะสามารถเปดดไดทนท นอกจากน อาจมเวบบอรดส าหรบใหผดแลเวบไซตคอยตอบค าถาม รวมทงอาจเปดใหผเขาชมดวยกนกได
▪ ขอมลในการตดตอ (Contact Information) เพอใหผเขาชมเวบไซตของเราทเกดขอสงสย หรอตองการสอบถามขอมลเพมเตม สามารถตดตอกบเราได ควรจะระบอเมลแอดเดรส (E-mail Address) ทอย เบอรโทรศพท ทตดตอไดไว ดวย รวมทงอาจมแผนทส าหรบลกคาทตองการตดตอโดยตรง
สวนประกอบของหนาเวบเพจ โดยทวไปแลว หนาเวบเพจจะแบงออกเปนสวนหลก ๆ ดงนคอ
▪ สวนหว (Page Header) อยตอนบนสดของหนาเวบเพจ เปนบรเวณทส าคญทสด เนองจากผเขาเยยมชมเวบไซตจะมองเหนกอนบรเวณอน สวนใหญนยมใชวางโลโก ชอเวบไซต ปายโฆษณา ลงคส าหรบการตดตอ หรอลงคทส าคญ และระบบน าทาง
▪ สวนเนอหา (Page Body) อยตอนกลางหนา ใชแสดงเนอหาภายในเวบเพจซงอาจประกอบไปดวยขอความ ภาพกราฟก ตารางขอมล และอน ๆ บางครงเมนหลกหรอเมนเฉพาะกลม อาจอยในสวนนกได โดยมกวางไวดานซายมอสด เนองจากผเขาชมจะมองเหนไดงาย
▪ สวนทาย (Page Footer) อยดานลางสดของหนาเวบเพจ สวนใหญจะนยมใชวางระบบน าทางภายในเวบไซตแบบทเปนลงคขอความงาย ๆ นอกจากนกอาจจะมชอของเจาของเวบไซต ขอความแสดงลขสทธ และอเมลแอดเดรส (E-mail Address) ของผดแลเวบไซต
▪ แถบขาง (Side Bar) ปจจบนจะนยมออกแบบดานขางของหนาเวบเพจใหนาสนใจ เพอใชวางปายแบนเนอร หรอลงคแนะน าเกยวกบบรการของเวบไซต เปน
9
1. สมคร hosting , domain ขนตอนแรกท าการสมครสมาชกเพอขอพนทฝากไฟลเวบไซต (hosting) และรวมไปถงการ
ขอโดเมนเนม (Domain)
1 ใหเขาไปทเวบไซต www.hostinger.in.th
2 คลกเลอกในแทป Web Hosting > Free แลวกดทปมสงซอ
10
3 กรอกขอมลเพอท าการสรางบญชใหม ใสขอมลตามทเวบไซตก าหนดสามารถสมครโดย
ใช Account facebook และ google ในการสมครกได ในทนจะสมครโดยการกรอก
ขอมลพนฐานทเวบไซตก าหนด ใสเรยบรอยใหกดสรางบญช
4 สรางบญชเรยบรอยใหไปท e-mail เพอท าการยนยนการสมครสมาชก
11
5 เวบไซตทเราท าการสมครสมาชกไวจะสง e-mail ใหสองฉบบ จากนนใหเราคลกลงคท
ทางเวบไซตสงมาให กเปนการเรยบรอยในการยนยนการสมครสมาชก
6 เลอกโฮสตงแพกเกจ ในทนใหเลอกเปน Free คณสมบตโฮสตงฟรทเราจะได พนท 2000 MB
100 GB แบนวธ
2 MySQL Databases
2 บญชอเมลล
Website Builder
Script Autoinstaller
12
7 จากนนใหใสโดเมนและรหสผาน
-เลอกประเภทโดเมน ใหเลอกเปนโดนเมนยอย
-โดเมนยอย ใหใสตามทเราตองการ และจะมโดนเมนหลกใหเราเลอก แนะน าใหเลอก
ตวทสนๆ เพองายตอการจดจ า จากตวอยางจะไดเปน naygho.esy.es
-รหสผาน สามารถใสไดตามทเราตองการ หรอ สามารถคลกท สราง เพอใหระบบ
สรางรหสผานใหอตโนมต
8 ยนยนการสงซอ
-ตรวจสอบขอมลวาถกตองตามทเราไดหรอกไวกอนหนาหรอเปลา
-ใส Captcha ตามภาพใหถกตอง และตกถกในชอง ฉนยอมรบ terms และเงอนไข
การใชงาน แลวกดสงซอ
13
9 จากนนระบบจะแจงวาไดท าการสรางบญชเรยบรอยแลว ใหคลกทเครองหมายบวก
หรอ คลกทชอโดเมน naygho.esy.es จากนนใหเลอกท โปรแกรมตดตงอตโนมต
10 หนาโปรแกรมตดตงอตโนมต จะมโปรแกรมใหเราเลอกมากมายในสวนนใหเราดท การ
สรางเนอหา และเลอกท Wordpress
14
2. ตดตง wordpress 1 ใสขอมลพนฐานของเวบไซต
- url : http://www.naygho.esy.es/ ……….. จะใสหรอไมใสกได ถาใสจะเปนการ
ก าหนดพาทเวบไซต ถาเราไมใสเราสามารถเขาเวบไซตของเราโดยผานโดเมนท
เราก าหนดไวไดเลย http://www.naygho.esy.es
- รหสผใชงานแอดมน จากเดมระบบจะมการก าหนดให ถาเราจะเอาตามทระบบ
ไดก าหนดไวใหกไมตองแกไขในสวนน ในทน คอ naygho
- รหสผานแอดมน ใหเราใสรหสทเราตองการ
- เวบไซต Title หมายถงชอเวบไซตของเรา และจะไปปรากฏอยทไตเตลของเวบ
บราวเซอร
- เวบไซต Tagline คอขอความ Statement สน ๆ ทระบคณลกษณะของเวบไซต
เรา
15
2 จากนนระบบจะบอกวามการตดตงเรยบรอยแลว สามารถคลกทลงคเวบเพอเขาไปด
เวบไซตของไดเลย
3. ตงคาเบองตน (config) การเขาสหนา admin สามารถเขาไดโดยเพม /wp-admin ตอทายชอเวบของเรา หรอ
http://naygho.esy.es/wp-admin จากนนระบบจะใหเราท าการอพเดตฐานขอมล
ใหท าการคลกท อปเดตฐานขอมลเวรดเพรส
16
หนาแอดมน
url : http://naygho.esy.es/wp-admin
ใสชอผใชและรหสผานตามทก าหนดไวกอนหนา
หนาควบคม เปนหนาทท าหนาทควบคมการท างานทงหมดของเวบไซต
17
1 ใหคลกท ตงคา
ตงคาทวไป
- หวขอเวบไซต
- ค าโปรย
- ทอยเวรดเพรส (URL)
- ทอยเวบไซต (URL)
- อเมล
เปนคาทถกตงคาจากการตดตงเวบไซต
หรอ จะเปลยนกสามารถเปลยนได
18
- สมครสมาชก ตกถกในชอง ใครกสามารถสมครได ถาตองการใหสามารถสมคร
สมาชกได ถาไมตองการใหสมครสามาชกใหเอาเครองหมายถกออก
- บทบาทหลกผใชใหม ใหเลอกเปนสามาชกรบขาว
- เขตเวลา ใหเบอกเปน UTC +7
- รปแบบวนท ใหเลอกตามทตองการ
- รปแบบเวลา ใหเลอกตามทตองการ
- วนทเรมของสปดาห ใหเลอกตามทตองการ ในทนเลอกเปนวนอาทตย
- ภาษาของเวบ เลอกเปนภาษาไทย
4. ตดตง theme Theme สามารถหาโหลดไดจากเวบอนๆมากมาย หรอสามารถหาไดจากในระบบควบคม
ของการท างานไดเลย
Upload theme ขนเวบไซต
1 ใหเลอกท รปแบบบลอก > เพมใหม > อพโหลด theme
19
2 ใหเลอกไฟล theme ทเราตองการโดย เลอกท Browse > ไฟลทตองการ > จากนน
คลกตดตงตอนน
3 ตดตงเรยบรอยจะมหนาตางบอกรายละเอยดตางๆ ใหกดท เปดใชงาน
5. แกไข theme 1 เขาไปท รปแบบบลอก > theme options
20
สวนของการแกไขจะแบงออกเปน 3 สวน
-main
-additional
-font
Main
Logo / avatar --- โลโกของเวบไซต
เลอกโลโกเวบไซตของเรา สามารถใสรเราได แตตองมขนาดกวาง 150 px
โดยเลอกท upload > เลอกหลายไฟล หรอ จะดงรปภาพโลโกทตองการมาวางไดเลย >
เลอก
จะไดแบบน
Logo border
Bordered & shadowed > ใสขอบของโลโก
21
No border, just image > ไมใสขอบของโลโก
Intro
Intro background
คอ สพนหลงของขอความ
Intro image background
คอ รปพนหลงของขอความ (ตองมขนาดความกวาง 740px)
Intro text
คอ ตวหนงสอ หรอขอความทเราจะใสลงไป
ผลทได
22
*แนะน าใหใสแคขอความอยางเดยว ถาใสสพนหลงกไมตองใสรปภาพ และถาเลอกเปน
รปภาพพนหลงกไมตองใสความขอความ
Resize & justify text
Resize & justify a text with Slabtext. > เปนการปรบใหขอความ เลก ใหญ ให
เมาะสมกบสวนหวของเวบ
Additional
Default post thumbnail
คอ รปภาพตวอยางของบทความ (ความกวางตองมขนาด 150px)
ใหเลอกท upload > เลอกรปทเราตองการ สามารถทดงมาไวไดเลย
23
Link color
คอ สของชอบทความ
ผลทได
Font
Font คอรปแบบตวหนงสอในเวบไซตของเรา
24
6. สราง menu เมนเปรยบเสมอนปายบอกทาง แบงออกเปน 5 ประเภท ซงแตละประเภทจะแสดงใน
ต าแหนงทแตกตางกนทงนขนอยกบ theme ทเลอกใชดงน
• Main menu เปนลกษณะเมนหลกของเวบไซตทมมาใหพรอมกบธม หรอ
เทมเพลตสวนใหญประกอบไปดวยรายการเมน เชน หนาแรก,เกยวกบเรา,
เวบบอรด
• Top menu เปนลกษณะเมนทมความส าคญนอยกวา main menu จะ
แสดงอยบนของเวบไซต
• User menu เปนชอทเกยวของกบสมาชกของเวบไซต เชน แกไข
รายละเอยดสวนตว เปนตน ซงจะแสดงผลเมอสมาชกของเวบไซตได
ลอกอนเขาสระบบของเวบไซตแลวเทานน
• Resource เปนลกษณะเมนทไมเกยวกบชอเมนอนๆ เชน เมนลงคไปยง
เวบไซตอนๆ , เมนแสดงบทความเฉพาะเจาะจง เปนตน
• Key concepts เปนลกษณะเมนทเกบรายการเมนยงบทความตางๆ ท
มอยในเวบไซตโดยตรง
การสรางเมน
25
1. .ใหเขาไปท รปแบบบลอก > เมน
2. ใหคลกท สรางเมนใหม
3. ใหใสชอเมน แลวคลกทสรางเมน
4. คลกตวเลอกทอย theme ทจะใหแสดงเมนใน theme ซงแตละ theme จะ
แสดงผลทแตกตางกน ตกท main Navigation
การลบเมน
26
ถาหากเราตองการลบเมนทไมไดใชงานแลวออกจากระบบ สามารถท าไดดงน
1. เขาไปทหนาเมน ใหคลกแทบ จดการทอย
2. คลกท แกไข ของเมนทอยของ theme ทตองการลบ
3. จะแสดงรายการโครงสรางเมนเหมอนตอนทสรางเมน ใหคลกท ลบเมน
27
4. จะแสดงหนาตางถามความยนยนการลบ ใหคลก ปมตกลง
ประเภทของรายการเมน
กอนทเราจะสรางเมนนน เราควรจะท าความรจกกบประเภทของรายการเมนกนกอน ซงม
อย 3 ประเภทดวยกน
1. หนา (page) : เปนรายการเมนทเชอโยงกบหนาเพจ (page,post)
2. ลงค (Link) : เปนการรายการเมนทเชอมโยงกบเวบไซตอนๆภายนอก
3. หมวดหม (Category) : เปนรายการเมนทดงเอาหมวดหมมาใชเปนเมน
สรางรายการเมนประเภท “หนา”
ส าหรบรายการเมนประเภท “หนา” เปนการสรางเมนลงคดง post จากหมวดหมทมใน
เวบไซต โดยมขนตอนดงน
ขนตอนท 1 การสรางเมน
1. คลกทเมน เมนในรปแบบบลอก
2. คลกท สรางเมนใหม
3. ก าหนดชอเมน ในทนคอ ทดสอบ 1
28
4. คลปปม สรางเมน
5. คลกทรายการเมนทตองการ
6. จะแสดงรายละเอยดของรายการเมนนน ใหคลกท ลบออก
7. คลกทรายการเมนทตองการแกไข
8. แกไขรายละเอยดทตองการ โดย URL คอ URL ของเวบไซต สวนปายชอเมน
คอ ชอทจะแสดงเปนรายการเมน
29
9. แดรกเมาสลากยายเมนไปยงล าดบเมนทตองการแสดงในทนล าดบแรก
10. คลกปม สรางเมน
ขนตอนท 2 การตงคาแสดงเมน
1. คลกตวเลอกทอย theme ทจะใหแสดงเมนใน theme ซงแตละ theme จะ
แสดงรายการแตกตางกน
2. คลกปม บนทกเมน
เมอเปดหนาเวบไซตจะแสดงรายการตามเมนทก าหนด ดงภาพ
30
7. Widget อานวา วดจท เปนลกษณะโปรแกรมเสรมขนาดเลกทชวยเพมประสทธภาพการท างาน
ใหกบเวบไซต เชน เครองมอแปลภาษา เปนตน หรอเปนลกษณะการดงขอมลขาวสารท
อพเดตบอยๆ จากเวบไซตอนมาแสดงผลบนเวบไซตของเรา เชน widget ราคาน ามน ,
พยากรณอากาศ, ขาว เปนตน
แนะน า widget ทนาสนใจ
แปลบทความเปนภาษาทตองการดวย GTranslate
GTranslate เปนวดจททใชส าหรบแปลบทความทงหนาเวบไซตใหเปน
ภาษาทตองการ สามารถดาวโหลดวดจทนโดยคนหาในเวบ WordPress ตามขนน
31
1. ใหเขาเวบ wordpress.com
2. คนหาทชองคนหา GTranslate
3. ท าการดาวโหลดมาเกบไวทเครอง
4. จากนนใหอพโหลดไปยงเวบไซตของเราเอง โดยไปทเมน ปลกอน > เพม
ปลกอนใหม >อพโหลดปลกอน > เลอกไฟลปลกอนทโหลดมา จากนนให
กดทเปดใชงานปลกอน
ขนตอนท 1 ก าหนดคาใหก าวดจทตวน โดยท ไปทตงคาเลอก GTranslate
ก าหนดคาตางทส าคญใหกบ GTranslate
▪ Translation : เลอกวธการแปลภาษา
▪ Default language : ก าหนดภาษาหลกของเวบ
▪ Open in new windows : ก าหนดใหแสดงธงชาตของภาษาทเลอก
▪ Show flags : ก าหนดใหแสดงธงชาตของภาษาทเลอก
▪ Flag size : เลอกขนาดของธงชาตของภาษา
▪ Flag languages : เลอกธงชาตทภาษาตองการ
▪ Shows dropdown : ก าหนดใหแสดงชอภาษาแบบรายการใหเลอก
▪ Dropdown languages : เลอกชอภาษาทจะแสดงแบบรายการใหเลอก
32
ขนตอนท 2 ก าหนดต าแหนงแสดง widget
1. คลกทเมน widgets ใน รปแบบบลอก
33
2. จะปรากฏกรอบปลกอน GTranslate ดงภาพใหแดรกเมาสลากยายกรอบ
GTranslate มาวางในดาน side area โดยแดรกเมาสลากยายต าแหนงวาง
ไดตามตองการ
3. คลกลกศรทกรอบ GTranslate เพอแสดงการตงคาวดจท
4. ทชอง title ใหก าหนดชอทแสดงหวกรอบวดจท
5. คลกทปม บนทก
34
6. เมอเปดเวบไซตจะแสดง widget GTranslate ตามทเราก าหนดไว
แชรบทความไปยง Social Network ดวย Social web Link
Social web link เปนวดจททใชส าหรบสรางปมแชรเวบไซตไปยงเวบไซต social ตางๆท
ตองการ สามารถดาวโหลดวดจทนโดยคนหาจากเวบ wordpress.com หรอ คนหาในหนาเพม
ปลกอนไดเลย
35
1. ใหเขาเวบ wordpress.com
2. คนหาทชองคนหา Social Web Link
3. ท าการดาวโหลดมาเกบไวทเครอง
4. จากนนใหอพโหลดไปยงเวบไซตของเราเอง โดยไปทเมน ปลกอน > เพม
ปลกอนใหม >อพโหลดปลกอน > เลอกไฟลปลกอนทโหลดมา จากนนให
กดทเปดใชงานปลกอน
ขนตอนท 1 ก าหนดคาให widget
1. คลกเมน Social Web Link setting ใน ตงคา
2. คลกแทบ Default Social sites
3. เลอกเวบไซต social และก าหนดคาใหกบ Social Web Link ทตองการ
4. คลกแทบ Additional Settings
5. ท icon size ใหเลอกขนาดของไอคอน Social ทตองการแสดง
6. ท Display Style ใหเลอกลกษณะแนวการแสดงไอคอน
▪ Horizontal
▪ One Vertical Column with no names : แสดงเฉพาะไอคอนใน
แนวตง 1 คอลมน
36
▪ One vertical Column with names : แสดงไอคอนพรอมตงชอใน
แนวตง 1 คอลมน
▪ Two vertical Column with no names : แสดงเฉพาะไอคอนใน
แนวตง 2 คอลมน
▪ Two vertical Column with names : แสดงไอคอนพรอมชอใน
แนวตง 2 คอลมน
7. คลกปม save settings
ขนตอนท 2 ก าหนดต าแหนงแสดง widget
8. สรางหนา page
หนา page เปนลกษณะบทความทไมคอยมการเปลยนแปลงเชน หนาตดตอ หนาเกยวกบ
เปนตน ซงหนาเหลานจะไมมหมวดหมใดๆและไมสามารถก าหนดค าส าคญได โดยปกต
หนา page จะไปปรากฏอยตรงสวนของเมนหลก ดงนนจะตองสรางเมนหลกขนมากอนจง
จะแสดงหนา page ทสรางขนได
การจดการหนา page
1. คลกทเมน หนา > หนาทงหมด
37
สรางหนา page ใหมในเวบไซต
ส าหรบวธการสรางหนา page จะคลายกบการสราง post ดงน
1. คลกเมน หนา > เขยนหนาใหม (หรอคลกเมน > หนาทงหมด แลวคลกทปม
เขยนหนาใหม)
2. ก าหนดรายละเอยดตางๆดงน
▪ ชอ page : เมอก าหนดชอหนา page แลวจะปรากฏ URL (ลงคถาวร)
ใหโดยอตโนมต โดยชอหวขอไมควรยาวเกนไปเพราะจะตองไปปรากฏ
เปนชอเมน
▪ เนอหา : กรอกรายละเอยดตางๆ
▪ รปพเศษ : เลอกรปประจ าตวส าหรบบทความ
38
3. เมอก าหนดเสรจแลวใหคลกปม เผยแพร
การแกไขหนา page
หนา page ทสรางแลวหากตองการแกไขเนอหาหรอปรบแตงเนอหาหรอคารายละเอยด
ตางๆใหกบหนา page สามารถเลอกแกไขได 2 รปแบบ ดงน
แกไขอยางเรว
การแกไขอยางเรวน จะสามารแกไขไดเฉพาะชอบทความ หมวดหม และวนเวลาท
เขยนบทความ สวนเนอหาไมสามารถแกไขได สามารถท าไดดงน
39
1. คลกท แกไขอยางเรว ของหนา page ทตองการแกไข
2. จากนนใหแกไขชอหวขอ วนเวลาบทความ หรอเลอกเทมเพลต ตามตองการ
3. เมอเสรจแลวใหคลกปม อปเดต
แกไขทงหมด (แกไข)
ส าหรบวธนสามารถแกไขรายละเอยดของหนา page ไดทงหมด สามารถท าไดดงน
1. คลกท แกไข ของหนา page ทตองการแกไข
2. จากนนใหแกไขรายละเอยดบทความตามตองการ
3. เมอเสรจแลวใหคลกปม อปเดต
ลบหนา page ทไมตองการ
ส าหรบหนา page ทไมตองการหรอไมไดใชงานหรอไมตองการเผยแพรแลว เราสามารถ
ลบหนา page ออกได ซงการลบจะแบงออกเปน 2 ประเภทดวยกน คอ ลบแบบชวคราวโดย
40
เกบไวในถงขยะ (สามารถน ากลบมาใชได) และลบออกจากเวบไซต (ไมสามารถน ากลบมา
เผยแพรได)
ลบหนา page แบบชวคราว
การลบแบบชวคราวจะเปนการยายหนา page ไปเกบไวในถงขยะเมอไมตองการ
เผยแพร กอนจะตดสนใจลบออกจากเวบไซตจรง สามารถท าไดโดยคลกทถงขยะ ของหนา
page ทตองการลบ
9. สรางบทความ
สรางบทความใหม
1. คลกท เรอง > เขยนเรองใหม
ลบชวคราว
41
2. ใสชอเรอง ,ใสเนอหา
เพมรปภาพในบทความ
1. กดท >> เพมสอ
2. ใสไฟลสอ หากตองการอปโหลดรปจากเครองใสบนเวบไซตใหกดทค าวา อปโหลดไฟล
แลวสามารถดงไฟลรปลงในพนทสขาว หรอ กดทเลอกไฟล แลวกดท ใสไฟลลงในเรอง
42
หากตองมไฟลอยในเวบไซตอยแลวใหกดทค าวา คลงไฟลสอ แลวเลอกรปท
ตองการ แลวกดท ใสไฟลลงในเรอง
หากตองการใสรปภาพจากลงค url ดานนอกใหกดทค าวา ใสไฟลจาก URL ใส
ลงครปภาพ แลวกดท ใสไฟลลงในเรอง
43
ตวอยางลงครปภาพ : https://cdn.pixabay.com/photo/2016/04/15/20/08/fish-1331816_960_720.png
เพมขอความในบทความ
รปแบบขอความ
รปแบบตวอกษร B ตวหนา I ตวเอยง
รายชอแบบหวขอ และ รายชอแบบตวเลข
44
จดขอความ ชดซาย ตรงกลาง ชดขวา
เพมลงคแกไขลงค เอาลงคออก
ขดกลางตวอกษร
เสนแนวนอน
สตวอกษร
วางเปนขอความจากตนฉบบ
ลางรปแบบ
ตวอกษรพเศษ
ลดยอหนา เพมยอหนา
ยอนกลบ ถดไป
45
เพมลงคในบทความ
กรณทตองการลงคไปยงเวบอนหรอภายในเวบของเราเอง ซงสามารถท าไดดงน
1. สรางขอความทตองการลงค (เชอมโยง)
2. คลมด าขอความ
3. เลอกท เพอเพมลงคลงไปในขอความ
4. ใสลงค แลวกด enter
จะไดแบบน
เพมวดโอลงในบทความ
กรณทตองการเพมวดโอจาก YouTube หรอ เวบอน สามารถท าไดโดยวธดงน แต
อาจจะมความซบซอนเลกนอย เพราะตองคดลอกโคดจากเวบ YouTube
1. เขาเปนทวดโอทเราตองการจากเวบ YouTube
2. แลวใหกดท แชร
46
3. แลวกดท ฝง
4. จากนนใหคดลอกโคดทแสดงมาใสเวบไซตของเรา
47
5. ในเวบไซตของเรา ใหกดท ตวอกษร จากหนาทเราก าลงสรางบทความ
6. วางโคดทคดลอกมาลงในบรรทดสดทายของขอความทมอย
7. จากนนใหกดกลบมาท เสมอนจรง
48
8. หากตองการใหวดโออยตรงกลางบทความสามารถท าไดโดยใสแทกในหนา
ตวอกษร หนาทวางโคด <center>โคดวดโอ</center> <center><iframe src="https://www.youtube.com/embed/3ysgcha8z4w" width="560"
height="315" frameborder="0" allowfullscreen="allowfullscreen"></iframe></center>
49
หนาทท าการทดสอบ