How To Guide For EPRP INFORMATION Site

crateleftInternet and Web Development

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

59 views

How To Guide
F
or
EPRP INFORMATION Site

Version 1.10


Mark Kearns

CONTENTS

USERS AND PERMISSIONS

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

2

The Content Developer Group

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

2

Ad
ministration Site Home Page for Content Developers

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

2

Adding a New Content Developer

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

2

CONTENT DEVELOPMENT

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

3

Content Structure and Categorisation (Taxonomy and Naming Conventions)

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

3

Required Content in the Taxonomy

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

4

Categorising Articles

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

5

Guidelines for Styling Article Content

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

6

Uploading Attachments to Articles

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

7

Controlling the Display of the Attachments

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

8

The Home Page

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

9

TRANSLATING CONTENT

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

10

Introduction

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

10

Example

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

12

LANGUAGE SWITCHER CUSTOMISATIONS

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

13

Falang Language Switcher Module Template

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

13

RESOURCES: CREATING AND DISPLAYING

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

14

Creating a Module to Display Resources

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

14

LAYOUTS FOR SECTIONS, THEMES AND TOPICS

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

16

Navigation Menu items For Sections

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

16

Changing the Layout Options for Sections and Other Categories

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

16

Section Categories accessed by a menu item

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

17

Layout for Peace Resources, Community Information and Internet Skills Pages

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

17

Topic Categories

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

18

Peace Resources Themes: Description and ToolTips

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

18

Menu Items for Sections without Themes or topics

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

20

FILE STRUCTURE AND MANAGEMENT

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

22

File Structure

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

22

Possible structure for holding files

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

22

File Management within Joomla Admin

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

22

Major Disadvantage

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

22

SEARCH ENG
INE OPTIMISATION

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

24

Introduction

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

24

Correct content Structure

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

24

HT
ML Head Tags

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

24

Page Titles

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

24

Page Descriptions

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

25

How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


1

SEOSimple and Standard Joomla! SEO Settings

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

26




How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


2

U
SERS AND PERMISSIONS

THE CONTENT DEVELOPE
R
GROUP

The
Content Developer
user group, in conjunction with the standard Joomla user group
Publisher
, has been created
to manage users and their access to the administration site.

Members of this group have the following access to the administration site



create, edit, delete and publish
ARTICLES



create, edit, delete and publish
CATEGORIES



create, edit,
delete and publish
WEBLINKS

i.e. Resources



create, edit, delete and publish
TRANSLATIONS

in the
FALANG

component

Note that the ability to edit, delete and publish arises from the standard Joomla! user group
Publisher
.

For detailed information on how this w
as done see
Joomla ACL: Configuring back
-
end ACL

ADMINISTRATION SITE
HOME PAGE FOR CONTEN
T DEVELOPERS


ADDING A NEW CONTENT

DEVELOPER

Create the
user as per normal

via the Users / Add New Users menu but ensure that the user is assigned to the
CONTENT
DEVELOPERS

and
PUBLISHER

groups as below


How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


3

CONTENT DEVELOPMENT

CONTENT STRUCTURE AN
D CATEGORISATION

(TAXONOMY AND NAMING

CONVENTIONS)

NAME

EXAMPLE

DESCRIPTION

WEBSITE TYPE

SECTION

Peace Resources

top level category
which will be
displayed in website main menu

Category (grandfather)

THEME

-

Armed Conflict In Myanmar

2nd level category

Category (parent)

TOPIC

-

-

History of Armed Conflict

lowest
level category

Category (child)

ARTICLE

-

-

-

Introduction to History of
Armed Conflict

textual content including
images

(could
be called Document but did not want
any confusion with an electronic
document i.e. Word doc, pdf)

Article categorised under
Section/Theme/Topic

RESOURCE

-

-

-

Timeline of Myanmar
history since independence

a link
i.e.

url, that points to one of the
following



page on an
external website



electronic document
(pdf etc)
hosted on our website server



electronic document hosted
externally

A Topic can have none, 1 or more
Resources.

Note:
a Resource is related to a
Topic

and not an
Article.

“Weblink” which is a custom
Joom污℠汩nk⁴yp攮


