Download - Amherst Partners

engineachooInternet and Web Development

Dec 4, 2013 (3 years and 9 months ago)

137 views











People behind this book


W
r
i
t
e
r
s



D
a
o
N
g
oc

Anh

Bui Thi Mo



Edi
t
o
r
s



N
g
u
y
e
n Thi Th
a
nh H
u
y
e
n

B
ui Anh Tu
a
n

B
ui H
u
y

Th
a
n
g


Designer



Ho H
u
y

Tu
n
g


L
uu Minh
S
on


Proo
f
re
a
der



S
andra

Newt on


P
ubli
ca
tion d
a
t
e
:

July

2013


The third

Edition.



Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

3









Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


4

Contents

People behind this book

................................
................................
................................
................................
..

2

Contents

................................
................................
................................
................................
...............................

4

Joomla! 3.x features

................................
................................
................................
................................
.........

5

S
tep

1:

G
e
t

to kn
o
w Joomla!

C
MS

................................
................................
................................
................

6

W
hat

is

Joomla!

CM
S
?

................................
................................
................................
................................
..................

6

W
hat

is
Joomla!

made

o
f
?

................................
................................
................................
................................
..........

10

Step

2: Install Joomla! 3.x on localhost

................................
................................
................................
....

27

Install XAMPP

................................
................................
................................
................................
................................

28

Install Joomla!

................................
................................
................................
................................
...............................

32

Step 3:
Create content for
your

Joomla! site

................................
................................
...........................

34

Prepare a content structure

................................
................................
................................
................................
.......

34

Create content

................................
................................
................................
................................
...............................

35

Manage your content with JSN PowerAdmin

................................
................................
................................
.......

51

Make articles look good

................................
................................
................................
................................
..............

52

S
tep

4:

C
ustom
i
ze
y
our
w
ebs
it
e appear
a
nce
w
i
th a

Joomla! te
m
p
l
a
t
e

................................
............

79

W
hat

is

a

Joomla!

t
e
m
pla
t
e?

................................
................................
................................
................................
.....

79

Ch
o
ose

a

Joomla!

t
e
mp
l
a
t
e

................................
................................
................................
................................
.......

81

Ins
t
al
l

a

Joomla!

t
e
mp
l
a
t
e

................................
................................
................................
................................
..........

83

S
tep 5:

A
r
r
ang
e

modu
l
es
i
n

p
os
i
t
i
ons
................................
................................
................................
........

88

W
hat

is

a

Joomla!

m
o
dule

and

p
osi
t
i
o
n
?

................................
................................
................................
...............

88

A
d
d

a n
e
w

m
odu
l
e

t
o

a

p
a
ge

................................
................................
................................
................................
.....

92

S
tep

6:

E
xtend
w
eb
s
i
te func
t
i
ona
li
ty

w
i
th Joomla! extens
i
ons

................................
..........................

99

W
ork

w
i
t
h

t
h
e

de
f
a
ult

e
x
t
e
n
s
ion


C
o
n
t
a
c
t
s”

................................
................................
................................
.......

100

A
dd

n
e
w

ex
t
ensi
o
ns

................................
................................
................................
................................
..................

111

S
tep

7
:

Manage

your Joomla! websites with JSN PowerAdmin

................................
.......................

116

Manage Joomla! website with Site Manager

................................
................................
................................
.......

119

Quick access to any items with Spotlight Search

................................
................................
.............................

132

Manage template styles with Template Style Manager

................................
................................
....................

134

Other features

................................
................................
................................
................................
.............................

138

Configuration

................................
................................
................................
................................
...............................

142

C
onc
l
us
i
o
n

................................
................................
................................
................................
......................

145

R
eferences

................................
................................
................................
................................
.......................

146



Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

5

Joomla!

3.
x

features

Joomla!

3.x

is a whole new
exciting
world with a lot of cool improvements. You can check out
six
great
features in the infographic below.

For m
ore information about
Joomla!

3.x

features, you should go to
http://www.joomla.org
/3/en
.


Six

great
features

of
Joomla!

3.x


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


6

S
tep

1:

G
e
t

to kn
o
w
Joomla!

C
MS

I
n the

p
a
st if

y
ou n
ee
d
e
d

a

w
e
bsit
e
, the

on
l
y

option w
a
s to hi
r
e

a

p
r
o
fe
ssi
o
n
a
l w
e
b studio to
b
uild it

a
nd
then
you were
f
ul
l
y
re
l
iant

on t
h
e
m to m
a
int
a
in it.
B
ut now, with the

r
ise

of

fr
e
e

op
e
n sou
r
c
e

so
f
t
w
are
,

y
ou
c
a
n
e
a
si
l
y

build

a

w
e
bsite
y
o
u
r
s
e
lf

b
y

using a

Cont
e
nt M
a
n
a
g
e
m
e
nt
S
y
st
e
m

(CM
S
). Th
er
e

a
r
e

s
e
v
e
r
a
l CM
S

s
ar
ound, but the

most suit
a
ble

f
or

a

sm
a
ll / m
e
d
i
um w
e
bsite

is
Joomla!
.

I
n this s
e
c
tion

y
ou will
h
a
ve

a

b
r
i
e
f

int
r
odu
c
tion
t
o
Joomla!

a
nd wh
a
t it is

m
a
de

o
f
.

W
hat

is

Joomla!

CM
S
?


Joomla!

logo

Joomla!

C
M
S

is
fre
e

w
e
b
-
b
a
s
e
d so
f
t
w
ar
e

whi
c
h
a
l
lows

y
ou to
c
r
ea
te

a
nd
m
a
n
a
g
e

w
e
bsites. You
c
a
n

c
ont
r
ol:

1.

W
e
bsite

c
on
t
e
nt like t
e
x
t,

photos, vid
e
os,
e
t
c
.

2.

W
e
bsite

a
pp
ea
r
a
n
c
e

b
y

u
tili
z
ing

t
e
mpl
a
tes

3.

W
e
bsite

f
un
c
tion
a
lit
y

by utili
z
ing

e
x
t
e
nsions.

Th
er
e

ar
e

two
p
ar
ts of

the

s
y
s
t
e
m:

the
fr
on
t
-
e
nd
(what the public see)
a
nd
the
b
a
c
k
-
e
nd

