คู มือการใช joomla 3.5 เบื้องต นคู มือการใช...
TRANSCRIPT
คมอการใช Joomla 3.5 เบองตน
ฉบบปรบปรง
สารบญ
ภาพรวมและความเขาใจเบองตน เกยวกบ Joomla 1
การเซทคาระบบตางๆ ของเวบไซต 4
การเปลยนรหสผานเพอความปลอดภย 4
การตงคาระบบหลก 5
การสราง บทความ เนอหาเวบ Content 7
การสรางหมวดหม (Category) 8
การสรางเนอหา (Article) 9
ลกษณะการบนทกขอมล 10
เครองมอตางๆ ในการพมพขอมล 11
การใชเครองมอแทรกภาพ 11
การแทรกตารางในเนอหา 16
การใชปม Read More (อานเพมเตม) 19
สถานะตางๆ ของเนอหาในระบบ 20
การตงคาการแสดงผลในหนาเพจของเนอหา 21
การสรางเมนเชอมโยงเนอหา 22
การสรางเมนเชอมโยงเนอหา 22
การสราง Main menu 22
การสราง Sub menu 25
การทา Main menu สาหรบทา Sub menu 25
การทา Sub menu (เมนลก) 26
การเปด Option ใหเมน Drop Down ทางาน 29
การจดการรปแบบหนาแรกของเวบไซต 30
การเรยงลาดบเนอหาในการแสดงผล 33
การใชงาน Extension ตางๆ 34
วธการตดตง Extension ในเทมเพลตเวบไซต Joomla 36
การตดตง Template (รปรางหนาตาเวบไซต) 38
การถอน Extension ทไมตองการออก 39
การดตาแหนงตางๆ ในระบบเทมเพลต ทจะสามารถวางโมดลได 40
วธการปรบแตงคาตางๆ ในเทมเพลต 42
การวางตาแหนงโมดลตางๆ บนเทมเพลต 43
การสราง Module ใหมตามตองการ 45
สารบญ
การจดเรยงตาแหนงของโมดล 46
วธการแกปญหาโมดลทสรางตดไปกบทกหนาเพจ 48
Extension ทนาสนใจ 52
Latest News Enhanced (ขาวลาสด) 52
Module Anywhere 56
TAB (Regular Tab) 57
แสดงวดโอดวย All videos 62
นบจานวนผเขาเยยมชมเวบไซต vinaora Visitor Counter 65
DJ-ImagesSlide ทาภาพสไลด 67
Facebook LikeBox 73
Facebook Shared Botton 75
ทาแกลลอรภาพ Simple Images Gallery 78
การบรหารจดการไฟลขอมลบนเวบไซต 81
การทาหนาตอนรบ หรอ Popup กอนเขาหนาเวบไซต 83
การอพโหลดไฟลทมขนาดใหญ ดวย Google Drive 88
การปองกนความปลอดภยบนเวบไซต 89
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 1
การใช Joomla 3.5x เบองตน
Joomlaคออะไร
เปน CMS (Content Management System)ในการสรางเวบไซตทไดรบความนยมเปนอนดบตนๆ
มเวบไซตทสรางจาก Joomla จานวนหลายลานเวบไซต เพราะ Joomla มระบบการจดการเนอหาบน
เวบไซตทมรปแบบสากล การปรบแตงหนาตาของเวบไซตทาไดงาย เพราะถกออกแบบมาใหรองรบกบ
เทคโนโลยการออกแบบเวบไซตสมยใหม รองรบการแสดงผลบนอปกรณมอถอ ทปเลต ฯลฯ นอกจากนยง
สามารถ Download Template ไดหลากหลาย มทงแบบทสามารถนามาใชงานไดฟร หรอหากตองการ
Template ทมประสทธภาพ และมความสวยงาม กสามารถหาซอมาใชได จดเดนอกจดหนงกคอม
Extension จานวนมากใหเราสามารถนามาประยกตใชงาน เชน Component, Module, Plugin มทงแบบฟร
และแบบตองชาระเงน สาหรบเวบไซตอยางเปนทางการคอ http://www.joomla.org เปนศนยรวมขาวสาร
การ Update joomla และคณสามารถ download extension ตาง ๆ ได
ขอดของ Joomla
1. ตดตงงายไดเวบไซตอยางมออาชพ
2. ควบคมหนาตาเวบไซตดวยเทมเพลต
3. สรางและจดการเนอหาไดงาย
4. รอบรบการทางานหลายๆ คนพรอมกน
5. เสถยร ปลอดภย อปเดตสมาเสมอ
6. ไมตองยดตดกบคอมพวเตอรหรอซอฟตแวรใดๆ สามารถทางานไดทกๆ เบราเซอร
7. มสงคมออนไลนทมขอมลชวยเหลอจานวนมาก
8. มการพฒนาภาษาไทยอยางเปนทางการ
9. สมบรณดวยโปรแกรมเสรมทหลากหลาย
10. มการอพเดทตวโปรแกรมอยเสมอเพอความปลอดภย
Part 1 :ภาพรวมและความเขาใจเบองตน เกยวกบ Joomla
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 2
ลกษณะของเวบไซต Joomla
Front End สวนหนาตาแสดงผลของเวบไซตทผเยยมชมเวบไซต สามารถเขามาดเวบไซตของเราได
Module
เมนการใชงาน
Main Menu Content
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 3
หนาจอเวบไซตผดแลระบบ Administrator
การเขาสระบบเทมเพลตเวบไซต Joomla กรมสงเสรมสหกรณ
1.เปดเบราเซอร (โปรแกรมทองอนเตอรเนต) ขนมา พมพ URL ในชอง URL ดงน
__________________________________________
** เบราเซอร ทสามารถใชงานไดกบเวบไซต Joomla ไดทกเบราเซอร ดงน
Chome Firefox IE Opera Safari
2. ทาการลอกอนดวย Username Password ของทาน
ใสชอผใช และรหสผาน
จากนนคลกป มเขาสระบบ
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 4
เมอเขาสระบบเรยบรอยแลวจะเขาสหนาจอผดแลระบบ หรอ Administrator
การเปลยนรหสผานเพอความปลอดภย
หากเขาสระบบไมได ใหตรวจสอบการพมพตวสะกดใหถกตอง
ตวอกษรเลกและใหญ มผลตอการลอกอนเขาสระบบ
เมนการใชงาน
คลกเพอดหนาเวบไซต
เมนลด
สวนแสดงวาทานทางานอยทสวนใด
เวอรชน ออกจากระบบ
Part 2 : การเซทคาระบบตางๆ บนเวบไซต
1.คลกสญลกษณ
2.คลก Edit Account
3.ใสรหสผานใหม และ
ยนยนรหสผาน
เมอเปลยนรหสเรยบรอยแลว ใหทา
การออกจากระบบ และเขาสระบบใหม
4.คลกป ม บนทก&ปด
จานวนผเขาระบบ
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 5
การตงคาระบบหลก
เพอเปนการ Setup คาตางๆ ใหกบเวบไซตเพอทจะทางานไดรวดเรวขน และเพอใหเวบไซตของเรา
รองรบกบเทคโนโลยการคนหาเวบไซต Search Engine Optimization (SEO) โดยไปท
ระบบ -> ตงคาระบบหลก
1
2
3. ตงคาตางๆ ตามตองการ
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 6
4.ใสคาอธบายเวบไซต
5.ใสคาคนหา
คลกทมม เพอยดขยายชอง
การพมพขอมล
คลกป มบนทก & ปด
คลกทแทบเซรฟเวอร เพอตง
เวลาของเวบไซต
ทาการเลอกเวลา เปน Bangkok
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 7
ความเขาใจในการจดการ Content บนเวบไซต
ในการจดทาเวบไซตจะตองมการออกแบบโครงการขอมลในเวบไซตกอน โดย
กาหนดการแบงกลมขอมลเปนกกลม แตละกลมมกลมยอยอกหรอไม เพอนาไปเปนโครงสราง
เวบไซตใหเหมาะสม
ประเภทและโครงสรางของ content ใน Joomla
1. เนอหา (Article) คอขอมลหรอเนอหาในแตละหนาของเวบไซต
2. หมวดหม (Category) คอหมวดหมของ เนอหา เราสามารถสรางหมวดหม
หลกและหมวดหมยอยไดไมจากด
ความสมพนธของเนอหา (Article) และหมวดหม (Category)
ในการทาใหเวบไซตของทานสามารถคนหาใน Google ไดงาย นน ระบบ Search Engine ให
ความสาคญกบโครงสรางเนอหามากกวา หวขอเนอหา โดยหลกในการสรางหวขอหลกและหวขอยอย ท
ถกตองคอ <h1>,<h2>,<h3>,….. เปนลาดบตอเนองไปจนถง <h6>โดย Search Engine จะคนหาขอมลทม
นาหนกความสาคญตามลาดบจากหวขอแทกทกาหนด โดยมความสาคญมากกวาขอความธรรมดา
Part 3 :การสราง บทความ เนอหาเวบ (content)
หมวดหมยอย 1
Sub Category 1
หมวดหมยอย 2
Sub Category 2
หมวดหม 1
Category 1
เนอหา 1
Article 1
เนอหา 2
Article 2
เนอหา 3
Article 3
ตวอยางการพมพ คาคนหา คาคนหาท1,คาคนหาท2,คาคนหาท3,.............คาคนหาท 1000
เชน ศนยเทคโนโลยสารสนเทศและการสอกสาร กรมสงเสรมสหกรณ,ศนยสารสนเทศ กรมสงเสรมสหกรณ
,ITC CPD,ไอทกรมสงเสรมสหกรณ
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 8
จากภาพ Category หรอ หมวดหม เปรยบเสมอน โฟลเดอรทไวเกบขอมลตางๆ ในระบบ
จากภาพ Article หรอ เนอหา เปรยบเสมอนไฟลตางๆ ทถกเกบอยในโฟลเดอรนนเอง
** ในการสราง Content ตางๆ ในระบบเวบไซต Joomla นน ทานควรจะสรางๆ หมวดหมหรอ Category
กอนทจะสรางเนอหา Article เพอสะดวกในการจดการการนนเอง
ตวอยางการทาโครงสรางขอมลเพอจาแนกเนอหาตางๆ บนเวบไซต
1. การสรางหมวดหม (Category)
1.1 ไปทเมน เนอหา > หมวดหม > เพมหมวดหมใหม
เกยวกบสหกรณ
วสยทศน พนธกจ
ประวตสหกรณ
บคลากร
สนคาและบรการ
สนคาของเรา
บรการของเรา
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 9
1.2 ตงชอหมวดหมตามตองการ
** เอเลยส คอ ชอทจะแสดงแทนชอหนาขอมลเวบเพจทเราสรางขน หากเราตงชอ เอเลยสเปนอะไร กจะไป
ปรากฏทแถบแสดง URL บนเบราเซอร และไวใชในการอางองการเรยกเวบเพจขนมาแสดง
1.3 จากนนกดปม บนทก
2. การสรางเนอหา Article
2.1 ไปทเมน เนอหา > เนอหา > เพมเนอหาใหม
2.2 พมพเนอหาทตองการ
ตงชอหมวดหมตามตองการ ใสชอ เอเลยสตามตองการ
ตงชอเนอหาตามตองการ
พมพขอมลตามตองการ
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 10
เมอพมพขอมลทตองการเสรจเรยบรอยแลว เซทคาทางดานขวามอ
คาอธบาย
ลกษณะการบนทกขอมล
-------------------------------------------------------------------------------------------------------------------------------------
เลอกสถานะ
เลอกหมวดหม คอ ใหเนอหานอยในหมวดหมใด
เลอกเดน ใหเนอหานแสดงอยในหนาแรกของ
เวบไซตหรอไม
- เผยแพร คอ ใหแสดงผลบนเวบไซตได
- ไมเผยแพร คอ ซอนการแสดงผลบนเวบไซต
- คลงเนอหา คอ ใหเนอหาน ไปเกบอยในคลงเนอหา
- อยในถงขยะ คอ ใหเนอหานอยในถงขยะ(ลบ)
บนทกเนอหาน กจะคางอยในหนาเนอหานน
ไมเปลยนหนาไปไหน
บนทกเนอหาน แลวปดหนาเนอหาน
บนทกเนอหาน และปดหนาเนอหาน แลวทาการสราง
หนาการสรางเนอหาใหมเปลาๆ ใหอตโนมต
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 11
เครองมอตางๆ ในการพมพขอมล
1. Font Family คอแบบอกษร // Font Size คอขนาดตวอกษร
2. เครองการสรางตาราง ลบตาราง ลบแถว เพมแถว และผสานเซลล
3. เครองมอ การลางรปแบบตางๆ ทตดมากบโปรแรมอนเชน Word , Excel ,Powerpoint เพอใหสามารถ
จดรปแบบขอมลได
4. การทาลงคเชอมโยงขอมล
5. การแทรก Read more หรอ อานเพมเตม
การใชเครองมอการแทรกรปภาพ แบบท 1
1. เอา cursor เมาสไวตรงจดทตองการแทรกรปภาพ
2. คลกปมใสรปภาพ
1 2
4 5
3
2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 12
3. เลอน scrollbar ลงดานลางคลกปม Choose File เพอทาการเลอกรปสาหรบ Upload ขอมล
4. จากนนกดปม เรมอพโหลดไฟล
5. รอสกคร รปทอพโหลดจะปรากฏในชองแสดงรปตวอยาง จากนนคลกทรป
6. สงเกตวาเมอคลกทรปแลว ชองทอยรปม URL ชอรปปรากฏหรอไม หากไมม จะแทรกรปทตองการไมได
7. คลกปม เพมในเนอหา
3 4
5 7
6
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 13
ผลลพธ
การใชเครองมอการแทรกรปภาพ แบบท 2
1. คลกทสญลกษณ insert/modify images
1
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 14
2. คลกทสญลกษณ Upload
3. คลกทปม Browse แลวเลอกไฟลทตองการสามารถเลอกไดหลายๆ ไฟลพรอมๆ กน ชอไฟลจะปรากฎอย
ทชอง Upload
4. คลกปม Upload เพอ อพโหลดไฟลทเลอก สามารถอพโหลดไฟลไดไมเกน 2MB
2
3 4
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 15
5. รปทอพโหลดเสรจแลวจะปรากฎอยในชองแสดงรป
6. คลกทชอรป แลวกดปม Insert
5
6
สามารถเซทคาตางๆได และสามารถด
ตวอยางเมอเซทคาเรยบรอยแลวได
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 16
การแทรกตารางในเนอหา
1. คลกทสญลกษณตาราง แลววาดชองตารางตามตองการ
2. ตารางจะปรากฏในพนทการพมพ แตตารางจะยงไมมสและเสนตาราง เราตองเปนคนกาหนดคาตางๆ
เองตามตองการ
3. คลกลากตารางใหมความกวางตามตองการ
1
2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 17
4. เซทคาตารางตางๆ ใหทาการคลกขวาในตารางทตองการ
4.1 เซทคาทงตาราง
4.2 เซทคาตางๆ แตละชองเซลส สามารถลากแถบดาคลมไดหลายๆ เซลส หรอ ทละเซลสกได
จากนนคลกขวา เลอก Cell > Table Cell properties
Table Properties เปนการเซทคาทงตาราง
Cell เปนการเซทคาแตละเซลล(ชอง)
เซทคาความกวาง, ความสง
ความหนาเสนขอบ , ชองวาง
ระหวางเซล
เซทสเสนขอบและ สทงตาราง
4.2
ลากแถบดาคลมชองทตองการ ถา
ตองการเปลยนแค 1 ชองใหนา
cursor เมาส วางในชองนน
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 18
4.3 เซทคาตางๆ แตละชองเซลตามตองการ
เครองมอตารางเพมเตม
เซทคาความกวาง, ความสง
ความหนาเสนขอบ , ชองวาง
ระหวางเซล
เซทสเสนขอบและ สทงตาราง
เกยวกบการเพมแถว ลบแถว
เกยวกบการเพมคอลมน ลบคอลมน
ผสานเซลส และยกเลกผสานเซลส
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 19
การใชงานป ม Read More (อานเพมเตม)
เนอหาทแสดงทหนาแรกของเวบไซตจะมความยาวของขอมลมาก หากนามาแสดงทงหมด จะทาให
รปแบบหนาเวบไซต ไมสมดล และไมเปนระเบยบ ดงนนปม read more จงเปนฟงกชน ตดขอมลทจะ
แสดงผลหนาแรกใหแสดงแคบางสวน และมปมอานเพมเตมขนมา เพอใหผใชงานตองการอานขอมลทงหมด
คลกเพออานขอมลไดหมด วธการดงน
1. เอา cursor เมาสไวตรงตาแหนงทตองการตดคาเพอให แสดงผลบางสวนบนหนาเวบ
2. คลกทปม Read More
3. จะปรากฏเสนกาหนดขอบเขตของ Read more
จดทตองการตดขอมลใหแสดงหนาแรก
2
เสนแบง Readmore
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 20
ผลลพธทได
สถานะตางๆ ของเนอหาในระบบ
** วธการเปลยนสถานะเนอหาตางๆ ใหคลกทสญลกษณนนไดเลย
** หากเนอหาใดมสถานะ รป เครองหมายตกใจ สเหลอง หมายความวาบทความนนมการตงเวลาการ
แสดงผล
** หากเนอหาใดมสถานะ รป แมกญแจเกดขน หมายความวา เนอหานน มการบนทกไมครบถวน
อาจจะทาใหเนอหานนแสดงผลบนหนาเวบไมสมบรณ ใหทาการเขาไปในเนอหานนแลวทาการบนทกซาอก
ครงหนง
กากบาทสแดงคอไมเผยแพรเนอหานนขนเวบไซต
เครองหมายถกสเขยวคอ เผยแพรเนอหานนขนเวบไซต
เครองหมายดาวสเหลอง คอ เนอหานเปนเนอหาเดนแสดงอยหนาแรก
ของเวบไซต
เครองหมายดาวสขาว คอ เนอหานไมไดเปนเนอหาเดน
ป มอานเพมเตมจะปรากฏขนมา
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 21
การตงคาการแสดงผลในหนาเพจของเนอหา
เราสามารถเปดปดการแสดงผลในสวนทไมตองการไดหลายสวน ซงมวธการดงน
1. ไปทเมน ระบบ เลอก ตงคาระบบหลก
2. คลกทเนอหา 3. ทาการเซทคาไดตามตองการ
1
2 3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 22
ผลลพธเกดจากการเซทคา
3. การสรางเมนเชอมโยงเนอหา
การทาเมนเชอมโยงเนอหานนมการทาเมนสองแบบ
1. การทา Main Menu ทอยดานบน
2. การทา Sub menu ยอย
วธการสราง Main Menu
1. ไปทคาสง เมน > Main Menu > เพมเมนใหม
Main Menu
Sub Menu
Part 4 :การสรางเมนเชอมโยงเนอหา
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 23
2. ตงชอเมนทตองการในชองเมน 3. ชนดของเมนนนคลกปมเลอกสนาเงน
4. เลอกชนดเมนทตองการ
4.1 ใหเลอกเนอหา > เนอหาเดยว
4.2 เลอกเนอหา คลกปมเลอกสเทา
2
3
4.1
4.1
4.2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 24
4.3 เลอกเนอหาทตองการ โดยคลกไปทชอเนอหาทตองการไดเลย หรอคนหาจากชองคนหา
5. คลกปมบนทกเพอทาการบนทก Main Menu
ผลลพธทได เมนทสรางใหมจะปรากฎขนดานบน
-------------------------------------------------------------------------------------------------------------------------------------
** หมายเหต การสราง Main menu นนหากตองการใหเมนทสรางนน คลกแลวเชอมโยงไปยงเนอหาท
ตองการ , ลงคไฟล , ลงค URL ทตองการ
6. ทาเมนเพอลงคไปหา URL ทตองการ ใหคลกท ลงคระบบ > URL ภายนอก
4.3
คนหาเนอหาทตองการ
6
6
เมนทเพมขนใหม
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 25
7. ในชองลงคใส URL ทตองการ ชองหนาตางเบราเซอรเปาหมายเลอกตามตองการ
โดยวธการใส URL นนพมพไดดงน
http://www.cpd.go.th แบบน ใสถก www.cpd.go.th แบบนใสผด
8. คลกปมบนทกเพอทาการบนทก Main Menu
วธการสราง Sub Menu
ในการทา Sub Menu นนเราจะตองสราง Main Menu (เมนแม) ทอยดานบนใหเรยบรอยเสยกอน
จงจะทา Sub Menu (เมนลก) ขนมาได
** การทา Main Menu สาหรบ ทา Sub menu (เมนแม)
1. ไปทคาสง เมน > Main Menu > เพมเมนใหม
2. ตงชอเมนทตองการในชองเมน 3. ชนดของเมนนนคลกปมเลอกสนาเงน
7
7
2
3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 26
4. เลอกชนดเมนทตองการ เลอกเปน ลงคระบบ > URL ภายนอก
5. ชองลงก ใสเครองหมาย # เพอใหเมนแมน ไมสามารถคลกลงคไปได ใหเพยงแคเอาเมาสวางบน
เมนแลวจะมเมนลก ปรากฏขนมา
6. จากนนคลกปม บนทก
** การทา Sub Menu (เมนลก)
1. ไปทคาสง เมน > Main Menu > เพมเมนใหม
4
4
5
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 27
2. ตงชอเมนทตองการในชองเมน 3. ชนดของเมนนนคลกปมเลอกสนาเงน
4. เลอกชนดเมนทตองการ
4.1 ใหเลอกเนอหา > เนอหาเดยว
4.2 เลอกเนอหา คลกปมเลอกสเทา
2
3
4.1
4.1
4.2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 28
4.3 เลอกเนอหาทตองการ โดยคลกไปทชอเนอหาทตองการไดเลย หรอคนหาจากชองคนหา
5.ทาการตงคาเมนลก ทางดานขวามอดงน
อธบายตวอยาง
6. เมอเซทคาเรยบรอยแลว กดปม บนทก
-------------------------------------------------------------------------------------------------------------------------------
4.3
คนหาเนอหาทตองการ
เลอกวาเมนลกทสรางนจะใหอยภายใต
เมนแม ตวใด
สญลกษณ – (หนงขด) หมายถงเมนทอย
Level บนสด
สญลกษณ - - (สองขด) หมายถง เมนทอย
Level รองลงมาจากบนสด
อยเลเวลบนสด เปรยบเสมอน
- (หนงขด)
อยเลเวลรองจากบนสด
เปรยบเสมอน - - (สองขด)
อยเลเวลอนดบสาม
เปรยบเสมอน - - -(สามขด)
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 29
การเปด Option ใหเมน Drop Down ทางาน
เนองจากการทา เมนทมการ Drop เมนลงมานน เราจะตองทาการเปดการตงคาบางอยางเพอให
เมนนนทางานขนมา ซงเราทาเพยงแคครงเดยว
เมนตางๆ ทอยบนหนาเวบไซตทงหมดนนเปน โมดลการทางาน ดงนนเราจงตองไปเปดการตงคา
ทในสวนของ โมดล (Module)
1. ไปทสวนเสรม > โมดล
2. คนหาโมดลทชอวา Main menu ในชอง คนหา
3. คลกไปทชอ Main menu
4. ทาการเปลยนคาการแสดงเมนยอย เปน ใช แลวทาการบนทกขอมล
พมพชอโมดลลงในชองคนหา
3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 30
-----------------------------------------------------------------------------------------------------------------------------
การจดรปแบบหนาเวบไซตโดยใชเทมเพลตเวบไซต Joomla
1. เมน > Main Menu
** หากกลมของเมนใด มสญลกษณ รปบาน หมายความวา กาหนดกลมของเมนนนใหเปน
หนาแรกของเวบไซต
2. คลกทหนาหลก เพอทาการเซทคาตางๆ โดยสงเกตวา เมนใดทมสญลกษณ ดาว
เหลอง จะเปนเมนทเปนหนาแรกของเวบไซต
4
2
จดสงเกตดาวเหลองวาเปนหนาแรกของ
เวบไซต
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 31
3. เลอกชนดของเมน โดยคลกปมเลอกสนาเงน
4. เลอกชนดของเมน เปน เนอหา > หมวดหม แสดงแบบบลอก
5. เลอกหมวดหมทตองการใหแสดงในหนาแรก
3
4
4
5
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 32
6. คลกแถบ ตงคารปแบบบลอก กาหนดคาตางๆ ในการแสดงผล แลวกดปม บนทก
** บทความนา คอ เนอหาทจะแสดงผลในแนวนอน วาจะใหกเนอหาในแนวนอน
** เนอหารองคอ เนอหาทจะแสดงถดลงมาจากบทความนา
** คอลมนคอจานวน คอลมน ในหนาแสดงผลของหนาเวบ
ตวอยาง ทาการเซทคา บทความนา 2 // บทความรอง 5 // จานวนคอลมน 3
อธบาย
- บทความนา ทาการเซทคาไว 2 จะแสดงเนอหาเดนไวในลาดบตนๆเนอหามาแสดงผลในแนวนอน 2 แถว
- บทความรองเซทคาไว 5 จะนาเนอหาเดน ถดมามาแสดงผล แค 3 เนอหา เนองจากทาการเซทคอลมน
การแสดงผลไว 3 คอลมน เนอหาเดนทเหลอจะถกแสดงในหนาถดไป
6.1
6.2
โลโก
เมนการใชงาน
บทความนา
บทความนา
บทความรอง บทความรอง บทความรอง
ถดไป หนา 1
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 33
การเรยงลาดบเนอหาในการแสดงผล
1. คลกทสญลกษณ เพอปลดลอก การสลบลาดบเนอหา
2. จดไขปลาสามจด หนาบทความจะเปลยนสจากสเทา กลายเปนสดา หมายความวา สามารถเลอนลาดบ
เนอหาไดแลว
1
2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 34
3. ทาการคลกคางทปมไขปลาสามจด แลวคลกเมาสเลอนลาดบเนอหาตามตองการ
Extension ในระบบเทมเพลต Joomla คอ สวนเสรมตางๆ ททาใหเวบไซตมประสทธภาพในการ
ทางานมากขน แบงประเภทของ Extension ตางๆ ไดดงน
โมดล (Module) เปนสวนประกอบทใชในการแสดงผลในหนาเวบไซต เปรยบเสมอนกลองแตละ
กลอง หรอเปนบลอกทสามารถแสดงผลตดตอกบผใช โดยโมดลสามารถกาหนดตาแหนงการแสดงผลได
คอมโพเนนต (Component) เปรยบเสมอนซอฟแวรทนามาตดตงเสรมเพอรวมกนทางานกบ
Joomla เพอเพมความสามารถใหกบเวบไซต โดยคอมโพเนนมความซบซอนมากกวาโมดล โดยในการ
แสดงผลและสวนปรบแตง ตองปรบแตงการทางานในหนา Administrator ตวอยางเชน Photo Gallery,
Guest Book
ปลกอน (Plug In) เปนสวนทเขามาเกยวของในการตดตอระหวาผชมและผดแลเวบกบ Joomla
ปลกอนสามารถตรวจจบขอมลทมาจาก Joomla ตวอยางเชน editor – TinyMCE
เทมเพลต (Template) คอสวนแสดงรปแบบของขอมลในหนาเวบไซต เชน รปรางหนาตา สสน
กราฟฟก เปนตน
ทานสามารถ ดาวนโหลด extension ตางๆ เพมเตมตามตองการไดทเวบไซต
http://extensions.joomla.org/
คลกแลวลากเมาสเลอนตามตองการ
Part 5 :การใชงาน Extension ตางๆ
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 35
ผลลพธ การคนหา
ใสชอ extension ทตองการคนหา
เลอก extension ตามประเภท
คลกท extension ทตองการ
คาใชจายของ extension
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 36
ตรวจสอบ extension กอนการดาวนโหลด
เมอคลกปม Download แลวเมอโหลดแลวเราจะไดไฟล extension ตางๆ เปน ไฟล zip มา
วธการตดตง Extension ใน เทมเพลตเวบไซต Joomla
1. ไปทเมนสวนเสรม > การจดการ > ตดตง
แสดงประเภทวา extension
นเปนประเภทใด
Support กบ Joomla
version ใด
ดาวนโหลด extension
ดตวอยางการทางาน
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 37
2. คลกทแถบ อพโหลดแพคเกจไฟล
3. คลกทปม Choose File แลวทาการเลอกไฟลทตองการตดตง
4. จากนนคลกปม อพโหลด & ตดตง
5. จากนนรอจนกวา ขนตดตงสาเรจเรยบรอยแลว
6. เมอตดตงแลว extension ตางๆ ทตดตงจะยงไมถกเปดใชงาน เราจะตองเขาไปเปดการใชงาน
extension ตางๆ ดวยตวเอง โดยการไปทเมน สวนเสรม > โมดล (extension บางตวอาจจะเปนปลกอน
ดงนนตองคลกเลอกเมน โมดล > ปลกอน)
7. คนหาชอโมดลทตองการ
8. คลกเปลยนสถานะกากบาทสแดง(ปดการใชงาน) ของ สวนเสรมนนใหเปนเครองหมายถก(เปด
การใชงาน)
9. คลกเขาไปในชอของสวนเสรม เพอเซทคาตางๆ ตามตองการ
2
3
7
9
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 38
การตดตง Template (รปตางหนาตาเวบไซต)
Template คอ extension ชนดหนงของ Joomla เปนรปรางหนาตาของเวบไซต สามารถดาวน
โหลดไดทงแบบฟร และไมฟร สามารถดาวนโหลดเพมเตมไดท เวบไซต joomla24.com หรอ คนหาจาก
google วา template joomla 3 free
วธการดาวนโหลด Template ในเวบไซต Joomla24.com
เมอทาการดาวนโหลดเรยบรอยแลว ใหทาการตดตงเทมเพลตทดาวนโหลด วธการตดตง เทมเพลต
จะเหมอนกนการตดตง extension ทกประการ ในหนาท 34
การเซทคาตางๆ ในเทมเพลต
ไปทเมนสวนเสรม > เทมเพลต
เวอรชน Joomla ทใชได
ตวอยางเวบไซตเมอทาเสรจแลว
คลกเพอดาวนโหลด
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 39
รายละเอยดหนาการจดการเทมเพลต(หนาตาเวบไซต)
การถอน Extension ทไมตองการออก
เราสามารถทาการถอนการตดตง Extension ทไมตองการหรอมปญหาออกไปไดดงน
1. ไปทเมน สวนเสรม > การจดการ > จดการ
2. เมอเขามายงหนาจดการ ทาตามขนตอนตอไปน
2.1 ทาการพมพชอ extension ทตองการในชองคนหา
2.2 คลกเลอก extension ทตองการ
2.3 คลกปมถอนการตดตง
รายชอเทมเพลตทมใน
หากเทมเพลตใดคลกดาว
เหลองหมายถงใชงานอย ประเภทของเทมเพลต
2.1
2.2
2.3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 40
การดตาแหนงตางๆ ในระบบเทมเพลต ทจะสามารถวางโมดลได
ในการจดวางโมดลตางๆ บนเวบไซตนน เมอเราตดตงเทมเพลตแตละตวลงไปในระบบ Joomla นน
แตละเทมเพลต จะมตาแหนงทสามารถวางโมดลได แตกตางกน เราสามารถดตาแหนงบนเทมเพลตตางๆ ท
จะวางโมดลได ดงน
1. ไปทเมนสวนเสรม > เทมเพลต
2. คลกทเมนทางซายมอ เทมเพลต
3. คลกเพอเปด option ในการดตาแหนง Template ไปท ตงคาพนฐาน (ทางดานขวามอ)
2
3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 41
4. คลกเปด ในสวนดตาแหนงโมดล จากนนบนทกและปด
5. คลกทดตวอยาง
แสดงตวอยางตาแหนงตางๆ ทจะวางโมดลได
4
5
รายชอตาแหนงในเทมเพลต
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 42
การปรบแตงคาตางๆ ในเทมเพลต
1. ไปทสวนเสรม > เทมเพลต
2. คลกไปในชอเทมเพลตทตองการ
3. คลกแถบขนสง ทาการเซทคาและบนทก
** แตละเทมเพลตมการเซทคาไมเหมอนกนดงนน เทมเพลตตวทฟร อาจจะม option ใน
การเซทคา นอยกวาเทมเพลตตวทเสยเงน
2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 43
การวางตาแหนงโมดลตางๆ บนเทมเพลต
เราสามารถนาโมดลทตดตงแลว มาวางบนหนาเวบไซตไดโดยการกาหนดการแสดงโมดลทตองการ
โดยการกาหนดหนดตาแหนงของโมดล
1. ไปทเมน สวนเสรม > โมดล
2. คลกเขาไปในชอของโมดลทตองการเขาไปเซทตาแหนง
3 เลอกตาแหนงทางดานขวามอ เลอกตาแหนงทตองการ
5
3
ชอเทมเพลตทตดตง
ตาแหนงตางๆ ทอยบนเทมเพลต
แสดง/ซอน ชอโมดล
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 44
4. คลกแถบ การกาหนดการแสดงทเมน เลอกกาหนดการแสดงผล วาจะใหโมดลนแสดงทหนาใด
5. จากนนกดปมบนทกและปด
4
4
โมดลทเซทคาไวจะแสดงขนตาม
ตาแหนงทตองการ
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 45
การสราง Module ใหมตามตองการ
1. ไปทเมน สวนเสรม > โมดล
2. คลกทปมสรางใหม
3. เลอกประเภทโมดลตามตองการ ในทนเลอก กาหนด HTML เอง
2
3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 46
4. ตงชอโมดล และกาหนดคาตางๆ
ผลลพธ
ตงชอ โมดล
แสดงชอ/ซอนชอโมดล
ตาแหนงทจะวางโมดล
พมพขอมลตางๆ
กาหนดวาโมดลจะแสดงทหนา
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 47
การจดเรยงตาแหนงของโมดล
ทานสามารถสลบตาแหนงของโมดลทอยในตาแหนงเดยวกนใหเรยงลาดบตามตองการ
1. ไปทสวนเสรม > โมดล
2. คลกปมเครองมอคนหา
3. เลอกตาแหนงทตองการจะเรยงลาดบโมดล
ผลลพธการคนหา
2
3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 48
4. คลกปมสญลกษณการสลบตาแหนง เพอใหจดไขปลาหนาชอโมดลทางาน
5. คลกทสญลกษณจดไขปลา แลวดงโมดลขนลงสลบตามตองการ
วธการแกปญหาโมดลทสรางขนตดไปกบหนาเพจทกหนา
1. ตรวจสอบวา โมดลทสรางขนหรอตดตงนน คลกเลอกหนาทจะแสดงผลถกตองหรอไม
วธการตรวจสอบ
1.1 ไปท เมน สวนเสรม > โมดล
1.2 คลกเลอกโมดลทตองการเซท
1.3 คลกทแทบ การกาหนดการแสดงทเมน
1.4 แลวตรวจสอบวา กาหนดการแสดงผล เปนทกหนาหรอไม หรอคลกเลอกหนาทแสดงไม
ถกตอง
4
5
1.2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 49
2. หากยงแสดงผลอย ใหทาการตรวจสอบวาสรางเมนของเวบไซต เชอมโยงไปยงหมวดหมของ
เนอหาทเราสรางขนแลวหรอยง
1.4
1.2
ตรวจสอบวาคลกเลอกหนาถกตอง
แลวหรอไม
โมดลขาวประชาสมพนธ
เนอหาทจะเชอมโยงไปอยใน
หมวดหม ขาวประชาสมพนธหรอไม
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 50
ตามตวอยาง โมดลขาวประชาสมพนธเปนทแสดงเนอหาขาวประชาสมพนธ ดงนนลงคเนอหาทจะเชอมโยง
ไปจะตองเปนเนอหาทถกจดเกบในหมวดหมขาวประชาสมพนธเทานน หากลงคเนอหาในโมดลขาว
ประชาสมพนธเชอมโยงไปหาเนอหาในหมวดหมอน โมดลขาวประชาสมพนธจะแสดงไปทกหนาเหมอนเดม
เมอตรวจสอบแลววาลงคไปยงเนอหาขาวประชาสมพนธแลว ใหทาการสรางเมนเชอมโยง ไปยงหมวดหม
ขาวประชาสมพนธ ดงน
2.1 ไปทเมน เลอก TOP หรอ Main menu แลวเลอกสรางใหม
2.2 ตงชอเมน เลอกชนดเมน เปน เนอหา > หมวดหมแสดงแบบบลอก หรอ ลสรายการกได
2.3 เลอกหมวดหมทตองการ
2.1
2.2
2.2
2.3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 51
เมอคลกทขาวประชาสมพนธกจะไมปรากฏโมดลทไมตองการตดมาดวย
เลอกสถานเปน ไมเผยแพร เมนกจะไมปรากฏบนหนาเวบ
ถาเลอกเปนเผยแพร เมนทสรางขนจะปรากฏบนหนาเวบ
จากนน กคลกปมบนทก
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 52
โมดลทเกยวกบขาวประชาสมพนธตางๆ
1. Latest News Enhanced
เปน extension ทใชในการแสดงขาวตางๆ เชนขาวประชาสมพนธ ขาวกจกรรมตางๆ ของเวบไซต
โดย สามารถเซทคาใหแสดงขาวเองตามวนหรอรปแบบทตองการไดอยางสะดวก สามารถดาวนโหลด
extension ไดทเวบไซต https://extensions.joomla.org/extensions/extension/news-display/articles-
display/latest-news-enhanced
1.1 เมอดาวนโหลดเสรจแลวทาการตดตง extension โดยไปทเมน สวนเสรม > การจดการ > ตดตง
1.2 เมอทาการตดตง ทาการเปดการใชงาน extension ไปทเมน สวนเสรม > โมดล
1.3 ทาการเปดการใชงาน extension
1.4 คลกท Lastest News Enchanced เพอเขาไปทาการเซทคาตางๆ
1.5 คลกทแถบ Selection
1.6 Data Source เลอก Articles
1.7 Category เลอกเหมอนหมทตองการแสดง
Part 6 :Extension ทนาสนใจ
เปดการใชงาน
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 53
1.8 หวขอ Max Count ใสตวเลข จานวนหวขอทตองการแสดงตามตองการ
1.9 คลกทแถบ Layout
1.6
1.5
1.7
1.9
1.8
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 54
1.10 เลอนสกอลบารลงดานลาง ดหวขอ LINKING
1.11 หวขอ Link on เลอก Title
1.12 หวขอ Link to เลอก Item in modal window
1.13 คลกทแถบ Body
1.14 เลอนสกอลบารมาทหวขอ TEXT
1.15 หวขอ TEXT introduction เลอก เปน Meta Description
1.10
1.11
1.12
1.15
1.13
1.14
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 55
1.16 คลกทแถบ การกาหนดการแสดงทเมน วาตองการแสดงทหนาใดบาง
1.17 กาหนดตาแหนงการแสดงโมดล ตาแหนงทตองการ
ผลลพธทได
1.16
1.17
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 56
2. การใช Module Anywhere
เปนโมดลทเราจะสามารถทจะแทรก โมดลตางๆ ทเราใชงานลงในหนาขอมลไดตามตองการ เรา
สามารถดาวนโหลด Extension Module Anywhere ไดท
https://extensions.joomla.org/extensions/extension/core-enhancements/coding-a-scripts-
integration/modules-anywhere ทาการตดตง extension Module Anywhere ใหเรยบรอย
วธการใชงาน Module Anywhere
2.1 ทาการเปดเนอหาทตองการแทรก โมดล
2.2 คลกทปม Module
2.3 เลอก โมดลทตองการแทรก
2.2
2.3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 57
2.4 เมอทาการแทรกโมดลเสรจจะมโคดการแทรกโมดลเขามา
3. การใชเครองมอ TAB
สามารถดาวนโหลดไดท https://www.regularlabs.com/extensions/tabs ทาการตดตงใหเรยบรอย
เราสามารถใช TAB รวมกนการแทรกโมดลตางๆ เขาไปใน TAB ได โดยใช Module Anywhere
วธการใชงาน TAB รวมกน Module Anywhere
3.1 ไปทคาสง สวนเสรม > โมดล
3.2 สรางโมดลขนมาใหม คลกทปม สรางใหม
3.3 เลอก กาหนด HTML เอง
2.4
3.2
3.3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 58
3.4 ตงชอโมดล ในชองชอ
3.5 คลกทปม Tabs อยทางดานลาง
3.6 จะปรากฎหนาการใสขอมล TAB
3.4
3.5
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 59
3.7 กาหนดคาตางๆ ใน TAB ดงน
3.8 เมอกรอกขอมลหมดแลว คลกทปมแทรกสเขยว
3.9 จะได Code ของการแทรก TAB
กรอกชอ TABขอมล
คลกให TAB นเปน Default
3.8
TAB 1
TAB 2
TAB 3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 60
3.10 ในสวนของขอความของคณสามารถแทรก ขอความทตองการได หรอ แทรก Module ท
ตองการ หากแทรกโมดลทตองการสามารถแทรกไดดงน
3.11 เลอก โมดลทตองการจะแสดงใน TAB
แทรกโมดลทตองการตรงน ทาการ
ลบขอความออก แลวคลกทป ม
Module ดานลาง
3.11
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 61
3.12 สครปของ โมดลทจะแทรกจะปรากฏขน
3.13 ทาการเลอกการกาหนดการแสดงทเมน เลอกหนาทตองการแสดง
3.14 เลอกตาแหนงใหโมดลทสรางขนไปแสดงทตาแหนงใด
3.13
3.14
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 62
ผลลพธทได
4. แสดงวดโอดวย AllVideos
Allvideos เปนปลกอนทชวยใหเราสามารถนาไฟลวดโอตางๆ มาแสดงบนเวบไซตไดไมวาจะเปน
ไฟล flv, swf, mov, mp4, wmv ,wma และ Youtube, Google Video ดาวนโหลดไดท
https://extensions.joomla.org/extensions/extension/multimedia/multimedia-players/allvideos
4.1 วธการใชงาน ตองทาการ Enable ปลกอนกอนใชงาน โดยไปท
4.1
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 63
4.2 แกไขสวน Local Video Floder เปนทอยของไฟลVideo ทเราเกบไว
4.3. เมอเปดปลกอนและอพโหลดไฟลเรยบรอยแลวทาการแทรก TAGขอมล หากตองการใส วดโอ
ในเนอหาใด กทาการแทรก Tag code ลงไปในเนอหานน
ตวอยาง ตองการแทรกไฟล Video ประเภท FLV กทาการแทรกไปดงน
{flv}ชอไฟลวดโอ{/flv} เชน {flv}sample{/flv}
หากเปน Youtube สามารถแทรกไดดงน
1. เปดไฟล youtube ทตองการนามาแทรก copy code รหส Video มาแทรกในแทกแสดงวดโอ
ดงน
1
4.2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 64
2. ทาการพมพขอความลงในเนอหาทตองการแสดง
{youtube}Qcly9NiNbmo{/youtube}
หรอ {youtube}Qcly9NiNbmo|660|450|1{/youtube}
หมายความวา แสดง youtube ไฟลน โดยมขนาดกวาง 660 pixel และสง 450 pixel และ 1 คอเลนอตโนมต
ผลลพธ
2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 65
5. Module นบจานวนผเขาเยยมชมเวบไซต Vinaora Visitors Counter
5.1 ดาวนโหลด Module Vinaora Visitor Counter แลวทาการตดตงใหเรยบรอย ดาวนโหลดไดท
https://extensions.joomla.org/extensions/extension/site-management/analytics/vinaora-visitors-
counter
5.2 ทาการเปด Module ทตดตงโดยการไปท สวนเสรม -> โมดล
5.3 คลกเขาไปตงคาท Vinaora Visitor Counter
5.4 ทาการเลอกตาแหนงทตองการแสดง Module น
1
2 3
4
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 66
5. ทาการกาหนดการแสดง Moduleทหนาใดบาง
ผลลพธ
ผลลพธ
5
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 67
Extension DJ-imageSlider สาหรบทาภาพสไลด
1. เขาเวบไซต https://dj-extensions.com/dj-imageslider จากนน คลก download
2. ทาการตดตง Module DJ- ImageSlider ใหเรยบรอย
3. จากนนเขาไปจดการ Module ทตดตง ไปท สวนเสรม -> การจดการโมดล
4. คลกเขาไปท DJ-imageSlider
5. เขาไปจดการเพมรปทจะทาสไลดในระบบ โดยใหแสดงจากหมวดหมทเราสรางไว สามารถทาไดโดย
คลกไปท
คอมโพเนนท-> DJ-ImageSlider
1
3
4
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 68
6.ทาการสราง Category ของสไลด ทตองการ คลกท Category
7. คลกปม New เพอสราง Category ใหม
5
6
7
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 69
8. ตงชอ Category ทตองการ 9.คลก Save&Close
10. คลกท Slide เพอเพมรปภาพทา Slide
11. ทาการตงชอ Title เลอก Category และ เลอกรปท Slide Image โดยการกดปม Select
12. คลกเลอกรป หากยงไมมรปทตองการ คลกปม เรมอพโหลด เมออพโหลดรปเสรจเรยบรอยแลวคลกปม
เพมในเนอหา
8
9
10
11.1
11.2
11.3
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 70
13. ตองการทาลงคเลอก Link type และใส URL address ทตองการ
14. เมอเสรจแลว คลก Save&Close
15. ภาพสไลดกจะปรากฎ หากตองทาเพมกทาตาม ขอ 11 ได
13
12.1 12.2
12.3
14
15
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 71
ทาการเซทคาในการแสดงโมดล Dj-image slideshow
1. ไปทเมน สวนเสรม > โมดล
2. คลกท DJ-ImageSlider
3. Slide Source เลอก Component
เลอก Component
เลอก รปแบบ Slide Type
เลอก Link Images
ใหนารปจากโฟลเดอรใดมาแสดง
เลอกจาก Category ทตองการ
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 72
4. ทาการเซทคาเพมเตม และตาแหนงทจะแสดงบนเวบไซต
เลอกตาแหนง
แสดงผล
ขนาดของสไลดเตมพนทหรอไม
เซทความกวางตามตองการ
ใหแสดงทละกรปในสไลด
จานวนสงสดแตละสไลด
เลนอตโนมตหรอไม
การหยดและเลนแบบใด
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 73
ผลลพธ
Extension Facebook Like box
เปน Module ทใชกดไลทแฟนเพจ ทตนเองอยากโปรโมท สามารถดาวนโหลดไดจาก
http://extensions.joomla.org/ 1.ดาวนโหลดและตดตง
1
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 74
2. ไปท สวนเสรม -> การจดการโมดล
3.ทาการปดการใชงาน Module Facebook Likebox 4.คลกเขาไปจดการโมดล Facebook
5. เขาไปจดการ โดยใส URL FACEBOOK ทตองการ
6. กาหนดขนาดทจะแสดง
7. กาหนดตาแหนงทจะแสดง
8. เลอกกาหนดหนาทจะแสดง 9.จากนนคลกกาหนดการแสดงผล 10.จากนนคลก Save&Close
2
5
6 7
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 75
ผลลพธทได
Extension Facebook Share Botton
1. ดาวนโหลด Plugin Fast Social Share ไดจาก
http://storejextensions.org/extensions/fast_social_share.html แลวทาการดาวนโหลดและตดตง
8
10
9
1
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 76
2. ทาการคลกเขาไปเพอเปดการทางาน Plug In โดยไปท สวนเสรม -> การจดการปลกอน
3. คลกเพอเปดปลกอนใหทางาน
4. จากนนคลกไปทปลกอนเพอเขาไปเซทคา
5. ทาการเซทคาตางๆ ตามตองการ
2
3 4
5
5
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 77
6. ในสวน FB ShareMe Button ทาการ Set เปน Show 7.จากนนคลก Save
8. เรยกใชปลกอนโดย เปดเนอหาทตองการ จากนนพมพคาวา {fastsocialshare}
6
7
8
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 78
ผลลพธทได
Extension Simple Images Gallery สาหรบทา Gallery ภาพ
1. คลกดาวนโหลด http://extensions.joomla.org/extensions/extension/photos-a-
images/galleries/simple-image-gallery และทาการตดตง
1
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 79
2.ทาการเปดใชงาน Plug In ทตดตง ไปท สวนเสรม -> การจดการปลกอน
3. คลกเปดใชงานปลกอน Simple Image Gallery 4. คลกเขาไปแกไข
5. เลอก ไฟลเดอรทตองการแสดงรป Gallery และเซทคาตางๆ
2
3 4
5
5
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 80
6. เปดเนอหาทตองแทรก Gallery รปภาพ
7. แทรก tag ลงไปดงน {gallery}ชอโฟลเดอรรป{/gallery} เชน {gallery}slider{/gallery}
ผลลพธ
7
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 81
การบรหารการจดการไฟลขอมลบนเวบไซต
1. คลกทสญลกษณ Joomla
2. คลก มเดย
1
2
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 82
สราง โฟลเดอรใหม โดยชอโฟลเดอรจะตองเปนภาษาองกฤษเทานน
อพโหลดไฟล
คลก
ตงชอโฟลเดอร
คลกป มสรางโฟลเดอร
คลก
คลกป ม Choose Files
คลกป มเรมอพโหลด
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 83
การลบไฟล
การทาหนาตอนรบ หรอ Popup กอนเขาเวบไซต
สามารถดาวนโหลด Plug in JH Splash Screen ไดท เวบไซต
https://extensions.joomla.org/extension/jh-splash-screen/
ทาการตดตง Plugin JH Splash Screen โดยไปทเมน สวนเสรม > การจดการ > ตดตง เมอตดตงเสรจ
เรยบรอยแลว ทาการเปดการใชงาน
โดยไปท เมน สวนเสรม > ปลกอน
คลกเลอกไฟลทตองการ
คลกป มลบ
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 84
เปดการใชงาน JH Splash
Screen
คลกเพอเขาไปตงคา
ตงคาเปน Plubic เพอให
คนทวไปเหนได
เลอกประเภท Popup
ขนาดของ Popup
สของ Popup
เลอกบทความ*****
ใหแสดงแคครงเดยวเมอเปดเวบ
เลอกใหแสดงทหนาหลก
เลอกหนาเนอหาทตองการ
ใส Code โปรแกรมเอง
บนทกขอมล
ใหแสดงเมอเปดเวบทกครง
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 85
ผลลพทเมอเรยบรอยแลว
วธการอพโหลดไฟลทมขนาดใหญและไมสามารถอพโหลดขนในระบบได
ในการอพโหลดไฟลทมขนาดใหญนนทางระบบ Joomla นนจะอนญาต ใหทานอพโหลดไฟลไดไฟล
ละไมเกน 2 mb หากไฟลนนมขนาดเกน 2 mb ขนไปตองทาการอพโหลดขน google drive ของสานกงาน
วธการใช google drive
1. เขาเวบไซต google.co.th
1
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 86
2. ทาการลอกอนเขาสระบบ
3. ทาการคลกทสญลกษณ เปดแอป
4. จากนนคลกท Drive
3
4
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 87
5. จะเขามายงไดรฟของเรา ทาการคลกปม New เพอทาการอพโหลดไฟลใหม
6. เลอก File upload และทาการเลอกไฟลทตองการ
7. รอจนกวาอพโหลดเสรจสน
5
6
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 88
8. เมออพโหลดเสรจสนตองการนาไฟลมาใชงาน เราจะตอง copy ลงคไฟลใน google drive โดยการคลก
ขวาท ไฟลทตองการ
9. เลอก Get Shareable link
10. ทาการ copy ลงคไฟลทได ไปทาการเชอมโยงไฟลในเวบไซต
8 9
10
คมอการใชงานระบบเทมเพลตเวบไซต Joomla เบองตน หนา 89
การปองกนความปลอดภยบนเวบไซตของเรา
1. การซอนตวจาก Hacker
การซอนตว เปนปราการดานแรก เพอให hacker คนหาเราไมเจอวาเราใช Joomla! hacker มกดจาก
meta generator
ซอน meta generator
เราสามารถซอน ไดโดยใช Plugin Aimy No Generator http://www.aimy-extensions.com/joomla/no-
generator.html
ทาการดาวนโหลดและทาการตดตง Plug In และเปดการทางาน
2. สวนเสรมทสามารถปกปองเวบไซตจากการโจมตเบองตน เชน
SQL Injections
Remote URL/File Inclusions
Remote Code Executions
XSS Based Attacks!
สามารถ โหลด jHackGuard โหลดไปตดตง
http://extensions.joomla.org/extensions/extension/access-a-security/site-
security/jhackguard ตดตง และเปดการใชงาน
** ขอมลความรจาก เวบไซต joomlachannel.com