No瑥:⁨慳 瑨攠Wame
捡瑥go物獡瑩on⁡猠瑨攠䅲瑩捬攮




How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


4

REQUIRED CONTENT IN
THE TAXONOMY

NAME

EXAMPLE

REQUIRED CONTENT

SECTION

Peace Resources

Each Category must have at least 2 sentences in the Description.

This Description is
displayed
on every page where the category is listed
including the Home Page

THEME

-

Armed Conflict In Myanmar


TOPIC

-

-

History of Armed Conflict


ARTICLE

-

-

-

Introduction to History of
Armed Conflict



must contain a
Read More

break after the first paragraph

(otherwise the listing of Articles for a Topic will be too long)
.
Note this is not an issue if this is the
only
Article for the Topic



ensure that the first paragraph is a good introduction to the
contents

RESOURCE

-

-

-

Timeline of Myanmar
history since independence



a short description of the link if it is not obvious from the title



indication if this is a link to a file (pdf etc) and the approx.
file
size e.g. (pdf 230kb)



How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


5

CATEGORISING ARTICLE
S

The standard version of Joomla! does not allow an Article to be added to more than category so an additional plugin has been
installed.

To add an Article to multiple categories click on the
Select/Change
button and select the Categories from the dialog that opens.



Note: the article
must

have at least one category even if that category is “uncategorized”. If not then

you will get an
“Invalid
Form”

message as shown below





How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


6

GUIDELINES FOR STYLI
NG
ARTICLE CONTENT



avoid using images unless they have been re
-
sized to fit the page you are using e.g. do not upload and insert a 1000px x
800px then display it at 200px x 160px.



avoid using images larger than 10Kb as this will greatly increase the loading
time of the pages



when styling the Article text, avoid applying your own Fonts or Font Sizes or Colours as that increases the size of the
page and reduces page loading times. Instead use the defined
options

available in the
FORMAT

drop down as below



How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


7

UPLOADING ATTACHMENT
S TO ARTICLES

The Attachmenst3 plugin has been installed In order to make it easier to upload resources

i.e. documents, files etc

directly into
an Article.

To upload
a single file,

open the Article for editing and click on the Add Attachment button as shown below


How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


8

The
Add Attachment

dialog box will open.

Complete it by choosing the file to upload and entering a
Display Filename

(this is the text that displays as the filename
but

i
s
optional) and a
Description

(there does not appear to be a limit to the amount of text you can enter but no more
than 2
sentences is recommended).


You can also enter a url that points to an external document e.g. a pdf hosted somewhere else.

See below
for an example of how the attachments display in the final Article

or click
here


CONTROLLING THE DISP
LAY OF THE ATTACHMEN
TS

By default the list of attachments is displayed at the bottom of the Article. If you wish it to be displayed in a specific pl
ace in the
Article then



place the cursor in the desired location in the Article descript
ion



click on the
Insert {attachments} token

button (see below)




How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


9

THE HOME PAGE

The Front Page of the website, also known as the Home Page, consists of
several

items



text in the form of
a single article
called
Home



Sections and their Themes in the form of a module called
Home Section Listings



Gender and Peace module



Global News type called
Latest Developments

module
. Displays a slider of
up to
5 articles from the “Latest
Developments in the Peace Process” category.



L
atest News type called
Latest Resources

module. Displays up to 5 of the
latest articles from all relevant categories.



Global News type called
Featured Content

module. Displays
a
slider of
up to
5 articles from the

Featured Content


category.

The module Ho
me Section Listings is configured to display only 4 Sections i.e 4 columns across. Any more than this and the
Sections may not display well.


How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


10

TRANSLATING CONTENT

The translation of the website and its contents is managed by the
Falang

component. As with al
l components it is accessed via
the Components menu in the admin site.

INTRODUCTION

Click on the
Translation

tab or icon and select the “Burmese” language option (please ignore the Australia option!)


Next choose the elements of the site to translate.



For content developers this will be
Contents

and
Weblinks
.



For administrators this would be
Menus

and
Categories




How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


11

The list of
all

Contents i.e

articles will then be displayed as below. Please note that there are some Articles that
do not need
translating and only appear in the list because of the way the component works. So
there is
no need to translate everything on
these pages.

