USER’S MANUAL:

GOVERNMENT WEB TEMPLATE FOR JOOMLA

Version 4.0

For issues and concerns, contact the GWT Support Team at

helpdesk@i.gov.ph
 Table of Contents

Introduction ····················································································· 01
Parts of the Government Website ··························································· 02
Installing the Government Web Template ·················································· 03
Editing the Template’s Style Options ························································ 04
Editing the Top Bar ············································································ 06
Adding Menu Items under the Main Menu ················································· 07
Adding Auxiliary Menu (optional) ···························································· 09
Setting up the Breadcrumbs (optional) ······················································ 11
Editing the Masthead ·········································································· 13
Setting up the Banner/Banner Slider ······················································· 14
Setting up the Top/Bottom Panels (optional) or the Agency Footer ··················· 16
Updating the GWT-Joomla! ··································································· 17
 INTRODUCTION

This document serves as guide in using the Government Web Template (GWT) in Joomla. This is not
a comprehensive manual on Joomla!. It is assumed that the user has basic knowledge on Joomla or
has undergone training on the CMS.

The images in this document may or may not be exact same instance of your installation. Use this
guide only and not a step-by-step manual

USER’S MANUAL: Government Web Template for Joomla v3.0 1

 Parts of The Government Website Template

Top Bar

Masthead

Banner

Auxillary Menu
Bread Crumbs

Top Panel

Content

Side Bar

Bottom Panel

Agency Footer

Footer

USER’S MANUAL: Government Web Template for Joomla v3.0 2

 Installing the Government Web Template in Joomla!
Download the Joomla Government Web Log in to the Joomla administration page.
1 2
Template from: Go to Extensions > Manage.
http://i.gov.ph/gwhs/government-web-template/
and save the compressed gwt-joomla file to your
computer.

Under Install, go to Upload Package After successful installation, go to

3 4
File. Click Browse to find your saved gwt- Extensions > Templates.
joomla package file then click Upload & Install
button.

Set gwt-joomla as the Default template. This will be the default look of your
5 6
website.

USER’S MANUAL: Government Web Template for Joomla v3.0 3

 Editing the Template’s Style Options

Go to Extensions > 2 From Style choose

1
Templates the gwt-joomla.
Then select Header and
Banner Options tab

HEADER AND BANNER OPTIONS

Header Logo Type: Choose from Image Only or Image
with Text as your logo type.
By Choosing the Image with Text, you need to modify
the following:
Header Logo Upload: Insert or upload the logo
image. The size of the logo should be “100x100”.
Header Logo Name: Input the Name of the Agency.
Header Logo Tagline: Input the tagline or add an
additional text for the logo.
Header Font Type: Change the text’s font-family to
Serif or San Serif.
Header Text Color: Changes the text Color of the
logo.

By Choosing Image Only, you only need to modify the

following:
Header Full Upload: Upload a full header logo

Header logo Position: The header logo’s position

whether Left or Center.
Header logo Alt: Alternative text for the image uploaded
for the logo.
Header background Color: The Background color of the
header.
Header Background Image: Upload or Insert a
background image for the header.
Header Columns:
1 COL - default 1-column Header Banner Position:
2 COLS - 1 header & 1 Ear Content Standard 1 Col - A default 1-column banner.
3 COLS Left - 1 header in the center and 2 Ear Contents Standard 2 Col - A 2-column banner: the default
on both sides column and the banner featured.
3 COLS Right - 1 header in the left and 2 Ear Contents Full Width - Column is in full width of your screen.
on the right Banner Featured Content Color: Color of the banner
Banner background Color: Background color of the featured.
Banner. Banner Featured Content Background Image: Where
Banner Background Image: Upload or insert a you upload or select your preferred banner featured
background image for the Banner background image.

USER’S MANUAL: Government Web Template for Joomla v3.0 4

 Editing the Template Manager’s Style Options

Go to Extensions > 2 From Style choose

