DILG

Administrator Manual

Prepared by

FORWARD SOLUTIONS

July 2016
REVISION SHEET

Version Date Revision Description

1.0 May 2016 original version

 Table of Contents
I. Introduction
II. End- User Interface (Frontend)
A. Access
B. Registration
C. Home
D. Tutorial
E. Training
F. Forum
G. File
H. Gallery
I. Profile
J. Chat Box
III. End-User Interface (Backend)
A. Access
B. Dashboard
B. 1 How to Approve Requests
C. Generic Adding of Articles or Post on each Modules
D. Generic Deleting of Article/s or Post on each Module/s
E. Content
1. Banner
2. Files
3. Gallery
4. News / Announcements
5. Options
6. Pages
7. Tutorial
8. Widgets
F. Training
1. Activities
1.1 How to add Activities
1.2 How to add Questions
1.3 How to check trainee activities
2. Certificate
2.1 How to add certificate
2.2 How to edit certificate
2.3 How to add signatories
3. Transcripts
 3.1 How to add transcripts
4. Training
4.1 How to add Parts
4.2 How to add Subparts
4.3 How to add Slides
4.4 How to edit Contents and Slide arrangements
5. Ratings Percentage
5.1 How to set Ratings Percentage
6. Trainees
G. Users
1. Groups
2. Permissions
3. Users
H. WYSIWYG(CMS Editor)
1. Images
2. Links
3. Tables
4. Format and Size
IV. End-User Interface (Mobile App)
I. Introduction

The purpose of this document is to provide complete tutorial and administrator guide

for the backend and frontend functions of the DILG site. This provide step-by-step on

how to configure, customize and update the different parts of the site.

II. End- User Interface (Frontend)

A. Access
Default Access

Front End Link http://forward-dev.com/dilg

Front End Default Access Username: admin
Password: @dm!n321

1. To access the user account, open the frontend link provided in the table.
2. Fill in the Username and Password access given on the Table. Then click the Login
Button.
B. Registration
1. If the user is not yet registered he/she can create an account by going to the
Register Now Link besides the login access.

2. The user must now fill all the required fields provided by the system.

3. Then wait for the confirmation of your registration that will be sent through your
email address.

4. Wait for account approval. Email will be sent with login information once your
account has been approved.
C. Home
1. Sections of page are the discussion of page parts. This will help user to be particular
with site’s common terms and parts.
1 Main Navigation This is where the user can navigate the whole site.
2 Profile This is where the user can see his/her information.
3 Translator The user can change the language by selecting Tagalog
or English.
4 Burger Menu
5 News and Announcement This is where the user can see the latest news and
announcements.
6 Calendar This is where the user can see the upcoming events.
7 Last Training Lesson This is where the user can see the progress of his or her
training.
8 Chat Box This is where the members can interact in real-time.

D. Tutorial
1. In the first access of the account the system will automatically direct the user to
tutorial

2. It will show a video on how to use the site properly.

3. Then the user can now proceed to Training.
E. Training

1. Status – is where the user can see what part of the training he/she is taking. And
also show the percentage progress on every part.
2. Module – This is the sub part of the training that the user will take. Click the module
to start taking the training.
1. Slide Presentation - This is where the user can see the training slides.
2. Module Progress – This is where the user can see his/her progress and the next
topic for the training.
3. Next Lesson – After finishing all the training slides the user can now proceed to the
next training.
4. Content – This is where the user can see the description for the training slide.
F. Activity

1. Banner – After taking the activity the user should see a banner that tells the user to
go to forums for discussion.
2. Results – This indicates if the activity is Passed or missed and also if it is already
checked or unchecked.
3. Score – This shows the overall score of the user after taking the activity.
4. Back to Previous Lesson
5. Continue to the Next Lesson
G. Forum

1. Topic – This is where the user can see the title of the forums.
2. Post – This is where the user can see the number post for every forum.
3. Latest Post – This is where user can see the latest post that has been posted by the
admin.
4. Filter Search – The trainees can search any forum topic using the filters; it can be also
in ascending and descending order.
 5. Comment Post – This is where the entire trainee can see the comments of the other
user.
6. Reply Post – This is where the trainee can reply to the other comments of the user.
H. File

1. This is where the user can download every file that has been uploaded by the admin.

I. Gallery
 1. Gallery Album – This is where the user can see photos that has been uploaded from
the backend. Click the View Photos to view the contents of the album.

J. Profile
 1. Profile – This is where the user can see his/her information.