(what administrators
see)
.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

7

T
he

f
ro
n
t
-
e
n
d

The

fr
on
t
-
e
nd is wh
a
t p
e
ople

s
e
e

wh
e
n

th
e
y

visit

y
our

we
bsit
e
.
No
r
m
a
l
l
y

th
er
e

are standard items including
a

l
o
g
o, m
e
nu b
a
r
, side
c
olumn
a
nd m
a
in t
e
x
t
packaged up
in
a

c
ool d
e
s
i
g
n.


T
he

w
e
bsite

fron
t
-
e
nd


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


8


Vi
e
wing

an
arti
c
le
in the
fron
t
-
e
nd

T
he

ba
c
k
-
e
n
d

The

b
ac
k
-
e
nd is the

a
dm
i
nist
ra
tion
are
a

and
is w
h
er
e

y
ou
c
ont
r
ol

y
o
u
r

w
e
bsit
e
.

A
c
ce
ss

is p
r
ovid
e
d v
i
a a

sp
ec
i
a
l
l
o
g
in p
a
g
e

a
nd on
l
y

f
or

u
s
er
s with
a
dminist
ra
tor

p
er
mission.


T
he
Joomla!

ba
ck
-
e
nd


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

9


Editing

an arti
c
le in the

ba
c
k
-
e
nd




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


10

W
hat

is
Joomla!

made

o
f
?

Now, l
e
t

s
e
x
plo
r
e

the

m
a
in p
ar
ts of

Joomla
!

Content

I
n
Joomla!
,
c
ont
e
nt
c
onsi
s
ts of

ar
t
i
c
l
e
s,
c
a
t
e
g
o
r
i
e
s

a
nd m
e
di
a
.

A
r
t
i
c
l
e
s

A
r
ti
c
l
e
s
a
r
e

the

m
a
in building

blo
c
ks of

a

Joomla!

w
e
bsit
e
.

In
the

fr
on
t
-
e
nd

y
ou
c
a
n
e
a
si
l
y

r
ec
o
g
ni
z
e

a
n
ar
ti
c
le
a
s a

pi
e
c
e

of

t
e
x
t with
/without

i
m
a
g
e
s
,

p
re
s
e
nt
e
d in the

m
a
i
n
c
ont
e
nt
ar
e
a
.


T
he

arti
c
le


Getting started”

At the

b
ac
k
-
e
nd,
ar
ti
c
l
e
s
ar
e

m
a
n
a
g
e
d
using
the

A
rt
i
c
le

M
a
n
ag
er


which is

a
c
ce
s
s
ible

via

the

m
e
nu
“Co
n
te
n
t

=
>

“A
rt
i
c
le

M
a
n
ag
er

.




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

11


T
he


Article

M
anag
e
r


H
ere
,

y
ou

ca
n
c
r
e
a
te

n
e
w

ar
ti
c
l
e
s,
e
dit th
e
m,
c
hoo
s
e

to publish
or

unpublish

th
e
m

e
t
c
.

C
a
t
e
gori
e
s

C
a
t
e
g
o
r
i
e
s h
e
lp

y
ou to

o
r
g
a
ni
z
e

y
our

ar
ti
c
les mo
r
e

c
onv
e
ni
e
nt
l
y
.

You
c
a
n im
a
g
ine

ca
t
e
g
o
r
i
e
s
a
s
f
ol
d
er
s
c
ont
a
ining

f
il
e
s.

F
or

e
x
a
mpl
e
,

a

ca
t
e
g
o
r
y


Produ
c
ts”

ca
n
c
ont
a
in
a
ll
a
r
ti
c
l
e
s
a
bout

y
our

p
r
od
u
c
ts. O
r
,

a
ca
t
e
g
o
r
y


About Us”

ca
n

c
ont
a
in

ar
ti
c
l
e
s like


O
u
r
Company

,

Our
V
ision

,

Board of Dir
ec
tor

,

e
t
c
.

In
the

b
ac
k
-
e
nd,
ca
t
e
g
o
r
i
e
s
ar
e

m
a
n
a
g
e
d
using the

“C
a
t
e
go
r
y
M
a
n
ag
er


ac
c
e
ssible via

the

m
e
nu
“Co
n
te
n
t

=
>

“Ca
te
go
r
y

M
a
n
ag
er

.


T
he


Cat
e
gory

M
anag
e
r


H
ere
,

y
ou

ca
n
c
r
e
a
te

n
e
w

ca
t
e
g
o
r
i
e
s,

e
dit th
e
m,
c
h
oose

to publish or

unpublish

th
e
m
,
e
t
c
.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


12

Tags

Tags are keywords or terms assigned to a piece of information. It describes the content of the item. For
example, you might add tags
“Joomla
!

template
s


and
“Joomla
!

extension
s”

to the article
“Getting Started

with Joomla!

.


Items with similar tags will be grouped together so that people can search for them easily. You can
also
create
a menu item (or a module) to display
tags that you create
.

In the back
-
end, tags are located in the
article editing

dashboard. You go to

Content”

=>

Article Manager”

then
access the individual
article
s

to assign tags.



Tag


function lets you assign keyword
s

to a particular item

or article

To manage all your t
ags, you
can
go to
“Component


=>
“Tags



Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

13


Go to

Components


-
>

Tags


to manage your tags

Media

S
imp
l
y

put,
m
e
dia

is
n
o
n
-
t
e
x
t stu
f
f

th
a
t

y
ou
ca
n

put

into

y
o
u
r

c
ont
e
nt. T
h
is
ca
n be

not on
l
y

im
a
g
e
s
, but
a
lso
vid
e
os
a
nd oth
e
r

multim
e
dia

e
l
e
m
e
nts.

M
e
dia
is
m
a
n
a
g
e
d
using the


Me
d
ia
M
a
n
ag
er


a
c
c
e
ssible

via

the
m
e
nu
“Co
n
te
n
t


=
>


M
e
d
ia

M
a
n
ag
er

.


T
he


Media
M
anag
e
r


H
ere
,

y
ou

ca
n
c
r
e
a
te

n
e
w

m
e
dia

f
old
er
s,

uplo
a
d

f
il
e
s,
e
t
c
.
W
e

will dis
c
uss using