1
Templates the gwt-joomla.
Then select Content
Options tab

CONTENT OPTIONS
Sidebar Position: Position and number of sidebar
either on the No Sidebar, Left, Right, or Both.
Transparency Position: The default Transparency
Seal logo positioned on either Left, Right, or None.
Transparency Page URL: the URL or link for the
Transparency page
PST Position: The default Philippine Standard Time
of positioned on either on the Left, Right or None.

Content Border: Select border types to No Border,

Full Border, Border Top Only, or Border Bottom
Only.
Content Border Weight: Select the weight of the
border.
Content Border Radius: Select the radius of the
border.
Content Border Color: Choose the border’s color.
Content Header Font Size: Select the font size of
the content header to Normal, Smaller, or Larger.
Content Background Color: Choose the
background color of the content’s panels or modules.
Agency Footer’s Background Color: Choose the
agency footer’s background color.

USER’S MANUAL: Government Web Template for Joomla v3.0 5

 Editing the Top Bar

The Top Bar has fixed components and links that include the GOVPH and Main Navigation.
The Main Navigation contains links to different articles in the website. Before editing the Top
Bar, these articles should have been created already. Start off by positioning the Main Menu
at the top bar.

1 Go to Extenstions > Manage then choose Main Menu on the list of modules.

2 From Menu go to position and select Topbar Left [topbar-left].

Check and see if Main Menu is now positioned at the Left Top Bar beside GOVPH.

USER’S MANUAL: Government Web Template for Joomla v3.0 6

 Adding Menu Items under the Main Menu

Go to Menus > Main Menu > Add New Type in the Menu Title.
1 2
Menu Item.

Click the Select button. A pop-up screen Click on Articles > Single Article.
3 4
will appear.

Choose the article you want to display. Click Select the article.
5 6
the Select button to select an article. A
pop-up screen will appear.

USER’S MANUAL: Government Web Template for Joomla v3.0 7

 Adding Menu Items under the Main Menu

Click Save & New to create other menu or click Save & Close if you’re done creating the
7
links . menu items.

Check and see if your menu item was added by going to your homepage.

USER’S MANUAL: Government Web Template for Joomla v3.0 8

 Adding an Auxilliary Menu (optional)

Begin by creating the articles that will link Enter the following Menu Details:
1 2
to your auxiliary menu items. Then create Title: Auxiliary Menu
the Menu and position it on the auxiliary position Menu type: Optional
of the template.
Go to Menu > Menu Manager >
Add New Menu.

Then click

Now that your Auxiliary Menu is ready, Under the list of Select a Module Type
3 4
create a module. find and choose Menu.
Go to Extensions > Module Manager > New.

On the new page, type in the And on Position, choose

5 6
Title: Auxiliary Menu. Auxiliary Menu [auxiliary-menu].
Then click

USER’S MANUAL: Government Web Template for Joomla v3.0 9

 Adding an Auxilliary Menu (optional)

The newly created module will now display Adding a new menu item on the auxiliary
7 8
in the Module Manager page. menu.
You can also check the auxiliary menu has been Go to Menus > Auxiliary Menu > Add New
added on the Home page. Menu Item.

To set up the new menu item:

9
First type in the Menu Title, select the appropriate Menu Item Type, and be sure the Menu
Location is set to Auxiliary Menu.

10 Click to create other menu links or

Click when you’re done creating the menu items.

USER’S MANUAL: Government Web Template for Joomla v3.0 10

 Setting up the Breadcrumbs (optional)

The Breadcrumb is a navigational aid for users so they can easily see exactly where a web page is
located within the website. Example: Home > About Organization > History of Organization.
1 To add a Breadcrumb, create a new menu under the Menu Manager.

Go to Menus > Menu Manager >

Add New Menu.

2 Enter the following Menu Details

Title: Breadcrumbs
Menu Type: Optional_Breadcrumbs

3 Then click

4 Now that the Breadcrumbs Menu is ready, set its position to Breadcrumb.

