2. Arnel I. Robles (arnelirobles.blogspot.com)
CUSTOMIZING YOUR JOOMLA SITE

3. Open your web browser.
Type in the address bar:
localhost/nameofsite/administrator
Add New Tab and type:
localhost/nameofsite
*Note: nameofsite is the name your website (mysite, practicedenr, etc)

4. Log on as administrator

6. CHANGING YOUR TEMPLATE

7. Mouse Hover Extensions
Click Extension Manager

8. Click Browse

9. Local the template. In our case, it is JustBusiness-FJT.zip
Found in ..Joomla Training DENR XII0.Requirements
Double click it

10. Click Upload & Install

12. Mouse Hover Extensions
Click Template Manager

13. Check JustBusiness-FJT – Default
Click Make Default

15. Go to the Tab for localhost/nameofsite
Press F5

16. ADDING MENUS

17. In the administrator panel.
Mouse Hover Menus
Click Menu Manager

18. Note
There is a predefined menu named Main Menu.
For ease, we will edit the predefined menu.
To create another menu just click New.
Click Main Menu. The following window appears.

20. Lets add a menu items
PROFILE, DIRECTORY, SECTOR,
PRESS RELEASES, FEEDBACK
I will show how to add PROFILE menu item.

21. Click New

22. Since we don’t have article yet we will use External URL as Menu Item Type.
Click Select

23. Click External URL

24. Type PROFILE in the Menu Title
Click Save & Close
*Use same process for the remaining Menu Items

26. DISPLAYING MENUS USING
MODULES

27. In order to display your menus, modules must be defined.
We will work with the module
Positions in our template.
In the admin panel
Mouse Hover Extensions
Click Module Manager

28. Click New

29. Choose Menu as Module Type

30. Title: topmenu
Click Save & Close
Position: menuload

31. Switch to the other tab displaying your site and hit F5

32. ADDING DROPDOWN MENUS

33. Before adding a dropdown menu do this first.
In Module Manager click topmenu

34. In the Basic Options -> Show Sub-menu Items
Choose Yes and click Save & Close

35. We will add the following sub-menus:
Directory
Region XII Officials
Organizational Structure
Sector
FMS
LMS

36. Go to Menus -> Menu Manager
Click Main Menu

37. I will add Region XII Officials under Directory.
Click New.

38. Choose External URL as Menu Item Type
Menu Title: Region XII Officials
Parent Item: -Directory
Click Save & Close
Open your site and hit F5.
*Do the same steps on other sub-menus

41. ADDING ARTICLES

42. Content -> Article Manager -> Add New Article

43. Title: About DENR
Write a brief article.
Click Save & Close

44. Add other article using the same process

45. DISPLAYING ARTICLES BY LINKING
TO MENUS

46. Menus -> Main Menu

47. We will connect the About DENR article to Home
Click Home

48. Change Menu Item Type to Single Article

49. Click Select/Change
Click About DENR
Click Save and Close

50. Open your site and hit F5

51. REMOVING UNNECESSARY DETAILS

52. Details like this are not necessary.

53. Menus -> Main Menu
Click Home
Set the options as shown
Click Save & Close
View your site and
Hit F5

54. ADDING IMAGES

55. We will add a module on the left.
By this time it will be an image.
From Joomla Training DENR XII0.Requirements
copy image1.jpg to
C:wampwwwnameofsiteimages

56. Click Extensions -> Module Manager
Add New Module with type Custom HTML
Title: SECRETARY’s CORNER
Position: left

57. In the Custom Output click Image

58. Click image1.jpg and click Insert
Resize the picture and click Save & Close

60. DISPLAYING LIST OF ARTICLES

61. Click Extensions -> Module Manager
Click New
Choose Articles Category as Menu Type
Set Title to RECENT ARTICLES
Position: Right
Click Save & Close
View your site and hit F5

62. ADDING WEB LINKS

63. Mouse Hover Components
Click Weblinks then click New
Title: DENR CENTRAL OFFICE
URL: www.denr.gov.ph
Save & Close
*Add more weblinks

64. DISPLAYING WEBLINKS

65. Extensions -> Module Manager
Click New
Choose Weblinks as Module Type
Title: RELATED LINKS
Position: Right
Target Window: Open in New Window
Save & Close

66. CHANGING THE LOGO

67. Replace the logo.png file in
C:wampwwwnameofsitetemplatesjustbusiness-fjtimages

68. OTHER CONFIGURATIONS

69. Mouse Hover Extensions
Click Template Manager
Click Just Business-JFT (set your preferences)
*For the slideshow just replace the images at
C:wampwwwnameofsitetemplatesjustbus
iness-fjtslideshow