M
e
dia

M
a
n
a
g
e
r

in mo
r
e

d
e
t
a
il
in the

c
h
a
pt
e
r


Step 3:
C
reat
e

content for
your

Joomla!

s
ite

.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


14

M
en
u
s

M
e
nus h
e
lp w
e
bsite

visito
r
s n
a
vig
a
te

to
a
nd

ac
c
e
s
s
a
ll
area
s
o
f

your

w
e
bsit
e
.

You
ca
n
c
rea
t
e
multiple m
e
nus
a
nd
c
on
f
i
g
u
r
e

th
e
m to be

sh
o
wn
a
t di
ffe
r
e
nt lo
ca
tions

su
c
h
a
s
at the top

a
nd/or

side

c
olumn.


Sample

Menu

I
n the

e
x
a
mple

a
bov
e
, t
h
e

a
dminist
ra
tor

c
r
ea
t
e
d

a

m
e
nu

Home

with s
e
v
era
l
sub
-
m
e
nu

items


G
e
tting
Start
e
d

,

Usi
n
g
Joomla!

,
e
t
c
.

To
c
ont
r
ol m
e
nus,
g
o to
t
he

m
e
nu

manager via


Me
nu
s”

=
>


Me
n
u

M
a
n
ag
er

.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

15


T
he


M
e
nu Manager


in the

Joomla!

administration

In the menu manager
y
ou

ca
n
c
r
e
a
te

m
e
n
us
a
nd m
e
nu it
e
ms

linking

t
o
a
n
y

p
ar
t of

the

w
e
bsite

y
ou
w
a
nt.
W
h
e
n

the m
e
nu is
rea
d
y
y
ou
c
r
e
a
te
a

m
e
nu

module

to

displ
a
y

the

m
e
nu
in

the
fr
on
t
-
e
nd.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


16

Users

Joomla!

a
llows

y
our

w
e
b
s
ite

to h
a
ve

multiple

r
e
g
ist
ere
d us
e
r
s. All us
er
s
a
r
e

arra
n
g
e
d in us
e
r

g
r
oups, whi
c
h
h
a
ve p
er
mission to
a
cce
ss
c
er
t
a
in p
ar
ts of

the

w
e
bsit
e
.

B
y

d
e
f
a
ult th
er
e

ar
e

s
e
v
e
ra
l

us
e
r

g
r
oups s
u
c
h
a
s


Author

,

Editor

,


Publish
e
r

,
e
tc.
F
or

e
x
a
mple:



Us
er
s
a
ss
i
g
n
e
d to


Adm
i
nistrator”

g
r
oup
ca
n
access
both b
ac
k
-
e
nd
a
nd

f
r
on
t
-
e
nd



Us
er
s
a
ss
i
g
n
e
d to


R
e
gi
s
t
e
r
e
d”

g
r
oup

ca
n
o
n
l
y

access
the

f
r
on
t
-
e
nd. You
ca
n m
a
n
a
g
e

us
e
r
s
,
u
s
e
r

g
r
oups
a
nd

ac
c
e
ss l
e
v
e
ls

in the

User Manager via the
m
e
nu

“Us
er
s”
.


T
he

m
e
nu


Us
e
rs”

in
the

ba
ck
-
e
nd


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

17

E
x
t
en
s
ions

E
x
t
e
nsions
ar
e sp
ec
i
a
l
l
y

w
r
itt
e
n

so
f
tw
a
r
e to be p
l
ug
g
e
d into
Joomla!

in o
r
d
e
r

to
e
x
t
e
nd w
e
bsite

f
un
c
tion
a
li
t
y
.
F
or

e
x
a
mpl
e
, if

y
ou w
a
nt

to h
a
ve

a

photo slid
e
sh
o
w, vid
e
o g
a
ll
e
r
y

or

a
n
a
d
v
a
n
ce
d

c
ont
ac
t

f
o
r
m, th
e
n

y
ou

will
n
ee
d to inst
a
ll
e
x
t
e
nsions

f
or

those

pu
r
pos
e
s.

B
y

d
e
f
a
ult

Joomla!

is shi
p
p
e
d with s
e
v
e
r
a
l

e
x
t
e
nsions

c
ov
er
i
n
g

b
a
sic

n
ee
ds.

I
f

y
ou w
a
nt mo
r
e
, th
e
r
e

a
r
e thous
a
nds
of

a
ddition
a
l
Joomla!

e
x
t
ens
i
ons

a
v
a
il
a
ble
from the

Joomla!

E
x
t
ens
i
on

Di
r
ec
t
o
r
y
.

This is the

o
ff
i
c
i
a
l di
rec
to
r
y

of

Joomla!

e
x
t
e
nsio
n
s m
a
int
a
in
e
d
b
y

the
Joomla!

c
o
r
e

t
e
a
m.


T
he

Joomla!

E
x
t
e
nsions

Dir
ec
tory

Th
er
e

ar
e

5
b
a
sic

t
y
p
e
s
o
f

e
x
t
e
nsions:
c
ompon
e
n
t
s, modules, plu
g
-
ins, t
e
m
p
l
a
tes
a
nd l
a
n
g
u
a
ges. E
a
c
h of

th
e
se
e
x
t
e
nsions h
a
ndl
e
s

sp
ec
i
f
ic

f
un
c
tion
a
li
t
y
.

L
e
t

s t
a
ke

a

loo
k
!


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


18

Compon
e
nt
s

A
c
ompon
e
nt

is the

most
c
ompl
e
x

t
y
p
e

of

e
x
t
e
nsio
n
.

I
t

c
a
n be

s
ee
n
a
s

a
n
a
ppli
ca
tion th
a
t

p
erf
o
r
ms

cer
t
a
in t
a
sks
a
nd displ
a
y
s s
p
ec
i
f
ic

c
o
n
t
e
nt

on

y
our

sit
e
.

As m
e
n
tion
e
d b
ef
o
r
e

a

vid
e
o

g
a
l
l
e
r
y

is
a
n
e
x
a
mple

of

a

c
o
mpon
e
nt.

I
t
c
ould
a
lso be

a

shoppi
n
g
car
t,

booki
n
g

s
y
st
e
m
,
f
o
r
um

a
nd mo
re
.