Notes:



If an article is not translated it will just display as the English original.



If you are unable to open the
content to translate it then the English original is being edited by someone else



If there are problems that cannot be fixed then delete the translation and start again. If the problems are very severe
then delete the original English content and recreate
it.



When there are 10’s of documents you might want to consider using the Category Filter to narrow down the Articles or
Weblinks to translate.

At the bottom of the page is an explanation of the icons used.





How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


12

EXAMPLE

Not all parts of an Article (or
a Category for an administrator) need to be translated. It is best to not translate the Alias or the
Meta data fields.

The areas highlighted in the Home article below indicate which areas to translate i.e. Title and Article Text



When finished click on the
Published

checkbox highlighted above before saving.

How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


13

LANGUAGE SWITCHER CU
STOMISATIONS

The installed languages are
Burmese (MY)

and
English (UK)

but the display names for the language switcher at the top of every
page in the websit
e is actually
myanmar

and
english

(see screenshot below)


FALANG LANGUAGE SWIT
CHER MODULE TEMPLATE

In order to change the display names a new template for the Falang Language Switcher module has been created. It is called
eprp

and has been set as the Alte
rnative Layout option for the module (see screenshot below)


How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


14

RESOURCES: CREATING
AND DISPLAYING

Definition: A
Resource

is a Joomla! WebLink i.e url and is associated with a Topic (i.e. category)

There are 3 steps to the creation of Resources for a Topic:

1.

Create the Weblink Category to match the Article Topic i.e. category

2.

Create the Weblink and categorise it under the Topic category

3.

If not already done, create a Module to display the Resources on the Topic page


CREATING A MODULE TO

DISPLAY RESOURCES

1.

Go to

MODULE MANAGER

2.

Open an
existing

Resources module (highlighted with
purple
)


3.

Modify the module to match the new Topic to be displayed




How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


15

4.

Open the Module Assignment and change the category under which the module will display to the new Topic. Do not
change anything else! Don’t forget to
SAVE AS COPY


How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


16

LAYOUTS FOR
SECTIONS, THEMES AND

TOPICS

A
Theme

is defined as the top most
Article Category

in the category hierarchy. For details and the structure of this hierarchy see
the
CONTENT / CATEGORY M
ANAGER

menu or see
Content Structure and Categorisation

in this

document for the definition of
the taxonomy
.

NAVIGATION
MENU ITEMS

FOR SECTIONS

Each Category that is to be included in the main menu, also referred to as the
navigation
,
must have a Menu Item of type
List All
Categories
. The layout for each of these menu items is controlled by the Layout Options on the menu item.


It is recommended that
that a new menu item

that display
s

a Category should be
created as
a copy of an existing menu item.
To
do so o
pen an existing menu item, make your changes
and
then
click on the
Save As Copy

button.

CHANGING THE
LAYOUT OPTIONS

FOR SECTIONS AND OTH
ER CATEGORIES

The layout options for Sections, Themes and Topics are specified
globally

using the Content / Article Mana
ger / Options. They
can be overridden by the settings in the Menu Item, if any, that is used to display the Section, Theme etc.

There are two layouts
, one

for
Sections

which
are displayed directly using Menu Items,
and another for

those

Themes and
Topics (i.e.
subcategories
)

which are accessed when drilling
-
down through categories



S
ection categories

accessed by a menu item



display
the
contents of the Description field
and

a list of all subcategories



Theme and
Topic categories



d
isplays

the contents of the Description field
and
a
blog layout of the

articles within the
category

Both layouts are configured by the Option button in the
CONTENT / ARTICLE

MANAGER

menu (see below)



How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


17

SECTION
CATEGORIES ACCESSED
BY A MENU ITEM

To
globally
configure the layout for those
Section

Categories that are accessed by a menu item click on
CATEGORIES

tab (as
shown below).

Note: these options can be overridden by the settings in the specific Menu Item e.g.
Peace Resources
, which does not display
the To
p Level Category Description but instead uses a Module to display a single Article


LAYOUT FOR PEACE
RESOURCES
, COMMUNITY INFORMAT
ION AND INTERNET SKI
LLS

PAGES