2. Photo – Profile picture of the user.
3. Member Since / Last Login – The log when was the user last logged in and member
since.
4. Edit profile – This is where the user can change some information about his/her
profile.
5. Change Password – This is where the user can change his/ her password.
6. Score Sheet – This is where the user can see his/her score evaluation.
7. Certificate / Transcript Record – This is where the user can see his/her records from
the over all training.
8. Logout

1. Course – List of activities that have been taken.

2. Final Training Score – The overall score for every activity.
3. Evaluation Scale – The rating based on the score.

K. Chat Box
1. This is where the entire user can communicate and weather if its personal message
or a group chat with every member.
III. End-User Interface (Backend)
A. Access
Default Access

Front End Link http://forward-dev.com/dilg/admin

Front End Default Access Username: admin
Password: @dm!n321

1. To access the user account, open the frontend link provided in the table.
2. Fill in the Username and Password access given on the Table. Then click the Login
Button.

B. Dashboard
B. 1 How to Approve Request’s
After logging in the admin will be directed to the Dashboard where he can:
1.1 Approval of Trainees - Click the approval dropdown for approval status and
select between Approved or Disapproved, and the admin can also Go To trainees

by clicking the button.

 1.2. Approval of Certificates – The admin can assign whose signatories will be
put on the Certificate of each Trainee. Click the dropdown and select a name.
Then click save, it will automatically displayed on the trainee’s certificate.

1.3. Approval of Transcripts – The admin can assign whose signatories will be
put on the Transcript of each Trainee. Click the dropdown and select a name.
Then click save, it will automatically displayed on the trainee’s transcript.

C. Generic Adding of Articles or Post on each Modules

1. On admin backend, go to Content and choose from the list of modules
where the article/post will be added. These are for Banner, Calendar,
Downloads, Forums, Gallery, News / Announcements, and Tutorial pages
only.
 Note: Files, Page and Widgets modules are not included on this
generic instruction on how to add article/s or post/s.

2. At the upper right section, click the generic + Add or +Create button (both

buttons have same functionality) to upload another article/post where it will

be redirected on each corresponding forms.

3. Fill up all the required fields (i.e. Title, Slug, Content, etc.).

4. Save the details.

D. Generic Deleting of Article/s or Post on each Module/s
1. On admin backend, go to Content and choose from the list of modules where the

article/post will be deleted.

Note: Files, Page and Widgets modules are not included on this generic instruction on
how to delete article/s or post/s.

2. Choose the article/s or post/s to be deleted on the list.

Single Delete - Click on the Delete button under Actions column.

Bulk Delete - Choose the articles/posts to be deleted by ticking the checkboxes.

E. Content
1. Banner

1.1 Update a Banner

a. On admin backend, go to Content > Banner.

b. Choose the banner to be edited.

Note: Status and Category filters can be used to look for the specific page banner.

C. Click Edit button under Actions column for the chosen banner and it
will be redirected on its corresponding page.
 Note: Category field is where the banner will show. It is important to choose from the set of
categories. To create a new category from the set of pages, go to how to Add New Banner
Category section below.
d. After editing the contents, click Save.

1.2 How to Add New Banner Category

Note: Adding banners on some CMS pages are not allowed (i.e. Glossary, Terms &
Conditions, Privacy Policy, etc.) because of the design for each simple CMS pages.

1.2.1 Go to Categories on the Banner’s tabs.

1.2.2 At the upper right section of the page, click + Add Category button and it

will be redirected on the Category Form.

1.2.3 Fill up the Title and Slug field.

Note: Slug field should have the same slug with the created page where the banner will
display. To check the page’s slug, go to Content > Pages and look for the page’s slug by
clicking on the chosen page. See image below for reference.
1.2.4. Click Save. Image below shows how it looks like on frontend.

2. Files

2.1 How to add Files

2.1.1 To add new folder click . It will automatically appear on
the middle pane. Right click the folder and select an option, you can Open,
Upload, Rename, Delete or see the details of the folder.

2.2.2 The user can also select a folder then select an action on the upper right
of the table.

2.2.3. To upload a file just clicks the drop box or drag and drop the file on the
box. The user can also select multiple files then the selected files will appear
in a list at the bottom of the screen. After choosing a file the user can now
start the upload

Process by clicking
3. Options

4.1 How to add Option for Position and Location in the registration field.
4.1.1 Click the button, and then fill the Title and slug fields.
4.1.2 Then save the new Option Title. Click the button to add options. Fill
the title field then save.

4.1.3 After saving it you can drag and arrange it.

4. Pages
5.1 How to Add Pages in the backend.
 5.2. Go to Contents and select Pages.

5.3 Click the button to add a page. Then fill all the required fields
needed.
5.4.1 To edit a table just click the Page title [1] then in Explanation [2] click the
button.