The
“Newsfeed
s
” component at the front
-
end

The

c
ont
e
nt p
r
od
u
ce
d
b
y

a

c
ompon
e
nt is displ
a
y
e
d

in the

m
a
in
c
ont
e
nt
ar
e
a
.

I
n the

e
x
a
mple

a
bov
e
,

y
ou
ca
n s
e
e
a

fee
d list

g
e
n
era
t
e
d
b
y

t
he

c
ompon
e
nt


N
e
wsf
e
e
ds

.

All
c
ompon
e
nts
ar
e

lo
c
a
t
e
d in the

s
ec
tion

“C
o
m
p
o
n
e
n
t
s

.




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

19


The “Components” menu in the back
-
end

B
y

d
e
f
a
ult,

Joomla!

is sh
i
pp
e
d with
f
ollowing

c
o
m
pon
e
nts:


Bann
e
rs

,

C
onta
c
t
s”
,

Me
ssagin
g”
,


N
e
w
s
f
ee
ds

,

R
e
dir
ec
t”
,

S
e
ar
c
h

,

Smart S
e
ar
c
h


a
nd

W
e
b
lin
k
s”
.




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


20

M
odule
s

Modul
e
s h
a
ve

simil
a
r

r
o
l
e
s
a
s
c
ompon
e
nts but

on

a

sm
a
ll
e
r

s
ca
l
e
. Th
e
y

p
e
r
f
o
r
m simple

t
a
sks
a
nd displ
a
y
c
ont
e
nt
a
s sm
a
ll blo
c
ks on a

p
a
g
e
.


M
odul
e
s
as they appear in
the

fron
t
-
e
nd

E
x
a
mpl
e
s of

modul
e
s
ar
e

a s
ea
r
c
h bo
x
, lo
g
in
f
o
r
m
, m
e
n
u,
f
oot
e
r

c
o
p
y
r
i
g
ht
i
n
f
o
r
m
a
tio
n
,
e
t
c
.

I
n m
a
n
y

ca
s
e
s
modul
e
s
ar
e

w
o
r
king

in
c
onjun
c
tion with
c
ompon
e
n
t
s to p
re
s
e
nt
c
ont
e
nt.
F
o
r

e
x
a
mpl
e
, a

shopping
c
a
r
t
c
ompon
e
nt is us
e
d
t
o m
a
n
a
ge

p
r
odu
c
ts

a
nd a

mo
d
ule

is us
e
d

to show hot p
r
odu
c
ts.




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

21

All

modul
e
s
ar
e

m
a
n
a
g
e
d
via
“Ex
te
n
sio
n
s”

=
>


M
o
du
le

M
a
n
ag
er

.


T
he

M
odule

M
anag
e
r


in

the ba
ck
-
e
nd


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


22

T
e
mpl
a
t
e
s

The

T
e
mpl
a
te

controls the

g
r
a
p
hi
ca
l

p
re
s
e
n
t
a
tion

of

y
o
u
r

w
e
bsit
e
.

I
t d
e
t
e
r
min
e
s

the l
a
y
out,
c
olo
r
s,
t
y
p
e
-
f
a
ce
s,
g
r
a
phi
c
s
a
nd oth
e
r

a
sp
e
c
t
s of

d
e
si
g
n t
h
a
t m
a
ke

y
o
ur

s
ite

uniqu
e
.

I
n

g
e
n
e
r
a
l,
a
t
e
mpl
a
te

c
on
s
ists of

three
e
l
e
m
e
nts:



S
t
a
tic

g
ra
ph
i
c

e
l
e
m
e
nts,
l
ike

b
ac
k
g
r
ound im
a
g
e
s,

d
e
si
g
n d
e
c
o
r
a
tion, lo
g
o
t
y
p
e
,
e
t
c
.



The m
a
in
c
ont
e
nt
a
r
e
a

p
r
e
s
e
n
ting

d
a
ta

g
e
n
e
r
a
t
e
d
b
y

c
o
mpon
e
n
t
s.



Multiple

module

positio
n
s to show
c
ont
e
nt p
re
s
e
n
t
e
d
b
y

modul
e
s
, in specific locations
.


E
x
ample

of

ba
ck
ground
i
mag
e
, module

position and main

body
/content

ar
e
a


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

23

In
the

b
ac
k
-
e
nd,

y
ou
ca
n

c
ont
r
ol

t
e
mpl
a
t
e
s via

“Ex
te
n
sio
n
s

=
>

“T
e
m
p
la
t
e

M
a
n
ag
er

.



T
e
mplate

M
anag
e
r


B
y

d
e
f
a
ult,

Joomla!

3.x

c
om
e
s with

two

front
-
end

t
e
mpl
a
t
e
s
:


P
ro
to
star


a
nd

B
ee
z3

.
B
ut th
er
e

ar
e

t
hous
a
nds of both
fre
e

a
nd
c
omm
e
r
c
i
a
l t
e
mpl
a
t
e
s
a
v
a
il
a
bl
e
, so

y
o
u
c
a
n d
ef
init
el
y

c
hoo
s
e

the b
e
st

one

f
o
r

y
ou
r

needs
.
Check out this

list of
top 10 Joomla! 3.0
templates for users
.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


24

Here are some more examples of a template:


JSN Pixel


JSN Boot


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

25

Plu
g
-
ins

P
lu
g
-
ins
a
r
e

d
e
s
i
g
n
e
d to displ
a
y

c
ont
e
nt
i
nside

c
ompon
e
nts
a
nd
m
odul
e
s.

P
lu
g
-
ins
ca
n

a
lso p
erf
o
r
m t
a
sks
a
t
cer
t
a
in points du
r
ing

w
e
bsite

lo
a
di
n
g
. You

ca
n think
a
bout plu
g
-
in
s

a
s a

mo
r
e

v
er
s
a
tile

w
a
y

to int
erac
t with the
s
y
st
e
m.



Voting”

and

R
e
ad m
o
re”

c
ont
e
nt plugin
s in the

fr
o
n
t
-
e
nd

E
x
a
mples of

plu
g
-
ins

y
o
u mi
g
ht s
e
e

a
r
e the voti
n
g

f
u
n
c
tion
a
li
t
y

a
nd t
h
e

R
e
ad mor
e
…”

