bai tap thuc hanh tmdt 2 15

Download tập tin Joomla từ website http://e-learning.tueba.edu.vn CÁC TÀI NGUYÊN CẦN THIẾT ĐỂ CÀI ĐẶT WEBSITE JOOMLA 1.1 Cài đặt Xampp Cài đặt chạy xampp-win32-1.7.2.exe vào thư mục gốc

Trang 1

3 Quản lý Menu và Benner

8 Virtuemart component (Nội dung phần này sẽ hướng dẫn các bạn sử dụng Virtuemart component để xây dựng website bán hàng.)

9 Backup và Restore (giới thiệu cách backup và restore dữ liệu bằng PHP MyAdmin)

10 Upload file lên host (Nội dung bài học này sẽ hướng dẫn các bạn cách Upload website lên server)

Trang 2

Bộ môn QTKD TH Trang 2

1 Cài đặt Joomla

Trong phần này sẽ hướng dẫn xây dựng website bằng Joomla, một trong những

hệ thống quản trị nội dung dựa trên nền tảng mã nguồn mở tốt nhất hiện nay, nội dung sẽ tập trung vào hướng dẫn cài đặt Joomla

Download tập tin Joomla từ website http://e-learning.tueba.edu.vn

CÁC TÀI NGUYÊN CẦN THIẾT ĐỂ CÀI ĐẶT WEBSITE JOOMLA

1.1 Cài đặt Xampp

Cài đặt (chạy) xampp-win32-1.7.2.exe vào thư mục gốc C:\ hoặc D:\ chọn

Install

Chạy file xampp-control.exe trong thư mục xampp

Chạy Apache, My SQL từ nút Start tương ứng

Khi thấy xuất hiện Running cạnh các dịch vụ trên thì tắt panel này từ nút close (X)

Trang 3

1.2 Cài đặt website Joomla

- Giải nén file Joomla_tueba.rar tới thư mục htdoc trong thư mục xampp sau

đó đổi tên Joomla_tueba thành tên CSDL ví dụ: tmdt

- Mở trình duyệt web, nhập địa chỉ http://localhost/tmdt

Bước 1: Lựa chọn ngôn ngữ sau đó chọn Next

Bước 2: Xuất hiện màn cửa sổ sau chọn tiếp để tiếp tục

Bước 3: chọn tiếp

Địa chỉ cần

giải nén

Trang 4

Bước 4: Xuất hiện cửa sổ Cấu hình dữ liệu

Bước 5: Chọn Tiếp để tiếp tục, xuất hiện cửa sổ tiếp theo

Bước 6: Đặt tên cho website đang cài đặt vào mục Site name

Nhập Localhost Nhập root

Nhập tmdt

Mật khẩu bỏ trống trống

Nhập tên cho Website

Nhập email

để hoàn

Nhập mật khẩu quản trị

Sau khi nhập các thông tin chọn cài đặt dữ liệu

Trang 5

Bước 7: hoàn thành bằng cách xóa hoặc đổi tên thư mục installation trong thư

mục xampp\htdocs\tmdt

- Chọn Site (trang web) để vào website hoặc chọn Admin (quản trị) để vào

chức năng quản trị website

Trang 6

2 Font End và Back End

2.1 Giới thiệu Font-end

Front-end là các trang Web mà người dùng thấy khi vào Website

Front-end hiển thị nội dung của Website và là nơi người dùng có thể thực hiện các công việc: đăng ký, đăng bài trên Website

Mở trình duyệt web, nhập địa chỉ http://localhost/tmdt

Giao diện thiết kế website Jooma

Các thành phần khác của Front End ( đăng nhập, quảng cáo, nội dung bài viết )

2.2 Giới thiệu back-end

Back-end là phần quản lý Website dành riêng cho các quản trị (Admin) Admin có thể cấu hình các thông số hoạt động, nội dung, hình thức,…

Các thành phần của Back-end bao gồm: Control Panel, Menu,

Information, Các thao tác thường dùng

Mở trình duyệt web, nhập địa chỉ http://localhost/tmdt/administrator