Go to Then select
Extensions > Breadcrumbs on
Manage. the list of modules.

Inside the Breadcrumbs Module, set the position to

Breadcrumbs [breadcrumbs].

USER’S MANUAL: Government Web Template for Joomla v3.0 11

 Setting up the Breadcrumbs (optional)

6 Click and your module has now been successfully saved.

Check the Breadcrumbs on

your Home page.

USER’S MANUAL: Government Web Template for Joomla v3.0 12

 Editing the Masthead

Prepare your agency logo according to the specifications of the GWT. Recommended dimensions
should be 100 pixels in height.

1 To add the Choose

agency logo to the gwt-joomla
Masthead, go to template.
Extensions >
Templates.

2 Under the Header and Banner Options, the Header Logo Type gives the option to choose
from two types of image logo: the Image Only or the Image with Text.

Image Only - gives the option of uploading a

full image logo through the Header Full
Upload.
Image with Text - gives the option of
uploading a 100 x 100 image logo through the
Header Logo Upload and direct editing of the
Header Logo Name, Header Logo Tagline,
Header Font Type, and Header Text Color.

3 saving, see if the logo appears on the frontend.

After

An example of Image Only logo An example of Image with Text logo

USER’S MANUAL: Government Web Template for Joomla v3.0 13

 Setting up the Banner/Image Slider

The Banner component features images linked to specific articles or external websites, and displays
them as a slideshow.
Start by uploading images to be shown in the image slider. The recommended width for the image
is 1250px (with a minimum height: 150px and a maximum height: 460px).
1 Go to Content > Media and click

Browse the images to be uploaded then click Start Upload

After uploading all the images for the Under the Banners: Category
2 3
banner, go to Component > Banners.

Type the Title for the banner’s Category

Then go to Categories and

Set the Status to Published
create a new Category

Go to Banners: Banners and click

4
Input the desired Name

On the Image section, select or

upload the desired image for the
Set the Status to published
banner
Select the Category you
Type an Alternative Text for created for the banner slider
the image alt
Then click
On the Click URL type the url
or link for the image banner.
Add a Description for the To add more image banner
banner caption. keep repeating this step

USER’S MANUAL: Government Web Template for Joomla v3.0 14

 Setting up the Banner/Image Slider

5 Go to Extensions > Modules 6 On the list of Module Type

choose Banners.

Then click

On the Banner Module, set the required inputs.

7

Type in the Title.

Set Show Title to

Hide.

Set the desired number of Set the Position to

banners on the Count Banner [banner].
option
Select the Category where
your chosen banners are
located Then click

USER’S MANUAL: Government Web Template for Joomla v3.0 15

 Setting up the Top/Bottom Panels (optional) or the Agency Footer

In creating the top and bottom panels, go Under list of Module Type,
1 2
to Extensions > Module Manager. select Custom HTML.

then click

Setting up the module panel.

3

Write in the Title of the

panel.

Set Show Title to Hide

or Show.

Set the appropriate

Position, from Panel
Top 1-4, Panel Bottom
1-4 or Footer 1-4.

Set the contents of your

panel using the
WYSIWYG editor.

Then click

USER’S MANUAL: Government Web Template for Joomla v3.0 16

 Updating the GWT - Joomla!
Download the GWT-Joomla by going to Log in to your Joomla Backend or /
1 2
https://github.com/iGovPhil/gwt- administrator.
joomla/releases and get the latest release.

Install the Template After installation, go to Extensions >

3
4 Templates.
a. Go to Extensions > Manage
b. Then go to the Install tab on
the right.

c. Click on the Upload Package File tab.

d. And click on the Browse to locate the
downloaded GWT-Joomla.
e. Then click Upload and Install.

Set the newly updated gwt-joomla as the Now check your website. If some of the
5 6
Default template. modules are misplaced or missing. Go
to the Extension > Modules to re-
positioned the modules.

USER’S MANUAL: Government Web Template for Joomla v3.0 17