5.4.2 The user can also drag and arrange each page [3].

5.5 How to add page type. Click the . Then fill all the required fields
and save.
5. Widgets

6.1 Go to Content then click Widgets.

6.2 How to add Slide background. Click the Training Slide Design Template then
select if Background Color, Header Background Color, and Background Picture.
 6.3 How to put background picture on the slides in the training.
6.3.1 Select the Area [1] then get the HTML [2] code from files. Copy and paste it
on the field then save it.

6.3.2 How to get the image code to paste on the HTML field. Go to files then
select the Image file. Right click on the image and select Details [1], on details and copy the ID
code [2] then paste it on HTML field in the widgets.
F. Training
7. Activities

7.1 How to add Activities

7.1.1 Go to Training and select Activities.
7.1.2 Click the button to add a new activity. Fill all the
required field then clicks save.
7.1.3 After saving the user can now create a list of questions per slide.

7.1.4 Click the button to add. Then fill all the required
fields, select a question type [1] (Essay, Multiple choice, or
Activity).
 7.2 How to check trainee activities
7.2.1 Click the button to check the trainee activities.
7.2.2 Then click the button the check every trainee activity
entry.
7.2.3 In evaluation the user admin can select the how many points
should be given to the trainee based on the given activity.

8. Certificate
8.1 How to Update certificate
8.1.1 Just fill the fields for the Certificate Text Contents then click .

8.2 How to add/edit certificate

8.2.1 Click the button then fill all the required fields.
8.2.2 Select the name of the Trainee [1] then the signatories [2] for the
certificate.
8.3 How to add signatories
 8.3.1 To add signatures for the certificate click the the fill all
the fields required. Choose a PNG file to upload the signature.

9. Transcripts
9.1 How to add transcripts
9.1.1 Click the to add a transcript. Then select a trainee
and signatory just like in certificate and save the transcript.

10. Training
10.1 How to add Parts
10.1.1 Click the button. Then fill all the required fields and save.
10.2 How to add Subparts
10.2.1 Go to subparts module. Then click the button. Then fill
all the required fields and save.
10.3 How to add Slides
10.3.1 Go to slides module. Then click the button.
10.3.2 If the user wants to add a slide using Image. Click the choose file
button and select an Image from your laptop or desktop. Then
click okay to upload the image.

10.3.3 If the user wants to create a slide manually, they can use the
Training Slide Wyswyg.
 10.3.4 The user can also put a description under the training slide. Just
use the Content.

10.4 How to edit Contents and Slide arrangements

10.4.1 To edit the training slide just click the button and save the
update slide.

10.4.2 To arrange the order of the slide just select then drag and
drop it to whatever order you want.

11. Ratings Percentage

 11.1 How to set Ratings Percentage
11.1.1 To set every activity training rating, for every course the user must
set the percentage that is not less than a 100%.

11.1.2 On the Overall Percentage training, the user can set the amount of
percentage for every participation of trainee in Activities, Forum and Field
training. The user can also add new criteria just click the button and
fill the name field, then save.

12. Trainee
 12.1 How to approve a trainee.
12.1.1 Click the dropdown box for approval status and select between
Approved and Disapproved.

12.1.2 The user can also see the trainee’s Certificate, Transcript,
Activities and Score Sheet.

G. Users

1. Groups – To add new Group click the . Fill the necessary fields
then save. To edit the groups just click the button, then for
permission click the .
2. Permissions – To edit user permission click . Then assign the
each user to have access to the module needed and roles a user can
have. To select permission click then save.
3. Users – This shows the users that are registered in the system.
H. WYSIWYG(CMS Editor)

1. Images
a. To insert an Image click the image icon and select an image at
the folders.
Note: You can first upload the images in files that will be used in
post.

b. As the image appears in WYSIWYG, You may resize the image.

Right click on the image and select Image Properties.
 c. Image properties will appear, fill up your measurement of width,
height and also the border. To adjust the distance if the image
from its container, adjust HSpance (Horizontal Space), Vspace
(Vertical Space), the user may also set the alignment.

2. Links
a. To add link, simply click the link icon.
 b. Under the URL field, fill in the URL of the navigation.

3. Tables – Table properties will appear, fill up your desired number of rows
and columns, headers, border size. Also alignment, caption, summary can

be fill up if necessary.

4. Format and Size

a. To select text format, click in WYSIWYG. Choose your
format depending on your use.
b. To select font size, click in WYSIWYG. Choose your font size
 depending on your use.
c. To select bullet form, click in WYSIWYG.
d. To select numbering, click in WYSIWYG.