(mật khẩu chính là mật khẩu quản trị đã thiết lập ở phần cài đặt)

Nhập username

và password để

đăng nhập

Trang 7

Control panel

Menu - Thiết kế website Joomla

Thông tin web

Trang 8

Thao tác với các chức năng trên toolbar

 Publish: làm cho nội dung có hiệu lực

 Unpublish: làm cho nội dung không có hiệu lực

 Copy: Copy nội dung

 Delete hoặc Trash: Xóa nội dung

 Edit: Chỉnh sửa nội dung

 New: Thêm mới nội dung

 Help: Hiển thị phần trợ giúp của Joomla

 Save hay Apply: Lưu nội dung

 Cancel: Hủy thao tác

Qua phần này, các bạn đã được làm quen với các thành phần của giao diện cũng như của trang quản trị website bằng joomla

Trang 9

3 Quản lý Menu và Benner

3.1 Giới thiệu về Menu

Trong website Joomla, để di chuyển qua lại giữa các trang web, ta thường click vào các liên kết (link), các liên kết này nằm trong một vùng được gọi là Menu

Tạo Menu

Sau khi cài đặt VirtueMart thì cần phải tạo Menu cho nó để hiển thị các sản phẩm trên trang web Cách thực hiện cũng giống như những Menu thông thường, tuy nhiên VitrueMart có thêm các thông số để tạo nhiều kiểu Menu khác nhau Sau đây là cách tạo Menu cho Component Virtuemart

Trong phần Quản lý (Administrator) của Joomla!, truy cập vào Menus và chọn

Man Menu* (Trình đơn) nào muốn tạo Menu Item (Danh mục) cho

VirtueMart

Nhấn New để tạo một Menu Item mới

Chọn VirtueMart trong Menu Item Type

Menu

Các Menu Item

Trang 10

Đặt tên cho Menu này ví dụ: Sản phẩm hot nếu muốn hiển thị VirtueMart theo dạng chuẩn thì không cần thiết lập thêm thông số gì Nhấn Save để hoàn tất

Nếu muốn hiển thị VirtueMart theo các kiểu khác thì thiết lập thêm các thông số

trong phần Parameters (Component) Trong phần này có các tham số sau:

 Product ID: Hiển thị trang nội dung chi tiết của một sản phẩm: Nhập

số ID của sản phẩm muốn hiển thị

 Category ID: Hiển thị các sản phẩm trong một Danh mục Nhập số ID của

Danhn mục (Category) muốn hiển thị

 Flypage: Chọn kiểu trang trình bày cho trang Danh mục (Category):

Nhập tên của trang Flypage muốn hiển thị, không bao gồm phần mở

rộng Nếu muốn dùng trang mặc định thì có thể để trống

 Page: Chọn hiển thị một trang đặc biệt nào đó của VirtueMart: Nhập tên

của trang đó vào, không bao gồm phần mở rộng

 Sau khi thực hiện xong nhấn Save để lưu lại

Trang 11

3.1 Giới thiệu về Benner

Trong Joomla! có tích hợp sẵn một thành phần mở rộng có chức năng tạo

và quản lý Banner, đó là Component Banners và Module Banner Chức năng chính của chúng là giúp hiển thị các hình ảnh quảng cáo lên trang web, thống kê

số lượng người xem và nhấn vào quảng cáo

Sau đây là cách tạo và quản lý các Banner quảng cáo trong Jommla:

Bước 1:

 Tạo hình ảnh dùng để làm Banner và sao chép (copy) chúng vào thư mục

images/banner của Joomla Hình ảnh này có thể các dạng thông thường

như JPG, GIF, PNG, Animal GIF (ảnh động) hoặc SWF (Flash)

Bước 2:

 Đăng nhập vào phần quản lý (Admin) và chọn Menu Components ->

Banner -> Categories để tạo Category (Chuyên mục) chứa Banner này

Trang 12

 Đặt tên cho Banner trong mục Name

 Đánh dấu chọn Yes trong mục Show Banner để cho phép hiển thị Banner