button in
ar
ti
c
les. All

plu
g
-
ins
a
r
e

m
a
n
a
g
e
d

via

“Ex
te
n
sio
n
s”

=
>


P
l
u
g
-
in

M
a
n
ag
er

.



Plug
-
in
M
anag
e
r


I
n the

Joomla!

3.x

c
o
r
e

p
ac
k
a
g
e
, plug
-
ins
ar
e

div
i
d
e
d into

eleven

ca
t
e
g
o
r
i
e
s
:


auth
e
nti
c
atio
n”
,

c
apt
c
ha

,

c
ont
e
n
t”
,
“e
ditor

,
“e
ditor
s
-
xtd

,

extension

,

finder”
,
qui
ck
i
c
on

,

s
e
ar
c
h

,

s
y
st
e
m”

a
nd

us
e
r

.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


26

L
a
ngu
a
g
e
s

L
a
n
g
u
a
g
es

a
llow

y
ou to
r
un

y
our

site

in mo
r
e

t
h
a
n

one

l
a
n
g
u
a
g
e
.

F
or

e
x
a
mpl
e
,

if

y
ou

w
a
nt to use
Fr
e
n
c
h
f
or
y
o
ur
Joomla!

sit
e

/

a
dminist
ra
tion. You just n
ee
d to downlo
a
d the

F
re
n
c
h t
ra
nsl
a
tion p
ac
k
a
g
e
s
f
r
om

the
Joomla!

E
x
t
ens
i
on

Di
r
ec
t
o
r
y

f
o
r

L
an
g
u
a
g
es

th
e
n in
s
t
a
ll th
e
m using the
“Ex
te
n
sion

M
a
n
ag
e
r

.



L
anguage

M
anag
e
r


B
oth of

the

two inst
a
ll
e
d

l
a
n
g
u
a
g
e
s
will then be
shown in

“Ex
te
n
sio
n
s”

=
>


La
n
g
u
age

M
a
n
ag
er


in
the

b
ac
k
-
e
nd.

>>> The next step

Now th
a
t

y
ou
h
a
ve

little

insi
g
ht into wh
a
t
Joomla!

i
s, it

s time

to
e
x
p
er
i
e
n
c
e

it in
f
l
e
sh
a
nd blood.

L
e
t

s
inst
a
ll

Joomla!

3.x

on

y
our

lo
c
a
l
host

a
nd
g
ive

a

t
e
st d
r
i
v
e
.




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

27

Step 2: Install
Joomla!

3.x

on local
host

I
nst
a
lli
n
g

Joomla!

3.x
.
o
n lo
ca
l
host

is
straightforward

but

c
a
n be

t
r
i
c
k
y

the

f
i
r
st tim
e

you attempt it
.
S
o
for
this
st
e
p

we’ve
p
r
ovid
e
d inst
r
u
c
tions
on how to
do it right
fr
om

s
cra
t
c
h.

F
i
r
st, l
e
t

s m
a
ke

clarify

the

m
ea
ning

o
f


L
o
ca
lhost

. As

y
ou know,
a
n
y

w
e
bsite

n
ee
d
s to be

h
ost
e
d on

a w
e
b
s
er
v
e
r

in o
r
d
e
r

to be

s
h
own to us
er
s. No
r
m
a
l
l
y
,

y
ou would

n
e
e
d to b
u
y

a

hosting

p
a
c
k
a
g
e

fr
om

some hosting

p
r
ovid
e
r like

R
ac
ksp
ac
e

or

GoD
a
d
d
y
.
D
e
p
end
e
d on the

p
a
c
k
a
ge

y
o
u

c
hoos
e
, a

hosti
n
g

p
r
ov
i
d
e
r will ins
t
a
ll a

w
e
b s
er
v
e
r

f
or

y
ou on one of

th
e
ir

s
e
r
v
e
r

m
ac
hines
, which is accessible to the public
.
A
lo
ca
lhost is b
a
si
ca
l
l
y

t
h
e

s
a
me
type of
w
e
b

s
er
v
e
r but inst
a
ll
e
d on

y
our

own

c
o
mput
e
r
.

Now, in o
r
d
e
r

to
r
un
Joomla!
,

y
ou n
e
e
d not on
l
y

a

w
e
b s
er
v
er
, but
a
lso 2
m
o
r
e

thin
g
s:
P
HP

s
cr
ipt int
er
p
re
t
e
r

a
nd
M
y
S
Q
L

d
a
t
a
b
a
se

s
y
st
e
m
.

I
t sounds
c
ompli
ca
t
e
d
b
ut
t
h
a
nk
f
ul
l
y
, th
e
r
e

is a

s
i
n
g
le

p
ac
k
a
ge

c
a
ll
e
d X
A
M
P
P

with
a
ll the

e
l
e
m
e
nts in
c
lud
e
d.

L
e
t

s inst
a
ll XAM
P
P

on
y
o
ur

c
omput
er
.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


28

Install XAMPP

1.

Downlo
a
d the XAM
P
P

inst
a
ll
e
r

p
ac
k
a
g
e

a
t

h
tt
p
:
//ww
w
.
apache
f
r
iend
s
.
o
r
g
/
en
/
x
a
m
pp
.
h
t
m
l

2.

Run the

inst
a
ll
a
tion
f
ile

a
s

y
ou do with
r
e
g
u
l
a
r

so
f
tw
ar
e

a
nd

f
ollow the st
e
p

b
y

st
e
p

inst
r
u
c
tion
s
.

3.

Op
e
n

XAM
P
P

Cont
r
ol
P
a
n
e
l Appli
ca
tion”

a
nd
s
t
ar
t


Ap
a
c
h
e


and

M
y
S
Q
L

.


XAMPP Control Panel Application

Th
a
t

s it,

y
our

l
o
ca
lhost
i
s now inst
a
ll
e
d. You
ca
n

c
h
ec
k if

it

wo
r
ks
o
r

not by

t
y
pi
n
g

the

a
dd
r
e
ss
:


http:/
/
lo
ca
lhost”

in

y
our

w
e
b
b
r
ows
e
r
. You

sho
u
ld s
e
e

a

p
a
ge

a
s illust
ra
t
e
d b
e
low.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

29


XAMPP for Windows interface




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


