Download pptx - Joomla! final

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


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


Introduction

ISAN Research Group


Joomla! เป็�นระบบจัดการเน �อหา “Content Management System” (CMS) ป็ระเภท Open Source ซึ่��งป็�จัจั�บน Version 2.5 และ 3.0

“ หั�วใจของการทำ�าเว�บไซต์� คื�อ ข�อมู�ลทำ��อ�พเดต์ เคืล��อนไหัวต์ลอดเวลา มู!ใช่#เพ�ยงแคื#หัน�าต์าทำ��สวยงามู ”

What is Joomla!

Introduction to Joomla! [2]

ISAN Research Group


Why Joomla!

สามูารถจ�ดการเน�(อหัาภายในเว�บไซต์�ได�อย#างเป็+นระบบ

ไมู#ต์�องมู�คืวามูร��ในการเข�ยนโป็รแกรมูหัร�อฐานข�อมู�ล

ใช่�ระยะเวลาส�(นในการพ�ฒนาเว�บไซต์�

เป็+น Open Source จ0งสามูารถใช่�งานได�ฟร�มู�กล2#มูผู้��ใช่�และน�กพ�ฒนาอย�#ทำ��วโลก จ0งมู�การพ�ฒนาอย�#อย#างต์#อเน��อง

สามูารถน�าโป็รแกรมูเสร!มูต์#างๆ มูาเพ!�มูป็ระส!ทำธิ!ภาพของเว�บไซต์�ได�

Abilities

Intranet

PersonalWebsite Corporate

Website

E-Commerce

Community

Joomla! 2.5

สามูารถน�ามูาใช่�เป็+น

ISAN Research Group


Example Website

ISAN Research Group


Discover over 3187 Government web sites built with Joomla!

Interface

Front-End

เป็�นส่�วนแส่ดงผลข้!อมู#ลข้องเว$บไซึ่ต์'

Joomla!Interface

Back-End

เป็�นส่�วนท(�ใช้!ในการบร+หารจัดการเว$บไซึ่ต์'

ISAN Research Group


Interface [2]

ISAN Research Group


Front End

Top Menu

Web ContentSide Menu

Interface [3]

ISAN Research Group


Back End

Information Panel

Shortcut Button

Menu Bar

Installation Type

Installing

Local Host

Apache

MySQL

PHP

Apache

MySQL

PHP

ISAN Research Group


Web Hosting

ISAN Research Group


Installing Workshop

Assignment Workshop

ท,าการต์+ดต์�งโป็รแกรมูจั,าลอง Server ลงบนเคร �องคอมูพิ+วเต์อร'ข้องผ#!เข้!ารบการอบรมู จัากน�นท,าการ Copy ไฟล'ข้!อมู#ลข้อง Joomla! ลงใน Local Host เร(ยก http://localhost:8080 เพิ �อต์รวจัส่อบการท,างาน จัากน�นส่ร!างฐานข้!อมู#ลใน MySQL ด!วย PHPMyAdmin แล!วท,าการต์+ดต์�ง Joomla! 2.5 จัากน�นทดลองเร(ยกหน!า Front-End และ Back-End เพิ �อต์รวจัส่อบผลการต์+ดต์�ง

ISAN Research Group


Installing Web Server

Installing Web Server

USBWebserver Version 8.5

ISAN Research Group


Installing Workshop

http://localhost:8080

ISAN Research Group


Installing Workshop [2]

Create MySQL Database User: root

Password: usbwhttp://localhost:8080/phpmyadmin/

1

ISAN Research Group



Create MySQL Database

2

ISAN Research Group




3 4

ISAN Research Group




5

ISAN Research Group



Installing Joomla!http://localhost:8080/joomla

1

2

ISAN Research Group



Installing Joomla!

3

ISAN Research Group



Installing Joomla!

4

ISAN Research Group



Installing Joomla!

6

5

ISAN Research Group



Installing Joomla!

7

ISAN Research Group



Installing Joomla!

8

9

ISAN Research Group



Installing Joomla!

10

ISAN Research Group



Installing Joomla!

11

ISAN Research Group



Installing Joomla!

Front-End

ISAN Research Group



Installing Joomla!

Back-End

ISAN Research Group



Installing Thai Language Pack

http://localhost:8080/administrator/

1

ISAN Research Group




2

ISAN Research Group




3

ISAN Research Group




4

ISAN Research Group




5

6

ISAN Research Group




7

8

ISAN Research Group




9

10

ISAN Research Group




11

ISAN Research Group



Installing Extension

1

ISAN Research Group




2

3

4

5

ISAN Research Group




6

ISAN Research Group



Enable JCE Editor Extension

1

ISAN Research Group



Enable JCE Editor Extension

2

3

4

ISAN Research Group


Relax

Time Out

ISAN Research Group


Publish

ISAN Research Group


Publish [2]

Workshop: Let’s go! Publish your first Article…

ISAN Research Group


Structure

Joomla! Structure

ISAN Research Group


Structure [2]

Section Category Article

หัมูวดหัมู�#หัล�ก หัมูวดหัมู�#ย#อย บทำคืวามู/หัน�าเพจ

Create Step

ISAN Research Group


Structure [3]

Section Category Article

หัมูวดหัมู�#หัล�ก หัมูวดหัมู�#ย#อย บทำคืวามู/หัน�าเพจ

Delete Step

ISAN Research Group


Create Site

Section CategoryTop menu - หน!าแรก

- บ�คลากร- ข้�าวป็ระช้าส่มูพินธ์'- ภาพิก+จักรรมู- ต์+ดต์�อเราMain

menu- ป็ระวต์+โรงเร(ยน- ว+ส่ยทศน'/ป็รช้ญา- พินธ์ก+จั/เป็6าหมูาย- ท,าเน(ยบผ#!บร+หาร- กล��มูส่าระว+ช้า- ป็ฏิ+ท+นป็ฏิ+บต์+งาน- ข้!อมู#ลนกเร(ยน- ผลงานนกเร(ยน

ISAN Research Group


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


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


Template Layouthttp://localhost:8080/joomla/?tp=1

ISAN Research Group


Relax

Time Out

ISAN Research Group


User Management

User Group

Public ผ#!ใช้!ท�วไป็Manager ผ#!บร+หารจัดการข้!อมู#ลต์�างๆ ในเว$บไซึ่ต์'Administrator

ผ#!ด#แลระบบ ส่ามูารถเป็:ด/ป็:ด/ต์+ดต์�งการท,างาน

Super User ผ#!มู(ส่+ทธ์+ส่#งส่�ดในการบร+หารจัดการเว$บไซึ่ต์'Registered ส่ามูารถเข้!าใช้!งานเว$บไซึ่ต์'ได!ต์ามูป็กต์+Author ส่ามูารถเข้(ยนบทความูได! แต์�เผยแพิร�ไมู�ได!Editor ส่ามูารถเข้(ยน/แก!ไข้บทความูได! แต์�เผย

แพิร�ไมู�ได!Publisher ส่ามูารถเข้(ยน/แก!ไข้บทความูได! และเผย

แพิร�ได!

ISAN Research Group


User

User Add

1

1

ISAN Research Group


User [2]

User Add

2

3

ISAN Research Group


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 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


Template Building

Artisteer Version 4

ISAN Research Group


Artisteer 4 Overview

Menu Tab

Work Space

Page Menu

ISAN Research Group


Artisteer 4 Menu

Home Tab

Edit Tab

Colors & Fonts Tab

ISAN Research Group


Artisteer 4 Menu [2]

Layout Tab

Content Tab

Background Tab

ISAN Research Group



Sheet Tab

Header Tab

Menu Tab

ISAN Research Group



Blocks Tab

Vertical Menu Tab

Controls Tab

ISAN Research Group



Footer Tab

ISAN Research Group


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


Relax

Time Out

ISAN Research Group


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


Recommended Site

http://http://www.cmsplugin.com

LOGO

Question & Answer

ISAN Research Group