này

 Nếu muốn cố định Banner thì chọn Yes trong mục Sticky

 Chọn Chuyên mục để chứa Banner trong mục Category

 Chọn tên khách hàng đặt banner này trong mục Client Name

 Nhập địa chỉ liên kết đến trang web của khách hàng vào mục Click URL

 Chọn hình ảnh của Banner trong mục Banner image selector

 Nhập thông số Width (chiều ngang) và Height (chiều cao) của Banner

nếu muốn thay đổi kích thước của Banner

 Hình ảnh của Banner sẽ được hiển thị ngay bên dưới, trong mục Banner

Image

 Sau khi thực hiện xong nhấn Save để lưu lại

Trang 13

 Banner sau khi được tạo ra và quản lý bằng Component Banner thì cần phải thông qua Module Banner mới hiển thị được trên trang web

Bước 9:

 Truy cập vào Menu Extensions -> Module Manager và nhấn New để tạo

Module Banner mới

Trang 14

Bước 10:

 Chọn Banner để tạo một Module Banner mới và nhấn Next

Bước 11:

 Đặt tên cho Module này và thiết lập các thông số như trong hình Chọn vị

trí muốn hiển thị Banner trong mục Position

- Target: Chọn "New Windows with Browser Navigation" để mở một cửa sổ

trình duyệt mới khi nhấn chuột vào bảng quảng cáo

- Count: Số lượng bảng quảng cáo muốn hiển thị cùng một lúc

- Banner Client: Chọn Khách hàng đặt quảng cáo, tất cả Banner quảng cáo của

khách hàng này sẽ được hiển thị Nếu không chọn thì Banner của tất cả các khách hàng đều được hiển thị

- Category: Chọn Chuyên mục chứa Banner quảng cáo, tất cả Banner trong

Chuyên mục này sẽ được hiển thị Nếu không chọn thì Banner trong tất cả các

Trang 15

Chuyên mục đều được hiển thị

- Randomise: Chọn chế độ hiển thị Banner quảng cáo Nếu chọn "Sticky

Ordering" thì quảng cáo nào được đánh dấu Sticky sẽ được hiển thị trước sau

đó mới tới các quảng cáo có thứ tự được sắp xếp trong phần quản lý Banner

Nếu chọn "Sticky Randomise" thì quảng cáo được đánh dấu Sticky sẽ được

hiển thị trước sau đó mới tới các quảng cáo còn lại được hiển thị theo thứ tự một cách ngẫu nhiên

 Sau khi thết lập xong nhấn Save để lưu lại Bây giờ các Banner quảng cáo

đã được hiển trị trên trang web

Lưu ý:

 Tùy theo nhu cầu sử dụng mà có thể tạo một Module Banner để hiển thị chung nhiều Banner quảng cáo hoặc mỗi Module cho riêng từng Banner quảng cáo cũng được

 Bất cứ lúc nào bạn cũng có thể theo dõi các thống kê về số lượt hiển thị (Impressions) và số lần nhấp chuột (Clicks) vào Banner quảng cáo bằng

cách truy cập vào Components -> Banner -> Banners

Trên đây chi là phần thiết lập các chức năng cơ bản của Banner quảng cáo trong Joomla! Các thiết lập mở rộng khác như: Sử dụng mã quảng cáo riêng từ các trang web quảng cáo, quảng cáo giới hạn lượt xem, quảng cáo có chọn lọc theo

"tag",

Trang 16

4 Thành phần mở rộng

4.1 Giới thiệu

 Joomla là một Web miễn phí hoàn chỉnh có đầy đủ các chức năng cơ

bản, tuy nhiên ta có thể bổ sung thêm các tính năng mới cho Joomla khi

cần bằng cách cài thêm các thành phần mở rộng (Component, Module,

Plug-in, Language,…)

 Các tính năng mới này sẽ giúp cho Web Joomla có nhiều chức năng hơn,

phong phú và đa dạng hơn

 Các thành phần mở rộng có thể là những thành phần đơn cũng có thể là