30

4.

Create
a
database in phpMyAdmin
.

From the XAMPP interface, click phpMyAdmin to start creating database
.


Click “phpMyAdmin”


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

31

5.

Next, click Database in the toolbar as
illustrated in the
following


Click “Database”

6.

Next, enter the database name and then click “Create”


Create database

Now you are ready to install
Joomla!
.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


32

Install
Joomla!

1.

Download
the
Joomla!

3.x

full package
at
http://w
ww.joomla.org/download.html

2.

Create a new folder
en
titled

Joomla
3x


in

folder
“htdocs”

in XAMPP folder. Normally it will be
located at
“C:
\
xampp
\
htdocs”

3.

U
npack
the
downloaded package
file
into the folder

Joomla
3
x


4.

Go to the URL
“http://localhost/
Joomla
3
x


5.

F
ollow all steps in
Joomla!

i
nstallation:

a.

Step 1. Main Configuration



Select Language
:

Choose your own language in the drop
-
down menu, for example,
“English
(United States)”



Site Name: Enter the name of your site



Description: Enter the description of your

site



Site Offline: Choose status for your website when you access to your site: Click “
Yes
” for

offline
” and “
No
” for “
online




Admin Email: Enter your valid email address you want to use for your site



Admin Username: Enter “
admin
” as default



Admin Pass
word: Enter your own password



Confirm Admin Password: Re
-
type your password



Click “Next” to continue Step 2

b.

Step 2. Database Configuration



Database Type: Select MySQLi



Host Name: Enter

localhost




Username: Enter
“root”



Password: let it blank



Database Nam
e: enter the name of the database you created

Joomla
3
x




Table Prefix: let it generate automatically



Old Database Process: Click “Backup” to backup tables from former
Joomla!

installation, or
“Remove” to delete these tables



Click “Next” to continue Step 3

c.

Step 3. Overview


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

33



Finalization
: You can choose installing sample data or not
,
by clicking on corresponding
selection
.



Overview:
This step is to review all information you configure
d

in
step 1. After checking,
you click
“Install”
.



When installation finishes, you just need to click the button
“Remove installation folder”

button to complete the installation process. After that, you can either click on
“Site”

to see
your newly created or
“Administrator”

to access the administration are
a.


Now

y
ou
h
a
ve

y
o
u
r

f
i
r
st

Joomla!

s
i
te

inst
a
ll
e
d su
cce
ss
f
ul
l
y
!

I
t

s not too h
ar
d
,
r
i
g
ht?

I
f

y
ou h
a
v
e

any

t
r
ouble
with the

inst
a
ll
a
tion p
r
o
ce
ss,

y
ou

ca
n t
r
y

in the

f
o
l
lowing

sou
r
c
e
s
f
or

t
h
e

a
n
sw
er
:



O
f
f
i
c
ial
Joomla!

f
o
r
u
m

The

Joomla!

f
o
r
um

is
one

of

the

busi
e
st (
a
nd most
fr
i
e
nd
l
y
) supp
o
r
t
f
o
r
ums
i
n

the

wo
r
ld,
a
nd it is a

g
r
ea
t
pl
ac
e

to

g
e
t h
e
lp
a
nd m
e
e
t oth
e
r

Joomla
!

us
er
s.

Th
er
e

a
r
e

a

lot of

qu
e
stions
a
nd
a
nsw
e
r
s whi
c
h
a
r
e
dis
c
uss
e
d h
er
e.

B
eca
u
s
e

our

topic

is
Joomla!

3.x

i
n
s
t
alla
t
io
n
, so

y
ou
c
a
n
f
ind h
e
lp in the
ca
t
e
g
o
r
y

I
ns
t
a
ll
a
t
i
on

Joomla!

3.x

.



Joomla!

h
e
lp

live

(
http://joomla.cmshelplive.com/
)

This w
e
bsite

p
r
ovid
e
s

y
o
u with o
n
-
d
e
m
a
nd
Joomla!

S
uppo
r
t s
er
vi
ce
.

Of

c
o
u
r
s
e
,

y
ou h
a
ve

to
p
a
y

mon
e
y
f
or

the

s
er
v
i
c
e

but

y
our

p
r
obl
e
m will be

f
i
x
e
d
b
y

Joomla!

e
x
p
er
t
s
.



O
t
h
e
r

Joomla!

l
e
a
r
n
i
n
g
re
so
u
rce
s

Th
er
e

ar
e

m
a
n
y

ot
h
e
r
w
e
bsit
e
s

whi
c
h

y
ou

ca
n use

a
s

y
o
u
r
Joomla!

l
e
a
r
n
i
n
g
re
so
u
rce
s
:

o

http://docs.joomla.org/Beginners

o

http://www.joomlatutorials.com/

o

http://www.joomlablogger.net/

o

http://www.ostraining.com/

>>> The next step

I
nst
a
lli
n
g

Joomla!

3.x

o
n

y
our

l
o
ca
lhost is the

f
i
r
st

thing

y
ou n
ee
d to do
s
u
cce
ss
f
ul
l
y

b
e
f
o
r
e

g
e
tting

st
ar
t
e
d with

y
our

Joomla!

sit
e
.

Now, wh
e
n

y
our

w
ebsite

is
rea
d
y
, l
e
t

s

f
ill

it

with
c
ont
e
nt
.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


34

Step 3:
C
reat
e

content for
your

Joomla!

s
ite

S
o n
a
tu
ra
l
l
y

the

most impo
r
t
a
nt
e
l
e
m
e
nt of

e
v
e
r
y

w
e
bsite

is the

c
ont
e
nt.

I
n

this st
e
p,

y
ou will:

1.

P
re
p
ar
e

t
h
e

c
ont
e
nt st
r
u
c
t
u
r
e

2.

C
rea
te

c
a
t
e
g
o
r
i
e
s

a
nd
ar
t
i
c
l
e
s

3.

C
rea
te

a

m
e
nu

4.

Manage your
content with JSN PowerAdmin

Prepare

a content structure

C
rea
ting
c
ont
e
nt is like

a
rra
n
g
i
n
g

the

p
r
od
u
c
ts in a

g
r
o
c
e
r
y

sto
r
e
.

I
n

Joomla!

