joomla day1
Post on 08-May-2015
2.860 Views
Preview:
TRANSCRIPT
Joomla! Day1
Phusit Konsurin
Payap University
2 Phusit Konsurin, Payap University
Day 1
1. Introduction to CMS and Joomla! What is CMS? Structure of a Web Content Management System (WCMS) Joomla! Version and Roadmap
2. Installing Joomla and setting up of the sql database Technical Requirements Jooma! Elements System Installation Setting Local Server Joomla! Installation
3 Phusit Konsurin, Payap University
Day 1 (Continued)
3. New Jooma! Website Tour FrontEnd BackEnd
4. Customizing Joomla! A Different Language for the Website and th
e Administrator Changing the Template for Your Website
4 Phusit Konsurin, Payap University
Day 1 (Continued)
5. Configuration Joomla! with Administrator Screen Layout
Control Panel User Manager Media Manager Global Configuration
6. The Menu Menus Customizing an Existing Menu
1.Introduction to CMS and Joomla!
6 Phusit Konsurin, Payap University
What is CMS?
Content Management System (CMS) contains the terms content and management, which imprecisely refer only to a system that manages content.
A content management system, or CMS, is a computer software system used to enable and organize the joint process of creating and editing text and multimedia documents (content).
7 Phusit Konsurin, Payap University
What is CMS?
The webmaster creates a bottleneck between the Content Contributors and Site Visitors. Updates to your site aren't available to your Site Visitors without first going through the webmaster.
Web Designer
Content Contributors
Webmaster
Editor/approvers
Site Visitor
Websitehttp://www.abc.com
FTP
Web Mainteneace Typically works (or doesn’t) now
8 Phusit Konsurin, Payap University
What is CMS?
•Design Managers create templates (editable content regions and non-editable design/navigation features) within the CMS.•Content Contributors write or place content in the page templates.•Editor and Approver review and edit the information as necessary.Once approved, the webpage is published via FTP to the website (the server) where Site Visitors can access it.
Content contributorsDesign manager
Editor
Site Visitor
CMS Websitehttp://www.abc.com
Approver
Administrator
9 Phusit Konsurin, Payap University
Open Source CMS
Open Source Content Management Systems have become one of the real open source success stories.
The three most popular open source CMS in the nonprofit sector are:JoomlaDrupalPlone
10 Phusit Konsurin, Payap University
Joomla!
Joomla! belongs to the category of Web Content Management Systems (WCMS), since its functionality is administered from a browser on the Web.
11 Phusit Konsurin, Payap University
Joomla! Joomla is an open source CMS based on PHP
and MySQL It can be installed and run on any server with
Apache, MySQL and PHP (including Linux/UNIX, Windows and Macintosh)
It is very easy to install (many web hosts have 'one-click' installation
It is considered the most user-friendly of the 'big three' open source CMS projects
12 Phusit Konsurin, Payap University
Joomla! Version and Roadmap
Joomla! release versioning follows a numerical convention comprised of three numbers:
Major, Minor and Maintenance. Major Release Number (X.1.1) Minor Release Number (1.X.1) Maintenance Release Number (1.1.X)
Joomla! 1.0.X (1.0.0 – 1.0.15) (Dec,2008)
Joomla! 1.5.X (1.5.0 – 1.5.8) (Dec,2008)
13 Phusit Konsurin, Payap University
Structure of a Web Content Management System (WCMS)
Front End : is the website that the visitors and the logged-on
users see Back End :
contains the administration layer of the website for the administrators. Configuration, maintenance, cleaning, the generation of statistics, and new content creation
Access by authorized people
14 Phusit Konsurin, Payap University
Structure of a Web Content Management System (WCMS)
15 Phusit Konsurin, Payap University
Structure of a Web Content Management System (WCMS)
Access Rights Content
Text Pictures Music Video Links Applications
Extensions Components modules templates plug-ins
2.Installing Joomla and setting up of the sql database
17 Phusit Konsurin, Payap University
Technical Requirements
Requirements for Joomla 1.5.x
Software Recommended Minimum
PHP 5.2 + 4.3.10
MySQL 4.1.x + 3.23
Apache(with mod_mysql, mod_xml,and mod_zlib)
2.x + 1.3
Microsoft IIS 7 6
18 Phusit Konsurin, Payap University
Technical Requirements
Requirements for Joomla 1.0.x
Software Recommended Minimum
PHP 5.2 + 4.2
MySQL 4.1.x + 3.23
Apache(with mod_mysql, mod_xml,and mod_zlib)
2.x + 1.3
Microsoft IIS 7 6
19 Phusit Konsurin, Payap University
Jooma! Elements System Installation
You can: Set the system up locally on your PC Set the system up on a server in an organization's
Intranet Rent a virtual server from a provider Rent or purchase a server from a provider (with root
access) You can also:
Have the web server and database located on computers that are physically separated from each other
20 Phusit Konsurin, Payap University
Setting Local Server
Windows Operating System For a Windows operating system you can use eit
her of two web servers: Windows XP Professional and Windows Vista Ultimat
e both come with a web server, the Internet Information Server. You still have to install PHP and a database, and then you're ready.
You take a preconfigured package (XAMPP or AppServ Open Project), unpack it on your computer, and everything you need is there
21 Phusit Konsurin, Payap University
AppServ Open Project
Package of AppServApachePHPMySQLphpMyAdmin
22 Phusit Konsurin, Payap University
AppServ Installation 1
23 Phusit Konsurin, Payap University
AppServ Installation 2
24 Phusit Konsurin, Payap University
AppServ Installation
25 Phusit Konsurin, Payap University
AppServ Installation
26 Phusit Konsurin, Payap University
AppServ Installation
27 Phusit Konsurin, Payap University
AppServ Installation
MySQL Password
Choose Thai Char.
Set and Collations
(utf-8)
28 Phusit Konsurin, Payap University
AppServ Installation
29 Phusit Konsurin, Payap University
AppServ Installation
30 Phusit Konsurin, Payap University
AppServ Installation
31 Phusit Konsurin, Payap University
AppServ Installation
The Location of AppServ and System Elements
Your web site were located in this directory
You must install Joomla! Here.
32 Phusit Konsurin, Payap University
setting up of the sql database
Go to http://localhost Create a database for your joomla site.
33 Phusit Konsurin, Payap University
setting up of the sql database
In phpMyAdmin Program Create a database for your joomla site.
Enter the name of database is using in the Joomla site.
Select character set of your database.
34 Phusit Konsurin, Payap University
Joomla! Installation
Unpacking you can finally unpack the package file
Joomla_1.5.7-Stable-Full_Package.zip into the designated directory.
C:\AppServ\www\joomla
35 Phusit Konsurin, Payap University
Joomla! Installation
Joomla! Web InstallerGo to http://localhost/joomla/
36 Phusit Konsurin, Payap University
Joomla! Installation
Step 1: Language Selection Choose Language is the first of a total of seven installation steps.
Select the desired language and click on the Next button.
37 Phusit Konsurin, Payap University
Joomla! Installation
Step 2: Pre-Installation Check Next, you will see the Pre-Installation check. This check should help
you determine whether your server environment is suitable for a Joomla! installation.
38 Phusit Konsurin, Payap University
Joomla! Installation
Step 3: Licence Every piece of software is licensed under certain conditions.
Joomla! uses the GNU/GPL licence, version 2.0.
39 Phusit Konsurin, Payap University
Joomla! Installation
Step 4: Database Configuration
joomladb
40 Phusit Konsurin, Payap University
Joomla! Installation
Step 5: FTP Configuration (This is not necessary in the local)
41 Phusit Konsurin, Payap University
Joomla! Installation
Step 6: Configuration This main step of the configuration is
divided into three parts.configuration has to do with the name of your
website.
webms@localhoat
This is a password of admin using for
logon to Back-end,Front-endใ
42 Phusit Konsurin, Payap University
Joomla! Installation
Final Step: you should be remove “installation” subdirectory from your joomla location.
43 Phusit Konsurin, Payap University
Check your site after installed
3. New Jooma! Website Tour
45 Phusit Konsurin, Payap University
Front End
Layout of Front End
“rhuk_milkyway “
46 Phusit Konsurin, Payap University
Menus Content Advertising Additional functions
47 Phusit Konsurin, Payap University
Menus
There are different menus for different tasks. Top Menu Main Menu/Breadcrumbs Other Menus
48 Phusit Konsurin, Payap University
Content
Content can be a message, an editorial article, or a static page, a dynamic link directory and so on …
49 Phusit Konsurin, Payap University
First Page/Front Page
Content is announced on the first page of the website
50 Phusit Konsurin, Payap University
The Newest Information/The Most Often Read Messages
The newest information in your joomla! Site.
The most often read in your joomla! Site.
51 Phusit Konsurin, Payap University
Advertising
Advertising space usually means banner links. Banners are small graphics (.gif, .jpg, .png, or .swf format)
52 Phusit Konsurin, Payap University
Additional functions(Login Area)
A login module is important if you want to split your website into a public and a protected area.
53 Phusit Konsurin, Payap University
Additional functions
Polling Who is Online?
54 Phusit Konsurin, Payap University
Additional functions
Feeds The Syndication module offers the websit
e's news feed.
Search Field they only search through a portion of the w
ebsite. With Joomla!
55 Phusit Konsurin, Payap University
Back end
The administration of the website takes place in the back end in the Joomla! Administration.
You can get to the Joomla! administration under the URL
http://localhost/administrator/
56 Phusit Konsurin, Payap University
Back end
Log on with your ID, admin. You had specified the user data yourself in the web installer during installation.
57 Phusit Konsurin, Payap University
Back end control panel
4.Customizing Joomla!
59 Phusit Konsurin, Payap University
Different Language for the Website and the Administrator
Installation of a Different Language File click on Extensions | Install Browse for Language file upload file & Install
go to the language manager by clicking on Extension | Language Manager. You will see the available languages here
60 Phusit Konsurin, Payap University
Changing the Template for Your Website
the default version of Joomla! 1.5.x comes with the following templates: (Khepri, rhuk_milkyway, Beez.)
61 Phusit Konsurin, Payap University
Template Standpoint
Access Level: Who can see what. Front-end: Public Web site. Back-end: Website manager or Back Office.
62 Phusit Konsurin, Payap University
Template Parts and Concepts
Joomla is made up of mostly five parts
1. Content
2. Component's
3. Module's
4. Plug-in's
5. Templates
63 Phusit Konsurin, Payap University
Template Parts and Concepts
All of these parts come together and are displayed via the template at design time.
64 Phusit Konsurin, Payap University
Template Framework
65 Phusit Konsurin, Payap University
switch the template
Use Extensions | Templates Manager to get to the template area select the radio button in front of the name of the desired template and click
the Default
66 Phusit Konsurin, Payap University
Installing templates
Go to the Extensions | Install/Uninstall menu. Click on the Browse button and upload the templates file. Click on the Upload & Install file button.
67 Phusit Konsurin, Payap University
four types of Joomla templates.
1. Standard Template
2. Template Override
3. Conditional Template
4. Legacy Template
68 Phusit Konsurin, Payap University
File Structure of the Template
The default Joomla Template for Joomla 1.5.X
5.Configuration Joomla! with Administrator
70 Phusit Konsurin, Payap University
Screen Layout
Menu Bar
Tool Bar
Submenus
71 Phusit Konsurin, Payap University
Screen Layout
Filter Elements
Lists
72 Phusit Konsurin, Payap University
Control Panel
the start page of the administration section
73 Phusit Konsurin, Payap University
User Manager
You can set up as many users as you want and, depending on their rights, they can create their own content and/or view content that has been created for particular users.
74 Phusit Konsurin, Payap University
Edit Users Icon you can see that there are three fields:
1. User Details
2. Parameters
3. Contact Information
75 Phusit Konsurin, Payap University
User Group
The following table shows the front‑end user group:
76 Phusit Konsurin, Payap University
User Group
The following table shows the back‑end user group:
77 Phusit Konsurin, Payap University
Media Manager
This manager is especially useful if you don't have FTP access even though you have administration rights.
•Thumbnail View, which displays preview icons of the files, and the
•Detail View, which displays the name and size of the files in a list.
78 Phusit Konsurin, Payap University
Creating Directories
In the Files section
79 Phusit Konsurin, Payap University
Uploading a File
You can upload files with bmp, csv, doc, epg, gif, ico jpg, odg, odp, ods, odt, pdfpng, ppt, swf, txt, xcf, xlsBMP, CSV, DOC, EPG, GIF, ICOJPG, ODG, ODP, ODS, ODT, PDFPNG, PPT, SWF, TXT, XCF, XLS
80 Phusit Konsurin, Payap University
Global Configuration
you can define all the settings that are valid for the entire website.
The values of the variables are saved in the configuration.php file.
The work area is divided into three tabs:Site SettingsSystem SettingsServer Settings
81 Phusit Konsurin, Payap University
Global Configuration
82 Phusit Konsurin, Payap University
Site Settings Site Offline: If you want to make changes to you
r website and inform your visitors. Offline Message: The text that you enter here is
displayed in the top area of your website when it is "offline".
83 Phusit Konsurin, Payap University
Site Settings
Site Name: The name of the site that you entered during the installation
Default WYSIWYG Editor: WYSIWYG is the acronym for What you see is what you get
A WYSIWYG-editor is more user-friendly since you just have to click on the appropriate icons, similar to editing text.
84 Phusit Konsurin, Payap University
Metadata Settings
Metadata are important with search engines. metadata represent a good way to describe your
website in short and precise words.
85 Phusit Konsurin, Payap University
SEO (Search Engine Optimization) Settings
A Joomla! URL looks like this:
150http://www.example.com/Joomla /index.php?option=com_cont&=3
This type of URL is not normally stored by search engines.
86 Phusit Konsurin, Payap University
SEO (Search Engine Optimization) Settings
Search Engine Friendly URLs: With this switch you can transform a dynamic URL into a search engine‑friendly URL.
If you set this switch to Yes, the link will look something like this: http://localhost/joomla150/contact
87 Phusit Konsurin, Payap University
SEO (Search Engine Optimization) Settings
Use Apache mod_rewrite: This switch activates the mod_rewrite module.
Besides activating the switch, you also have to rename the htaccess.txt file in the Joomla! directory to .htaccess.
88 Phusit Konsurin, Payap University
SEO (Search Engine Optimization) Settings
Add a suffix to URLs: This appends a .html to the URL after the file name extension
Example : URL Search Engine friendly URLs :
http://www.yourdomain.com/joomla/index.php/yourcontent
URL suffix : http://www.yourdomain.com/joomla/index.php/yourcontent.html
89 Phusit Konsurin, Payap University
System Settings
C:\Appserv\www\joomla\logs
90 Phusit Konsurin, Payap University
Users Settings
Allow User Registration: you want to permit users to do their own registration or not.
New User Registration Type: you can define to which user group the newly registered user will
be assigned. New User Account Activation:
protect yourself from automated programs automatically create huge user accounts on your site, you can a
sk for separate activation. After registration Front-end User Parameters:
users can set up their own language and time-zone
91 Phusit Konsurin, Payap University
Media Settings You can define the extensions for files that
are acceptable to be uploaded and paths into which these files are to be saved:
92 Phusit Konsurin, Payap University
Cache Settings This option can drastically reduce response time
with frequently visited pages Cache: This is where you enable and disable the cac
he. Time: You define the time that has to pass before con
tent in the cache has to be renewed. Cache Handler: You define here whether the cache i
s to be file-based or database-based (at the moment only file caching has been implemented).
93 Phusit Konsurin, Payap University
Session Settings Session Lifetime: Whenever you log on as a user, you
create a so-called session. If you don't log out, the session will be terminated after the duration entered here.
Session Handler: Here you define whether it should be a file-based or database‑based session. In high-traffic websites the database-based method is substantially faster than the file-based method.
94 Phusit Konsurin, Payap University
Server Settings
Path To The Temp-folder: Joomla! creates temporary files, for example during an upload. These have to be stored somewhere in the interim and this is wh
ere you can decide where that is
GZIP Page Compression: This can significantly increase the speed of a page download, in
particular with slow Internet connections.
C:\Appserv\www\joomla\tmp
95 Phusit Konsurin, Payap University
Locale Settings
Time Zone: This setting can be used to display the time zone your server operates under.
96 Phusit Konsurin, Payap University
FTP Settings & Database Settings
<?php class JConfig { var $dbtype = 'mysql'; var $host = 'localhost'; var $user = 'root'; var $password = ''; var $db = 'Joomla150'; var $dbprefix = 'jos_'; // … // many other variables // ---}?>
configuration.php
97 Phusit Konsurin, Payap University
Mail Settings Mailer:
built-in PHP mail function, the Sendmail program or another e-mail account such as Yahoo!, Google, or GMX.
Mail from: This email address is automatically entered as sender of Joomla!-generated mail.
From Name: This name is also automatically entered as sender of Joomla!-generated mail.
Sendmail Path: If you want to use the Sendmail program that presumably can be used on all Linux servers instead of the PHP mail function, you have to enter the path to the program here.
SMTP Authentication: Select if you want to use an external mail server (Yahoo!, GMX, your own server).
SMTP Username: Your username with this email provider. SMTP Password: Your password with this email provider. SMTP Host: The SMPT server of this email provider.
6.The Menu
99 Phusit Konsurin, Payap University
The Menu in Joomla!
Joomla! have 4 default menus main menu top menuother menuuser menu
Menu
Menu item
100 Phusit Konsurin, Payap University
Menu Manager
In this section you can, for instance, copy a menu or create a new one.
101 Phusit Konsurin, Payap University
Customizing an Existing Menu
Go to the menu item Menus | Main Menu.
102 Phusit Konsurin, Payap University
Edit Icon (Edit Menu Items) you can modify an existing menu
103 Phusit Konsurin, Payap University
Menu Item Type
104 Phusit Konsurin, Payap University
Creating a New Menu
Go to Menus | Menu Manager | New
top related