một gói kết hợp component, module, plug-in,… với nhau

4.2 Cài đặt thành phần mở rộng (ngôn ngữ)

Cài đặt ngôn ngữ cho site (trang web) và admin (trang quản trị)

Đăng nhập vào phần quản lý (Admin) và chọn Menu Extensions ->

Install/Uninstall

Xuất hiện cửa sổ như sau Chọn Browse

Chọn đường dẫn đến bộ tài nguyên và chọn vi-VN_joomla_lang_site.1.5.15.zip

để cài đặt ngôn ngữ cho site (trang web) sau đó chọn Open

Chọn Uploald File & Install

Tương tự như vậy ta cũng cài đặt ngôn ngữ cho Admin (trang quản trị)

Trang 17

Thiết lập ngầm định ngôn ngữ cho Site chọn Extensions->Language Manage

Xuất hiện cửa sổ chọn Site, chọn Vietnamese-VN rồi chọn Default

Tương tự thiết lập ngôn ngữ ngầm định cho Admin Chọn Administrator, chọn

Vietnamese-VN rồi chọn Default

Cài đặt ngôn ngữ cho VirtueMart mở tài nguyên chọn

Language_Pack_for_VirtueMart_1.1.4.zip -> Extract files…

Giải nén vào thư mục như đường dẫn:

xampp\htdocs\tueba\administrator\components\com_virtuemart sau đó

chọn OK

Trang 18

Trang Web (Site)

Trang quản trị (Admin)

Trong trang quản trị chọn Component\VirtueMart để vào quản trị bán hàng

Trang 19

Trang 20

Một khi bạn thiết lập các contact của bạn, các visitor sẽ có thể tìm các thông tin

contact và gửi tin nhắn cho contact

a Thêm 1 Category

 Bước 1: Vào Menu Components → Contacts→ chọn Categories

 Bước 2: Chọn New để thêm mới Category

Bước 3: Nhập thông tin cho Category và lưu lại

 Kết quả sau khi thêm

b Thêm 1 Contact

 Bước 1: Vào Menu Components → Contacts → chọn Contacts

 Bước 2: Chọn New để thêm Contact

Trang 21

 Bước 3: Trong màn hình thêm mới, nhập thông tin cho Contact và chon

Save lưu lại

 Sau khi thết lập xong nhấn Save để lưu lại Bây giờ contact đã được hiển

trị trên trang web

Trang 22

6.1 Cài đặt Template mới

 Bước 1: Download Template mới tại trang

http://www.siteground.com/joomla-templates.htm#joomla1.5 và các trang khác hoặc tự thiết kế Template

 Bước 2: Vào menu Extensions → chọn Install/Uninstall Manager

 Bước 3: Ở mục Upload Package File, tìm gói Template cần thêm mới, sau

đó click Upload File & Install Cài đặt template thành công

Kết quả

6.2 Thay đổi Template

 Bước 1: Vào Extensions → chọn Template Manager

 Bước 2: Trong danh sách các Template hiện có, chọn một Template muốn thay đổi, sau đó click chọn Default để hoàn thành việc thay đổi Template

Trang 23

6.3 Cập nhật Template

Cấu trúc chung của thư mục Template

 CSS: thư mục chứa tập tin template.css (tập tin chứa các định dạng cho

mẫu Template)

 Images: thư mục chứa các hình ảnh cần thiết cho Template

 index.php: trang chủ

 template_thumbnail.png: hình ảnh của template sau khi thiết kế xong

 templateDetails.xml: nội dungchi tiết của Template

 templates.php: gọi các phương thức để hiển thị Template

Trang 24

7 Quản lý nội dung

Bước 1: Chọn Content – Article Manager – New, xuất hiện hộp thoại điền

thông tin sau đó chọn Save

Title: Tiêu đề bài viết

Alias: tên khác bài viết

Section: vị trí xuất hiện bài viết

Pulished: chọn xuất bản hay không

Front page: có tóm tắt trên đầu trang hay không