a
rt
i
c
l
e
s

ar
e

like

p
r
od
u
c
t
s
,
c
a
te
go
r
i
e
s
a
r
e

like

the

s
h
e
lv
e
s

holding

p
r
od
u
c
ts

a
nd
me
nu
s
ar
e

like

a
isles

to those

sh
e
lv
e
s.

Now, l
e
t

s im
a
g
ine
y
o
u h
a
v
e

a
w
e
bsite

s
e
lling lu
x
u
r
y

it
e
m
s
. The

c
ont
e
n
t st
r
u
c
tu
r
e

mi
g
ht look like

f
ollowin
g
:

1.

About

a.

About my site

b.

How to purchase/order products

c.

How to make payment

2.

New
s

a.

Latest news

b.

Arrivals

c.

Sale

d.

Coupons

e.

Promotion

3.

Support

a.

Hotline information

b.

Online customer services

c.

Contact us


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

35

Create

content

Wh
e
n the

c
ont
e
nt st
r
u
c
tu
r
e

is
r
ea
d
y

on p
a
p
er
,

you

can
replicate

it

in

Joomla!

L
e
t

s st
ar
t with
c
r
ea
ting
ca
t
e
g
o
r
i
e
s.

Categories

1.

Go to
“Content”

=>
“Category Manager”

and click on
“Add New Category”


Add
a new category

2.

Next, insert the category title

“About”

and click
the
“Save

& Close


button
o
n the toolbar
.


Input
category
information


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


36

After saving, you can see your new category
“Abou
t


appear
s

in
the
Category Manager
.


The category “About”

You can create all the rest
of your
categories in the same way.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

37


Six

new categories

W
h
e
n the
ca
t
e
g
o
r
i
e
s

ar
e

r
ea
d
y
, it

s time

to
cr
e
a
te

a
r
ti
c
l
e
s.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


38

Articles

Let’s a
dd a new article in

the category
“About”
.

1.

Go to
“Content”

=>
“Article Manager”

and
click

Add
New

Article



Add new article

2.

Next, you need to configure
three
parameters
:



Title
:
Input
“About my site”
.



Category
:
Select category
“About”

from the list.



Article text
: Input the article’s content.

For now, we

will
a
ss
u
me

th
a
t

y
ou
h
a
ve a

simple

ar
ti
c
le

with pl
a
in t
e
x
t.

L
a
t
er
, in

the

s
ec
tion

Make

articles look good


w
e

will dis
c
uss how to
c
re
a
te

ar
ti
c
l
e
s

with
r
i
c
h
c
on
t
e
nt




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

39

3.

If you want an article
to be
show
n

up on the front page, please f
ind the

F
e
a
t
ur
e
d


p
a
r
a
m
e
t
e
r

a
nd
s
e
t it
to


Y
e
s

. This will

m
a
ke

this
ar
ti
c
le

a
pp
e
a
r

on the

f
r
on
t
-
p
a
ge

of

the

w
e
bsit
e
.


Click “Yes” to show your article on the front page

If you want to add tags to the article, just type your keywords to the
“Tags”

parameter.

Add tags t
o the article with your keyword


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


40

4.

When you are finished, click the button
“Save & Close”

on the toolbar to save your newly
-
created
article.


Click the button
“Save & Close”
to save article

Now, you have a new article in
the
Article Manage
r.


The new article “About my site”

In the

s
a
me

w
a
y

cr
e
a
te
a
noth
e
r
two
ar
ti
c
l
e
s


How to

pur
c
has
e
/ord
e
r produ
c
t
s


a
nd

How to ma
k
e

pa
y
m
e
nt”

i
n

Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

41

the

About my

sit
e


ca
t
e
g
o
r
y
.


Three

newly created articles

Now

that you have
c
ompl
e
t
ed

the

c
o
n
te
n
t

c
re
a
t
i
n
g
p
r
o
c
e
s
s
, th
er
e

is
one
f
in
a
l thi
n
g to do:

crea
te m
e
nu it
e
ms

with links to th
e
se
ar
ti
c
l
e
s.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


42

Menu
s

I
n
Joomla!

a

m
e
nu is a
c
o
ll
ec
tion of links

to
cer
t
a
i
n
e
l
e
m
e
nts
like

ar
t
i
c
l
e
s.

I
n the b
ac
k
-
e
nd
a
ll m
e
nus

ar
e

lo
c
a
t
e
d
in the s
ec
tion


Me
nu
s

.
B
y

d
e
f
a
ult,
Joomla!

is p
re
inst
a
ll
e
d with

a

m
e
nu
ca
l
l
e
d

M
ain
Me
nu

.



Main Menu
” presentation at the front
-
end

Let’s add new menu items
to the
menu
“Main Menu”
.

1.

C
lick on the
“Main Menu”

in the
“M
enus


drop
-
down menu.


Cli
c
k


M
ain
Me
nu”

to s
e
e

all m
e
nu it
e
ms

asso
c
iat
e
d


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

43

2.

Next,
click

the

button

“New”

to create

a

new

menu
item.


Click the button “New” to create a new menu item

3.

Next,
click
the button
“Select”

to choose
the
menu
item type
.


Select menu item type


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


44

4.

As a

re
sult,

a

pop
-
up
s
c
r
e
e
n is

displ
a
y
e
d
. T
h
e
r
e

a
r
e m
a
n
y

di
ff
e
re
nt

e
l
e
m
e
nts

y
ou
c
a
n
c
r
ea
te

a

link t
o
, su
c
h
a
s

Conta
c
ts

,

Ar
t
i
c
l
e
s

,
“Smart
S
e
ar
c
h”,


N
e
wf
ee
ds


a
nd so on.

I
n this
ca
se

y
ou n
ee
d to

cr
e
a
te a

l
ink
to
a
n
ar
ti
c
le, so
c
li
c
k on


S
i
n
gle

A
rt
i
c
l
e

.


Select menu item type

“Single Article”


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

45

5.

Next, you need to fill
the parameter

“Menu Title”
, for example
“About my site”
.


Enter

menu title

6.

N
e
x
t
,

y
ou
h
a
ve

to
c
hoo
s
e

the

ar
ti
c
le

y
ou
w
a
nt to

displ
a
y
. On t
h
e

