modul penggunaan cms (joomla, wordpress, dll)
Post on 23-Oct-2015
35 Views
Preview:
DESCRIPTION
TRANSCRIPT
Practical Work Material KS091302 – Introduction to Information System
Module 06: CMS – Joomla and Prestashop
This module will explain how to use, organize and manage the most commonly used CMS for e-commerce Joomla and Prestashop. At this module, student will learn both of the CMS features and try to make their own e-commerce website
INFORMATION SYSTEM Department Faculty of Information Technology
Institut Teknologi Sepuluh Nopember
Surabaya
2012
KS091302 – Introduction to IS Practical Work Material
1
DOCUMENT AUTHORITY
Prepared by
Faza Faikar Cordova
Annis Paramita Dilla
Yoga A. Prasatria
Faridl Mughoffar
Reviewed by
Ahmad Mukhlason
Feby Artwodini M.
Retno Aulia Vinarti
Amna Shifia
INFORMATION SYSTEM Department, Faculty of Information Technology
Institut Teknologi Sepuluh Nopember
Jl. Raya ITS – SURABAYA 60111
http://si.its.ac.id/
Publish date : 4/2/2012
KS091302 – Introduction to IS Practical Work Material
2
TABLE OF CONTENTS
Document Authority ...................................................................................................... 1
Table of Contents ........................................................................................................... 2
List of Tables and Figures ............................................................................................... 3
Practical Work Objectives .............................................................................................. 5
Joomla At Glance ........................................................................................................... 6
Joomla Configuration ..................................................................................................... 7
How to change the template? ................................................................................... 7
Managing Content/Article by Section and Category. .............................................. 10
Managing Content With Menu ................................................................................ 12
User Management ................................................................................................... 16
Prestashop Configuration ............................................................................................ 18
1. Modules .......................................................................................................... 18
2. Statistic ........................................................................................................... 20
3. Catalog ............................................................................................................ 21
4. Customer ........................................................................................................ 23
5. Payment ......................................................................................................... 25
6. Feature Product .............................................................................................. 27
Take-Home Assesment ................................................................................................ 32
Suggested resources .................................................................................................... 33
Bibliography ................................................................................................................. 34
KS091302 – Introduction to IS Practical Work Material
3
LIST OF TABLES AND FIGURES
Figure 1 Joomla Logo ...................................................... Error! Bookmark not defined.
Figure 2 Template Manager ........................................................................................... 7
Figure 3 Module Template Manager ............................................................................. 8
Figure 4 Change Schemes .............................................................................................. 8
Figure 5 Extentions ........................................................................................................ 9
Figure 6 Module Uploder ............................................................................................... 9
Figure 7 File Manager to Upload ................................................................................... 9
Figure 8 Installing Succed ............................................................................................. 10
Figure 9 Content Management .................................................................................... 10
Figure 10 Home Tool .................................................................................................... 11
Figure 11 Form to Create Section ................................................................................ 11
Figure 12 Article Module ............................................................................................. 12
Figure 13 Article Module Features .............................................................................. 12
Figure 14 Module Manager ......................................................................................... 13
Figure 15 Main Menu ................................................................................................... 13
Figure 16 Item Manager .............................................................................................. 13
Figure 17 Mapping Item ............................................................................................... 14
Figure 18 Sub Parent Item ........................................................................................... 14
Figure 19 Article Layout ............................................................................................... 14
Figure 20 Parent Items Control .................................................................................... 15
Figure 21 Insert Article ................................................................................................. 15
Figure 22 Created Map View ....................................................................................... 16
Figure 23 Preview Has Change ..................................................................................... 16
Figure 24 User Manager .............................................................................................. 17
Figure 25 Adding User .................................................................................................. 17
Figure 26 Module Prestashop ...................................................................................... 18
Figure 27 Adding module ............................................................................................. 18
Figure 28 Browsing module ......................................................................................... 19
Figure 29 Uploading module ........................................................................................ 19
Figure 30 Module downloaded successfully ................................................................ 20
Figure 31 Activated module ......................................................................................... 20
Figure 32 Back Office Statistic ...................................................................................... 20
Figure 33 Catalog ......................................................................................................... 21
Figure 34 Categories .................................................................................................... 21
Figure 35 Adding Category ........................................................................................... 22
Figure 36 Adding Product ............................................................................................ 22
Figure 37 Product Identity Form .................................................................................. 23
Figure 38 List Of Customer Menu ................................................................................ 24
Figure 39 Data of Customer ......................................................................................... 24
KS091302 – Introduction to IS Practical Work Material
4
Figure 40 Enable payment module .............................................................................. 25
Figure 41 Setting curency ............................................................................................ 26
Figure 42 Setting taxes ................................................................................................. 26
Figure 43 Setting voucher ............................................................................................ 27
Figure 44 List of Product Category ............................................................................... 27
Figure 45 Setting Product Feature ............................................................................... 28
Figure 46 Setting Shipping ........................................................................................... 28
Figure 47 Setting Carrier and Zone .............................................................................. 29
Figure 48 Shipping States ............................................................................................. 29
Figure 49 Countries Options ........................................................................................ 30
Figure 50 Shipping Zones ............................................................................................. 30
Figure 51 Shipping Price Ranges .................................................................................. 31
Figure 52 Shipping Weight Ranges .............................................................................. 31
KS091302 – Introduction to IS Practical Work Material
5
PRACTICAL WORK OBJECTIVES
The objectives of this practical work is giving practicant with knowledge and experience in
management and configuration of Template, contents, menus, user in Joomla and Prestashop!
Content management System. In order to be fully understood the material, the practicants have to
try some parts of the material that need to be practiced by themselves.
KS091302 – Introduction to IS Practical Work Material
6
JOOMLA AT GLANCE
From the last practicum (module 05), we already know that Joomla is one of the
most popular Content Management System that can help us to build website. Although
there are many kinds of CMS (Content Management System) depend on their feature and
function, right now we choose to use Joomla, actualy Joomla Ver.1.5. The logo of Joomla is
depicted by Figure 1.
Figure 1 Joomla Logo
The question is: why we use Joomla Ver 1.5?
Joomla Ver 1.5 is a version from Joomla that built with GNU License (It means free
to massive distribution). As we know, in IT World the software that has released in new
version is more complete than the older version. Although it doesn’t perfect very well, but
at least it has bugs fixes.
The question is: first version, latest version, it means Joomla , so does Joomla have
history?
Absolutely! Further and concise information about the history of Joomla can be found at
[1] and the latest version of Joomla can be checked at [2]. If you want to communicate with
other joomla users, you can join some forums discussing about Joomla. To join with Joomla
user in Indonesia, you can join at [3].
KS091302 – Introduction to IS Practical Work Material
7
JOOMLA CONFIGURATION
After installing Joomla, you will get the default joomla website design and configuration,
and now the question is:
How to configure it on your own?
Bellows are step by step instructions how to configure your Joomla
Changing the Joomla Template
Template is the most important things in all website, especially when we configure it using
CMS! Because by using this template you can change your web appearance (design) and
you can change your website content n easily. By the default, after the installation process,
Joomla will give you two standard templates. Other than these templates, you can find it on
the internet or make it yourself by using designer tools.
Just search in Google using keyword “Joomla Template” you can find thousands links that
provide either free or commercial template. For instance, you can get free template from
[4], [5], and [6].
How to change the template?
To change you template with another template, just follow this instruction:
1. Click Extensions Tab, while the dropdown menu is open, Click Template
Manager and you will see a Template Manager Menu as depicted by
Figure 2.
Figure 2 Template Manager
2. The selected template in Figure 3 is the current template. To change it with
another one, select your desired template and click star bellow default tab to
make it as default template.
KS091302 – Introduction to IS Practical Work Material
8
Figure 3 Module Template Manager
3. For instance, select “rhuk_milkway” template. In order to make some
changes in template settings, click the “rhuk_milkway”, then you can set
some parameters such as depicted by Figure 4. You can change the color
variation, background variation color, and template width.
Figure 4 Change Schemes
4. Finally, to make sure the changes, you must click Apply/Save button. To see
the changes of your website with the new template, just refresh your
website URL ( for example: http://localhost/tespsi(yourfoldername).
The prior steps are instruction how to change template using the given
(default) template. Now, how to add other templates? (Supposed you want
to add templates that you downloaded from internet, Instead of the given
default template).
Here is the step and instructions:
1. Download your desired template from any resources. Usually you will get
the template in .zip format.
2. How to use your template is an easy way. You just need to
extract/install it in your Joomla.
3. Go to Extensions Tab menu, and choose Install or Uninstall (see Figure 5).
KS091302 – Introduction to IS Practical Work Material
9
Figure 5 Extentions
4. Then, upload your desired template file in the Upload Package
File Tab (see Figure 6).
Figure 6 Module Uploder
5. Finally, just click browse button to select your file in your computer
and click Upload File & Install button as depicted by Figure 7.
Figure 7 File Manager to Upload
6. If your template is successfully uploaded, then the system will give you
an confirmation such as depicted by Figure 8.
KS091302 – Introduction to IS Practical Work Material
10
Figure 8 Installing Succed
7. To use it as your new template for your Joomla Website, just follow the
prior instructions, starting from Figure 3.
Managing Content/Article by Section and Category.
Another important thing to do for managing your Joomla Website well is how to manage
the content of your website well. Content here means any article that you want to post in
your website. It is Just like how to manage your posting in your blog.
How to add new Article.
To add a new article at your website, go to content tab (see Figure 9), then select article
manager, and finally create your new article.
To manage your article posting well, in Joomla You can classify your article by efining
sections and categories. A section can contain some categories an a categories can
contain some articles.
How to create new section?
1. To begin managing sections, click on section manager from Content tab (see
Figure 9).
Figure 9 Content Management
KS091302 – Introduction to IS Practical Work Material
11
2. Then, Click on “New” on the Joomla Toolbar as depicted by Figure 10.
Figure 10 Home Tool
3. Type the title and description for your new section and then press “Save” on
the toolbar (see Figure 11).
Figure 11 Form to Create Section
4. Create section as many as you need. Use sections to classify similar articles in
the same section.
How to create new category?
5. After finishing working with sections, now you can create new category by
selecting Category Manager from Content Tab (see Figure 9).
6. Now, you can classify your article by either section or category. In
articles menu you can do a lot of things (see Figure 12) :
a. Add a title for the article, and put it into a section and category.
b. You have the option to publish or un-publish your article, as well as the choice
whether to display the article on the front page.
c. You can use the “page break” button to divide the article into pages.
KS091302 – Introduction to IS Practical Work Material
12
d. You can use the “read more” to divide the article into the section to display in a
summary view and full view.
e. You can use the “image” button to insert an image into your article using the
simple upload form in combination with Joomla's media manager.
f. After finishing typing your article, click “Save” button to save it and return to
the article manager, or click “Apply” to save it and continue editing. Then your
articles will show up in the frontpage.
Figure 12 Article Module
Figure 13 Article Module Features
7. Do the same steps if you want to create another article.
Managing Content With Menu
Another way to manage your website content is by using menu. Menu will easy your
website visitor while visiting your website. Joomla has a built-in system for managing
menus. This system is built around the three types of information in Joomla i.e.
components, modules, and plugins. If components are the main information in your Joomla
Driven by menus, you will see only the front page articles at the front page of your site.
KS091302 – Introduction to IS Practical Work Material
13
The contact information, web links, news feeds, and articles that are not published on the
front page are not visible because each page displays one component at a time.
How to create a new menu?
1. Firstly, click on the Menu Manager Module (see Figure 14).
Figure 14 Module Manager
2. . Choose Main Menu as depicted by Figure 15.
Figure 15 Main Menu
3. Then a new page such as depicted by Figure 16 will be displayed.
When this page is displayed, easily click New button.
Figure 16 Item Manager
4. Then select type of menu that you want to use it as depeicted by Figure 18 and
19.
KS091302 – Introduction to IS Practical Work Material
14
Figure 17 Mapping Item
Figure 18 Sub Parent Item
5. Then click parent menu, and fill the menu name such as depicted by
Figure 20 and Figure 21.
Figure 19 Article Layout
KS091302 – Introduction to IS Practical Work Material
15
Figure 20 Parent Items Control
6. If you choose menu article for layout don’t forget choose the articles that you
want to inserted on the menu as depicted by Figure 22
Figure 21 Insert Article
7. Then choose one articles, close the pop up menu, click Save then it will show you such as depicted by Figure 23.
KS091302 – Introduction to IS Practical Work Material
16
Figure 22 Created Map View
8. To see the changes, refresh your web site URL (See Figure24).
Figure 23 Preview Has Change
User Management
One of benefits of Joomla CMS is Multiuser. Multiuser means it can be managed by
more than one user with different authority. The highest authority level is called user
administrator. Other than that you can also add new user with different level authority
or different access level in Joomla Bellows are step by step instructions:
1. Open the back end from Joomla (it means Administrator Menu)
2. Choose user manager, and user manager page will be displayed such as
Figure 25
KS091302 – Introduction to IS Practical Work Material
17
Figure 24 User Manager
3. Click New to add user.
4. Fill the name, email and password tab and choose group to which this user is
assigned and finally save it (See Figure 26).
Figure 25 Adding User
KS091302 – Introduction to IS Practical Work Material
18
PRESTASHOP CONFIGURATION
1. Modules
Modules is a menu that provide features of Prestashop. In this menu we can choose
what features that will be exist in our website. To activate features of Prestashop
we can directly click install button.
Figure 26 Module Prestashop
There are many kind of features that provided by Prestashop, but we can add more
features from internet. To activate module from internet, click “Add a new module”
button.
Figure 27 Adding module
After that, insert the address on “Module URL” if download the module directly from
internet or upload file by clicking “Browse” button if we have the module
KS091302 – Introduction to IS Practical Work Material
19
Figure 28 Browsing module
After clicking “Browse” button, we must choose module from computer, then click
“Upload this module” button.
Figure 29 Uploading module
If your module is successfully uploaded, then the system will give you an confirmation
such as depicted by Figure below.
KS091302 – Introduction to IS Practical Work Material
20
Figure 30 Module downloaded successfully
We can find module that have been uploaded on the list of modules. Then activate
module by clicking “Install” button.
Figure 31 Activated module
2. Statistic
Statistic menu is one of standard menu of Prestashop. This menu have function to
record sales, orders, customer registration, and frequency of products that have been
viewed by visitors. On the other hand, this menu can show development
graph of business process that occur on the website.
Figure 32 Back Office Statistic
KS091302 – Introduction to IS Practical Work Material
21
3. Catalog
Catalog menu have a function as a regulator of products. In this menu, product can be arranged by categories and types of product in order to make visitor easy in finding products
Figure 33 Catalog
3.1 Category
Category is a large group of products. We should make category before making the product. To add a category we select the button "Add a new categories" like the picture below.
After that will appear page to fill the categories identity, such as: name of the
category, images, or the other.
Figure 34 Categories
KS091302 – Introduction to IS Practical Work Material
22
Figure 35 Adding Category
3.2 Product To add a product just like we add a category, we select the button "Add a new product."
After that will appear a page to fill out the identity of the product, such as: product name, image, price, description of products, etc.
Figure 36 Adding Product
KS091302 – Introduction to IS Practical Work Material
23
Figure 37 Product Identity Form
4. Customer
One of the other standard features of the Prestashop is can be used to store
customer database. Customer data can be known from this Customer module. When
the Customer clicked the "Sign Up" button then the customer identification data will
be recorded automatically in the database. To see it we simply click in the Customer
name then we will be shown pages that contain customer data.
KS091302 – Introduction to IS Practical Work Material
24
Figure 38 List Of Customer Menu
Here are a subscriber identity data that can be viewed via the Customer module.
Figure 39 Data of Customer
KS091302 – Introduction to IS Practical Work Material
25
5. Payment
Payment are set type of module to manage type of payment that provided by the
company in the process of customer payments. The types of payments provided
prestashop include: banks, checks, and paypal. To enable us simply click the "install"
button. However, to enable the paypal feature we should have a paypal account.
Figure 40 Enable payment module
In module payment, we can get sub module such as currencies, taxes, and voucher.
5.1. Currencies
Currencies modules shown the types of currency to be used in the company's
website. We can enable some currencies in prestashop, like Euro, Dollar, Pound,
amount, etc. To add a type of currency we can press the button "Add new" add
the desired type of currency. After that, we also must determine the
Default Currency. In this case the default currency that used is Dollar.
KS091302 – Introduction to IS Practical Work Material
26
Figure 41 Setting curency
5.2. Taxes
Taxes is a submodule which regulates tax. Setting additional types of taxes just
like currency. There can be determined the amount of tax that would apply in
the business process.
Figure 42 Setting taxes
KS091302 – Introduction to IS Practical Work Material
27
5.3. Voucher
Voucher is a submodule that is used to provide vouchers to customers
with the provisions established company. To add press the button "Add new"
Enter the desired type of vouchers and its settings.
Figure 43 Setting voucher
6. Feature Product
Featured product is a feature to display the product on the “Home” page website. To
attract consumers then have to choose the best possible products to be displayed on
the "Home" page. To arrage it click in “Catalog” “Category” “Product” likes picture
below.
Figure 44 List of Product Category
KS091302 – Introduction to IS Practical Work Material
28
After that, choose a product that will be the "Featured Product". On the product
editing page, click on "Home". Then save the settings.
Figure 45 Setting Product Feature
2. Shipping
Shipping is a module that will be used to manage the delivery of products. There
are some settings that are the provisions of each company, including the costs
and parameters used when Billing.
Figure 46 Setting Shipping
KS091302 – Introduction to IS Practical Work Material
29
Then determine the type of Carrier and shipping Zone.
Figure 47 Setting Carrier and Zone
Then arrange Carrier in the submodule Shipping. In this case, companies can
determine the types carrier. Beside that, setting the "Default Carrier" from all
types of carrier that has been determined.
Figure 48 Shipping States
Then in the submodule Countries company can determine which country will be
reached and default Country like the picture below.
KS091302 – Introduction to IS Practical Work Material
30
Figure 49 Countries Options
The next setting is Zones. Here, companies can manage zones that will be
reached.
Figure 50 Shipping Zones
Then setting the Price Ranges. It has function to setting the cost of shipping. Here
can be specified the types of costs based on Carrier used.
KS091302 – Introduction to IS Practical Work Material
31
Figure 51 Shipping Price Ranges
Next, settings the Weight Ranges which will be regulated based on the type of
carrier.
Figure 52 Shipping Weight Ranges
KS091302 – Introduction to IS Practical Work Material
32
TAKE-HOME ASSESMENT
1. Download a unique Joomla template from any resources or create your own
template, install it, and use it for your default Joomla template.
2. Chage the header ( Image header) with your own image header, you must
create it by using adobe photoshop or similar software ( for instance your
own photo header).
3. Create at least three articles (you can copy from any resources by giving
proper citation), at least one of them must be multimedia content (picture,
animation, mp3 or video). Manage your content by your own menu, section,
an categories.
4. Create 5 users in your Joomla with different level of authority.
5. Explore other configuration functionalities in Joomla as many as better ( for
example: how to configure the language, etc)
6. Change the background image on the home page of your prestashop
7. Documented the order and shipping process.
KS091302 – Introduction to IS Practical Work Material
33
SUGGESTED RESOURCES
1. http://ai23.wordpress.com/2007/02/25/tutorial-joomla
2. http://cahcepu.com/download/30-template-joomla-gratis-dengan-tampilan-menarik
3. http://www.google.com
4. http://prestashop.com
KS091302 – Introduction to IS Practical Work Material
34
BIBLIOGRAPHY
[1] http://en.wikipedia.org/wiki/Joomla [2] http://www.joomla.org/ [3] http://www.id-joomla.com/ [4] http://www.joomla24.com/ [5] http://joomlatp.com/ [6] http://www.templatejoomla.com/
top related