Category : phân loại (thường chọn Lastest để bài viết đăng gần nhất sẽ xuất

hiện trước)

Bước 2 : Điền nội dung bài viết cần đăng

Cách chèn ảnh : chọn Image (cuối trang), xuất hiện hộp thoại như hình dưới, chọn ảnh cần chèn – chọn Insert

Chọn save, bài viết sẽ xuất hiện trên mục News của Menu Layout của trang

web như sau

Trang 25

8 Virtuemart component

Nội dung phần này sẽ hướng dẫn các bạn sử dụng Virtuemart component để xây dựng website bán hàng

8.1 Giới thiệu Virtuemart component

 Virtuemart là một component của Joomla, được sử dụng để xây dựng website bán hàng qua mạng

 Download tại địa chỉ: http://virtuemart.net

8.2 Cài đặt Virtuemart

Bước 1: Truy cập vào trang chủ của VirtueMart http://virtuemart.net và vào mục

Download

Bước 2: Download các file để cài đặt VirtueMart Có 2 cách thực hiện

 Download các Complete package để cài đặt từng phần cho VirtueMart (cài component và các module)

 Download file VirtueMart eCommerce Bundle là website Joomla đã cài đặt và cấu hình sẵn các component và module của VirtueMart

Chú ý: Trong bài này ta sẽ dùng bản VirtueMart tích hợp sẵn trong Joomla

Bước 3: Chọn Components-> VirtueMart

Trang giao diện

Nâng cấp VirtueMart từ ver 1.1.4 lên ver cao hơn (bản mới nhất)

Trang 26

 Bước 1: Đăng nhập vào phần quản trị của Joomla

 Bước 2: Vào Components\VirtueMart

 Bước 3: Ở menu trái, chọn Check for Updates

 Bước 4: Chọn Upload a Patch và chọn file Patch Pagkage(1.1.4->1.1.5) for Joomla!1.5

 Bước 5: Click Upload & Preview để tiến hành nâng cấp

 Bước 6: Đánh dấu chọn và click Apply Patch now để xác nhận nâng cấp

Trang 28

Vào Sản phẩm => Thêm Category điền thông tin cho Category ví dụ:

Galaxy sau đó lưu lại

Trong đó

Số thứ tự: chọn cách trình bày các sản phẩm thuộc category

Parent: chọn category cha cho category đang tạo

Show x products per row: số sản phẩm hiển thị trên một dòng

Kết quả:

Tiền bớt

E Sản phẩm

Trang 29

Thêm mới sản phẩm: Sản phẩm => Thêm

Trong phần Thông tin sản phẩm

 SKU: Mã sản phẩm

 Tên: Tên sản phẩm

 Categories: Chọn category cho sản phẩm

 Giá sản phẩm (Net): Giá xuất xưởng

 Giá sản phẩm (Gross): Giá đã trừ thuế

 VAT id: Thuế (Khi ta chọn VAT id thì giá Gross sẽ tự động cập nhật)

 Bớt tiền loại: Dùng để giảm giá sản phẩm

 Giá bớt tiền: Giá sản phẩm sau khi đã giảm giá

 Mô tả ngắn: Phần giới thiệu sơ lược về sản phẩm

Trong phần Tình trạng sản phẩm, cần

 Trong kho: Số lượng sản phẩm còn trong kho

 Minimum Purchase Quantity: Số lượng đăng ký mua tối thiểu

 Maximum Purchase Quantity: Số lượng đăng ký mua tối đa

SP đặc biệt: Nếu đánh dấu check thì sản phẩm sẽ được đưa vào Featured Products

Trong phần Ảnh Sản phẩm:

 Thumb Nail: hình thu nhỏ của sản phẩm

Trong phần Sản phẩm liên quan: Gõ tối thiểu 4 ký tự đầu của các sản phẩm

hay category thì hệ thống sẽ hiển danh sách sản phẩm để thêmvào mục sản phẩm liên quan

F Quản lý giá của sản phẩm:

Định dạng
Số trang	34
Dung lượng	2,7 MB