r
i
g
ht of

the

s
c
r
ee
n,

c
li
c
k the button

S
e
l
ec
t”
to s
e
l
e
ct

a
n
a
r
ti
c
le.


Click on the button

“Select



Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


46

7.

A pop
-
up s
c
r
ee
n will be

displ
a
y
e
d.

S
elect the article
“About my site”
.


Click on the article you want to select

8.

Click
“Save & New”

to create
two

more menu links to the other
two
articles
“How to purchase/order
products”

and
“How to make a payment”
.


Click “Save & New”




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

47

After creating

these
, you
will
have
three
new menu items
.


Three

newly created menu
items




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


48

Tags

You
can
create a

menu
or module

to display your tags.



To c
reate a Tag Menu: Go to “
Menus


=> “
Menu Manager
” => “
Add New Menu
” and

then choose
the
“Tags”
Type
.



Create new menu to display your tags




To c
reate a Tag Module: G
o to “
Module Manager
” => “
New
” => choose

“Popular Tags”
Type
.



Create new

module

to display your tags

Now
, you can go to t
he front
-
end and see the result.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

49



The new articles in

the

main menu


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


50

When you click on each link, you will see the corresponding article.



The article “About my site”

Now you can repeat
similar steps to create links to all necessary articles.


Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

51

Manage your content with JSN PowerAdmin

W
h
e
n wo
r
king

with
Joomla!

if you have
created
a lot of

m
e
nu
s
,

ar
ti
c
l
e
s

or

mo
d
ul
e
s
,

y
ou will
f
ind it

can be
difficult to locate a specific one.

S
o

a
n

e
x
t
e
nsion

whi
c
h h
e
lps

y
ou do th
a
t qui
c
k
l
y

a
nd s
i
mp
l
y

would be very
useful
.
Our
recommendation

is
the
fre
e, popular
e
x
t
e
nsion
ca
ll
e
d
J
S
N

P
o
w
er
Admin
.

J
S
N

P
ow
er
Admin will h
e
lp

y
ou:

1.

S
earc
h
for
a
n
y

it
e
ms qui
c
k
l
y

in
the
b
ac
k
-
e
nd

with

S
potli
g
ht
S
ea
rc
h
.
You

ca
n s
a
v
e

time

f
ind
ing

the

it
e
ms

y
o
u
n
ee
d to
e
dit.

2.

Cont
r
ol the

w
e
bsite

c
ont
e
nt in one

pl
ac
e

with

S
i
t
e

M
a
n
ag
e
r.
F
r
om th
a
t,

administrators
ca
n

e
dit
an

ar
ti
c
le

o
r

manage modules

and
m
e
nu it
e
ms
with the
d
r
a
g
-
a
nd
-
d
r
op

f
e
a
tu
r
e.


J
SN Pow
e
rAdmin Site

M
anag
e
r

This extension is highly rated by
Joomla!

users on
the
JED with 30+ votes and 30+ reviews.

Downlo
a
d
J
S
N
P
ow
er
Admin
Fre
e

-


Watch JSN PowerAdmin Quick Tour
.



Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


52

Make

articles look good

You
a
l
rea
d
y

k
now how
t
o
crea
t
e

ar
ti
c
le
s
.

I
t

s time

to
g
e
t mo
r
e

a
dv
a
n
ce
d

a
nd

crea
t
e

ar
ti
c
l
e
s t
h
a
t
ar
e

more
a
p
p
ea
lin
g
. Th
er
e

ar
e

s
e
v
e
r
a
l
ways

y
ou

ca
n use

to do th
i
s su
c
h
a
s:

f
o
r
m
a
tting

t
e
x
t,
a
dding

im
a
g
e
s, links,
e
t
c
.

Format

text

I
f

y
ou h
a
ve

wo
r
k
e
d

with Mi
cr
oso
f
t
W
o
r
d

or

a
n
y

o
th
e
r t
e
x
t p
r
o
ce
ssor, th
e
n
t
e
x
t
f
o
r
m
a
tti
n
g

in
Joomla!

will

s
ee
m
fa
mili
a
r

to

y
ou.

However,
it
is

mu
c
h simpl
e
r

th
a
n Mi
cr
oso
f
t
W
o
r
d

a
s
t
h
er
e

ar
e

just

a

f
e
w b
a
sic
t
e
x
t
f
o
r
m
a
tting
options.

L
e
t

s
g
o to

A
rt
i
c
l
e

M
a
n
ag
e
r
a
nd

c
li
c
k on the

ar
t
i
c
le


About my

sit
e


to op
e
n it. Now
f
o
c
us on the

ar
ti
c
le

e
ditor
area
.

This is w
h
er
e

y
ou
e
dit

y
our

ar
ti
c
l
e
:


Edit the article

T
a
ke

a

c
lose

look
a
t

f
o
r
m
a
tting

option
s

-

most of

the

i
c
ons look v
e
r
y

f
a
mili
ar
, with i
c
ons to m
a
ke

y
o
u
r

t
e
x
t
bold, it
a
lic

or

und
er
lin
e
d
a
nd

i
0
c
ons to
a
li
g
n

y
our

t
e
x
t
.
J
ust

s
e
l
ec
t the

t
e
xt

y
ou

w
a
nt to

s
t
y
le

a
nd

c
li
c
k t
h
e

relevant
i
c
on.




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine

53


Joomla!

article formatting buttons

You
ca
n
c
rea
t
e h
ea
di
n
g
s

of

di
ffe
r
e
nt l
e
v
e
ls

in

y
our

t
e
x
t
b
y

s
e
l
e
c
ting

t
h
e

t
e
x
t to be

s
t
y
l
e
d
a
nd

c
li
c
ki
n
g the

d
r
o
p
-

down m
e
nu

next to

“Paragrap
h

.
S
cr
oll down

the

d
r
op
-
down m
e
nu
a
nd
c
hoo
s
e

a

suit
a
ble

h
ea
di
n
g

fr
om


H
e
ading 1”
to

H
e
ading 6

.


Choose heading

styles

for text




Joomla!

3.x
Made Easy
” © JoomlaShine.com

Twitter

http://www.twitter.com/joomlashine

|
Facebook
http://www.facebook.com/joomlashine


54

You can see the text is now larger: