Upload
kruthai-kidsdee
View
1.004
Download
3
Tags:
Embed Size (px)
DESCRIPTION
เอกสารการอบรมจากคณะอาจารย์มหาวิทยาลัยมหาสารคาม
Citation preview
LOGO
Joomla! 2.5 Training
Website: www.isan.msu.ac.th/apirak E-mail: [email protected] Tooltham, ISAN Research Group.
ISAN Research GroupMahasarakham University Faculty of Informatics
ISAN Research Group
Contents
Introduction to Joomla!1
Installing Joomla!2
Organizing your Joomla!3
Templates & Extensions4
ISAN Research Group
Joomla! 2.5 Training
3 Days: Joomla! Training Course
LOGO
Day 1: Introduction to Joomla!Mr.Apirak Tooltham, ISAN Research Group.
ISAN Research Group
Introduction Movie
ISAN Research Group
Joomla! 2.5 Training
Introduction
ISAN Research Group
Joomla! 2.5 Training
Joomla! เป็�นระบบจัดการเน �อหา “Content Management System” (CMS) ป็ระเภท Open Source ซึ่��งป็�จัจั�บน Version 2.5 และ 3.0
“ หั�วใจของการทำ�าเว�บไซต์� คื�อ ข�อมู�ลทำ��อ�พเดต์ เคืล��อนไหัวต์ลอดเวลา มู!ใช่#เพ�ยงแคื#หัน�าต์าทำ��สวยงามู ”
What is Joomla!
Introduction to Joomla! [2]
ISAN Research Group
Joomla! 2.5 Training
Why Joomla!
สามูารถจ�ดการเน�(อหัาภายในเว�บไซต์�ได�อย#างเป็+นระบบ
ไมู#ต์�องมู�คืวามูร��ในการเข�ยนโป็รแกรมูหัร�อฐานข�อมู�ล
ใช่�ระยะเวลาส�(นในการพ�ฒนาเว�บไซต์�
เป็+น Open Source จ0งสามูารถใช่�งานได�ฟร�มู�กล2#มูผู้��ใช่�และน�กพ�ฒนาอย�#ทำ��วโลก จ0งมู�การพ�ฒนาอย�#อย#างต์#อเน��อง
สามูารถน�าโป็รแกรมูเสร!มูต์#างๆ มูาเพ!�มูป็ระส!ทำธิ!ภาพของเว�บไซต์�ได�
Abilities
Intranet
PersonalWebsite Corporate
Website
E-Commerce
Community
Joomla! 2.5
สามูารถน�ามูาใช่�เป็+น
ISAN Research Group
Joomla! 2.5 Training
Example Website
ISAN Research Group
Joomla! 2.5 Training
Discover over 3187 Government web sites built with Joomla!
Interface
Front-End
เป็�นส่�วนแส่ดงผลข้!อมู#ลข้องเว$บไซึ่ต์'
Joomla!Interface
Back-End
เป็�นส่�วนท(�ใช้!ในการบร+หารจัดการเว$บไซึ่ต์'
ISAN Research Group
Joomla! 2.5 Training
Interface [2]
ISAN Research Group
Joomla! 2.5 Training
Front End
Top Menu
Web ContentSide Menu
Interface [3]
ISAN Research Group
Joomla! 2.5 Training
Back End
Information Panel
Shortcut Button
Menu Bar
Installation Type
Installing
Local Host
Apache
MySQL
PHP
Apache
MySQL
PHP
ISAN Research Group
Joomla! 2.5 Training
Web Hosting
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop
Assignment Workshop
ท,าการต์+ดต์�งโป็รแกรมูจั,าลอง Server ลงบนเคร �องคอมูพิ+วเต์อร'ข้องผ#!เข้!ารบการอบรมู จัากน�นท,าการ Copy ไฟล'ข้!อมู#ลข้อง Joomla! ลงใน Local Host เร(ยก http://localhost:8080 เพิ �อต์รวจัส่อบการท,างาน จัากน�นส่ร!างฐานข้!อมู#ลใน MySQL ด!วย PHPMyAdmin แล!วท,าการต์+ดต์�ง Joomla! 2.5 จัากน�นทดลองเร(ยกหน!า Front-End และ Back-End เพิ �อต์รวจัส่อบผลการต์+ดต์�ง
ISAN Research Group
Joomla! 2.5 Training
Installing Web Server
Installing Web Server
USBWebserver Version 8.5
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop
http://localhost:8080
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [2]
Create MySQL Database User: root
Password: usbwhttp://localhost:8080/phpmyadmin/
1
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [3]
Create MySQL Database
2
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [4]
Create MySQL Database
3 4
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [5]
Create MySQL Database
5
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [6]
Installing Joomla!http://localhost:8080/joomla
1
2
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [7]
Installing Joomla!
3
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [8]
Installing Joomla!
4
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [9]
Installing Joomla!
6
5
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [10]
Installing Joomla!
7
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [11]
Installing Joomla!
8
9
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [12]
Installing Joomla!
10
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [13]
Installing Joomla!
11
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [14]
Installing Joomla!
Front-End
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [15]
Installing Joomla!
Back-End
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [16]
Installing Thai Language Pack
http://localhost:8080/administrator/
1
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [17]
Installing Thai Language Pack
2
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [18]
Installing Thai Language Pack
3
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [19]
Installing Thai Language Pack
4
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [20]
Installing Thai Language Pack
5
6
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [21]
Installing Thai Language Pack
7
8
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [22]
Installing Thai Language Pack
9
10
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [23]
Installing Thai Language Pack
11
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [24]
Installing Extension
1
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [25]
Installing Extension
2
3
4
5
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [26]
Installing Extension
6
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [27]
Enable JCE Editor Extension
1
ISAN Research Group
Joomla! 2.5 Training
Installing Workshop [28]
Enable JCE Editor Extension
2
3
4
ISAN Research Group
Joomla! 2.5 Training
Relax
Time Out
ISAN Research Group
Joomla! 2.5 Training
Publish
ISAN Research Group
Joomla! 2.5 Training
Publish [2]
Workshop: Let’s go! Publish your first Article…
ISAN Research Group
Joomla! 2.5 Training
Structure
Joomla! Structure
ISAN Research Group
Joomla! 2.5 Training
Structure [2]
Section Category Article
หัมูวดหัมู�#หัล�ก หัมูวดหัมู�#ย#อย บทำคืวามู/หัน�าเพจ
Create Step
ISAN Research Group
Joomla! 2.5 Training
Structure [3]
Section Category Article
หัมูวดหัมู�#หัล�ก หัมูวดหัมู�#ย#อย บทำคืวามู/หัน�าเพจ
Delete Step
ISAN Research Group
Joomla! 2.5 Training
Create Site
Section CategoryTop menu - หน!าแรก
- บ�คลากร- ข้�าวป็ระช้าส่มูพินธ์'- ภาพิก+จักรรมู- ต์+ดต์�อเราMain
menu- ป็ระวต์+โรงเร(ยน- ว+ส่ยทศน'/ป็รช้ญา- พินธ์ก+จั/เป็6าหมูาย- ท,าเน(ยบผ#!บร+หาร- กล��มูส่าระว+ช้า- ป็ฏิ+ท+นป็ฏิ+บต์+งาน- ข้!อมู#ลนกเร(ยน- ผลงานนกเร(ยน
ISAN Research Group
Joomla! 2.5 Training
Web Building Basics
The Frontend:12
3
4
5
7
6
1. Search box2. Top Menu3. Breadcrumbs4. Two different menus5. Login form6. Main body of the front page7. Banner ads
ISAN Research Group
Joomla! 2.5 Training
Step-By-Step
Remove sample data
Customize The site’s template
Add Content: create framework, add articles and add menu items
Add new features: create a contact form and poll
Finish your very first, fully functional Joomla-powered website
ISAN Research Group
Joomla! 2.5 Training
Template Layouthttp://localhost:8080/joomla/?tp=1
ISAN Research Group
Joomla! 2.5 Training
Relax
Time Out
ISAN Research Group
Joomla! 2.5 Training
User Management
User Group
Public ผ#!ใช้!ท�วไป็Manager ผ#!บร+หารจัดการข้!อมู#ลต์�างๆ ในเว$บไซึ่ต์'Administrator
ผ#!ด#แลระบบ ส่ามูารถเป็:ด/ป็:ด/ต์+ดต์�งการท,างาน
Super User ผ#!มู(ส่+ทธ์+ส่#งส่�ดในการบร+หารจัดการเว$บไซึ่ต์'Registered ส่ามูารถเข้!าใช้!งานเว$บไซึ่ต์'ได!ต์ามูป็กต์+Author ส่ามูารถเข้(ยนบทความูได! แต์�เผยแพิร�ไมู�ได!Editor ส่ามูารถเข้(ยน/แก!ไข้บทความูได! แต์�เผย
แพิร�ไมู�ได!Publisher ส่ามูารถเข้(ยน/แก!ไข้บทความูได! และเผย
แพิร�ได!
ISAN Research Group
Joomla! 2.5 Training
User
User Add
1
1
ISAN Research Group
Joomla! 2.5 Training
User [2]
User Add
2
3
ISAN Research Group
Joomla! 2.5 Training
User [3]
User Edit / Active / Block / Unblock / Delete
1
2
LOGO
Day 2: Joomla! WorkshopMr.Apirak Tooltham, ISAN Research Group.
ISAN Research Group
ISAN Research Group
Joomla! 2.5 Training
Joomla! 2.5 Workshop
ส่ร!าง Website ข้องผ#!เข้!ารบการอบรมูด!วย CMS Joomla! 2.5 ส่ามูารถออกแบบได!ต์ามูความูต์!องการ โดยท,าการต์+ดต์�งเว$บไซึ่ต์'ข้องต์นไว!บนโป็รแกรมูจั,าลอง Server บนเคร �องคอมูพิ+วเต์อร'
Assignment Workshop
LOGO
Day 3: Template & ExtensionMr.Apirak Tooltham, ISAN Research Group.
ISAN Research Group
http://www.artisteer.com
ISAN Research Group
Joomla! 2.5 Training
Template Building
Artisteer Version 4
ISAN Research Group
Joomla! 2.5 Training
Artisteer 4 Overview
Menu Tab
Work Space
Page Menu
ISAN Research Group
Joomla! 2.5 Training
Artisteer 4 Menu
Home Tab
Edit Tab
Colors & Fonts Tab
ISAN Research Group
Joomla! 2.5 Training
Artisteer 4 Menu [2]
Layout Tab
Content Tab
Background Tab
ISAN Research Group
Joomla! 2.5 Training
Artisteer 4 Menu [3]
Sheet Tab
Header Tab
Menu Tab
ISAN Research Group
Joomla! 2.5 Training
Artisteer 4 Menu [4]
Blocks Tab
Vertical Menu Tab
Controls Tab
ISAN Research Group
Joomla! 2.5 Training
Artisteer 4 Menu [5]
Footer Tab
ISAN Research Group
Joomla! 2.5 Training
Artisteer 4 Workshop
Assignment Workshop 2
ส่ร!าง Template ข้อง Joomla! 2.5 ด!วย Artisteer 4 โดยออกแบบต์ามูความูต์!องการข้องผ#!เข้!ารบการอบรมู จัากน�นท,าการ Export งานออกมูา แล!วน,าไป็ท,าการทดลองต์+ดต์�งบน Joomla! ท(�ต์+ดต์�งไว!บน Server ข้องต์น พิร!อมูท�งต์รวจัส่อบว�าส่ามูารถท,างานได!หร อไมู� และแส่ดงผลหน!าเว$บได!ต์ามูท(�ออกแบบไว!ในโป็รแกรมู Artisteer 4 หร อไมู�
Assignment Workshop 1
ท,าการต์+ดต์�ง Artisteer 4 ลงในเคร �องข้องผ#!เข้!ารบการอบรมู จัากน�นทดลองใช้!งานเมูน#ต์�างๆ ข้องโป็รแกรมู
ISAN Research Group
Joomla! 2.5 Training
Relax
Time Out
ISAN Research Group
Joomla! 2.5 Training
Joomla! Extensions
Extension Directory
http://extensions.joomla.org/
http://www.joomlacorner.com http://www.joomla.org
http://www. wordpressplus.orghttp://www.scriptmafia.org
ISAN Research Group
Joomla! 2.5 Training
Recommended Site
http://http://www.cmsplugin.com
LOGO
Question & Answer
ISAN Research Group
Joomla! 2.5 Training