The Home page layout
for Peace Resources, Community Information and Internet Skills displays

th
e
Category description

for
these top level categories
. The
actual category page
, accessed directly from the menu, uses
an introductor
y article instead.

EXAMPLE: PEACE
RESOURCES



The menu item has the
Top Level Category Description
set

to
Hide



A module has
been created that displays a single articl
e at the template position
user3
. This module only shows on the
menu item “Peace
Resources
”.

PAGE CLASS FOR PEACE

RESOURCES LAYOUT

In addition Peace Resources has a Page Class called “ two
-
column
-
topic” to force t
he Topics to be displayed in 2 columns. Note
the very important space in front of the word “two” in the Page Class.



How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


18

TOPIC CATEGORIES

To
globally
configure the layout for the
Topic Categories

click on the
CATEGORY
tab (as show below)

Note:
these options can be overridden by the settings in the specific Menu Item that
displays a Category Blog layout



PEACE RESOURCES THEM
ES: DESCRIPTION AND
TOOLTIPS

The

Peace Resources theme page uses a
tooltip

to display the Theme descriptions (see below)



E
ach and every Theme
category

for Peace Resources needs 2 descriptions: a normal
text

description and a
tooltip
description
with icon

The format
is:

{tooltip}
{end
-
texte} some description of the theme {end
-
tooltip}

some description of the theme



How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


19

To do
this

1.

open the theme Category

2.

add the 2 descriptions according to the format described including the icon files/info.png

3.

select the text description and apply the style called “theme
-
description
-
no
-
tooltip” using the style dropdown

The final result should b
e as below. Note the text description should be grey. If it is not then you need to apply the style again.



How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


20

MENU ITEMS FOR SECTI
ONS WITHOUT THEMES

OR TOPICS

This situation is not expected to arise in the
finished web
site but it may be the case during
content development.

The scenario is that there exists a Section that
does

not

have any Themes or Topics with Articles i.e
all
the Articles
are

categorised directly under the Section
.

In this case there is little point in this Section opening to display al
l its sub
-
categories i.e. Themes or Topics
,

as they
will be

empty. Instead the menu item should be changed for this Section so that it displays
all

its Articles on the one page. This could be
either a blog or list layout.

To do this

1.

open the
Menu Item

for the Section


2.

change the Menu Item Type to either
Category Blog

or
Category List


How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


21

3.

Configure the exact layout for the menu type you have chosen, in this case Category Blog, by going to the options on
the right of the page. For specific help on each of

these options hover over the field label. The example below shows
the help for the
#Leading Articles

field.

Note: do not leave any fields blank unless you want the Global options, i.e. Options set on the Content / Article
Manager page, to be used to conf
igure that field.





How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


22

FILE STRUCTURE AND M
ANAGEMENT

FILE STRUCTURE

To make managing images and documents (including pdfs) much easier I have already created the following structure

/
resources



backup of the Template



administrative or user guides



Zw
aygi
font files

and other system/site files

/
images



articles: for images associated with articles



icons: icons used as small or intro images



site: any images used in the website design / structure


POSSIBLE STRUCTURE F
OR HOLDING FILES

/images/files



pdfs, docs
etc

for
all parts of the website

or

/images/<section of site or theme name etc> eg /images/homepage



images for the specific section of the site



pdfs, docs etc for this specific section of the site



FILE MANAGEMENT WITH
IN JOOMLA ADMIN

The MijoFTP

component has been installed to enable you to manage files and directories without using an ftp client or logging
into the cpanel.


To access it go to
Components / MijoFTP

Hover over icons to see options. These include



uploading files



deleting files



move
up a directory



search for files

MAJOR DISADVANTAGE

It does
not include the option to rename a file or directory!

To create a directory use the option highlighted on the right and select Directory from the drop
-
down

Recommendation is to use Hostgator cpanel

file manager instead.



How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


23




How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


24

SEARCH ENGINE OPTIMI
SATION

INTRODUCTION

Optimisation

consists of two parts, one internal to the

website and the other external to the website

The
internal

aspect has the following requirements
, listed

in order of priority

1.







the content of the pages on the website has to contain relevant information i.e. if we want to appear in searches for
“Myanmar peace process” then
the

content needs to have those words in it
.

2.







the content of the pages is
structured

correct
ly i.e. using
semantic HTML. This means that
html

tags
for headings
in the
content
such as h1, h2, h3 etc.
are used
appropriately
within the
articles and on the page

(see Correct Content Structure below)

3.







the page
HTML head
meta
tags such as title
and description
have been

created and contain
relevant
content.

Point 1 is specifically about content and is within the remit of the Content Developers and outside the scope of this Section
.


The
external

aspect is mainly about getting links back to pages
on our website. This can be done in many ways, social networks
and posts on related sites are the usual methods, carried out by yourselves or, as you mentioned, an specialist
company.

It will
not be addressed here.

CORRECT CONTENT STRU
CTURE

Search engines
expect correctly structured HTML when they index a website page. The page will be reduced in ranking if the
HTML is not structured correctly.

At its simplest, the page should be structured hierarchically using the heading tags <h1>, <h2>… <h(x)>.

There sh
ould be only one <h1> tag per page. <h2> tags should be used for the next level of headings in the page hierarchy and
<h3> tags within them.

The
website template has been modified so that sub
-
categories on the pages are using <h2>,<h3> and <h4> tags proper
ly.

If the content developers are writing full articles, and not just Resource Articles, then they
must
use the Styles available in the
editor toolbar when working on their content (See 4. Setting fonts and styles the “maintenance free” way in the Content
Editor
Training.doc
written
for
the
FLD site)


HTML HEAD TAGS

T
he 3 types of html head

meta
tags that are available are



page title:
<TITLE>



page description:
<META NAME=”DESCRIPT
ION”

CONTENT=”…”>



page keywords
: these

are no longer used by Search Engines and may negatively impacted on your ranking

There is also the page title and description specific to the
Front Page
or

Home Page
.

The
SEO
Simple

plugin

has been
added to the site to make the creation and maintenance of

these

meta

tags

simpler and mostly
automatic.

The section below shows how to use this plugin with the standard Joomla meta data fields

PAGE TITLES

The SEO
Simple

plugin will
automatically
create a page title using the following rule
:

Page Title | Site
Title


e.g. About | Myanmar Ethnic Peace Resources Project

To change this for all pages and also for th
e Front Page or Home Page title

specifically:

How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


25

1.

go to Extensions
\

Plug
-
in Manager

2.

search for SEOSimple

3.

edit the Title Tag Settings as shown below



PAGE
DESCRIPTIONS

Page Descriptions

are automatically generated by the SEOSimple plugin

according to the rules in the Basic SEOSimple Settings
section
.

The website is currently configured to automatically generate upto 155 characters of description from the Joo
mla! Category
Description field. This means that even if the Category Description is
not

displayed on the actual page, it will still be used to
create the description meta tag content.
For an example see the

The E
thnic Problem

topic

page.

This can be changed so the content is taken from the page’s actual content which

may be more appropriate.

To
change the default for

all pages
,

and also for the Front Page or Home Page title specifically:

1.

go to Extensions
\

Plug
-
in Manager

2.

search for SEOSimple

3.

click on the Basic SEOSimple Settings as shown below




How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


26

SEOSIMPLE AND STAND
ARD JOOMLA!
SEO
SETTINGS

There are 2 places within Joomla! where SEO settings can be configured

1.

Global Configuration page

2.

Metadata Options section on the Joomla! element

GLOBAL CONFIGURATION

PAGE

See the screenshot below for what settings can or should be
changed on the Site
\

Global Configuration Page



Site Meta Description is used for the Front Page or Home Page



SEO Settings section is for site wide SEO configuration and it should not be changed without a full understanding of the
consequences


JOOMLA!
ELEMENT METADATA OPT
IONS

The value

for the Meta Description tag that is automatically generated by the
SEOSimple automatically can be overruled by
manually entering a value in the
standard Joomla!
Metadata Options

section
for that Joomla! element.

For example see the screenshot from a menu item.


How To Guide
F
or
EP
RP INFORMATION Site


Version 1.10


27

The following Joomla! elements have a Metadata Options section where you can override the automatic Meta Description
generated by the SEOSimple plugin:



menu items



categories



articles