www.dvms.vn

TÀI LIỆU HƯỚNG DẪN CÀI ĐẶT VÀ TẠO

TEMPLATE MAGENTO

Tài liệu kỹ thuật

06/2012

www.dvms.vn

Lịch sử chỉnh sửa

Ngày tháng Version Mô tả Người viết

12/06/2012 1.7 DVMS

Mục lục

1. Giới thiệu các thư mục trong magento ........................................................................ 3

2. Cài đặt giao diện có sẵn: ................................................................................................ 3

3. Tạo giao diện mới: ......................................................................................................... 5

3.1. Đây là cấu trúc thư mục chứa các file template của chúng ta. ............................................................ 5

3.2. Cấu trúc thư mục chứa các file css, js và images để định dạng cho website của bạn. ........................... 5

3.3. Bây giờ chúng ta tiến hành tạo một template mới cho website magento. ............................................. 5

THÔNG TIN LIÊN HỆ HỖ TRỢ......................................... Error! Bookmark not defined.

www.dvms.vn

1. Giới thiệu các thư mục trong magento

APP: Thư mục chứa tất cả các file liên quan tới các module, template, các file run hệ

thống

Downloader: Thư mục lưu trữ tất cả các module được download về bằng magentoconnect (

Install module online)

Errors: Thư mục chứa file liên quan tới các thông báo lỗi.

Includes: Chèn các file mở rộng khác.

JS: Chứa tất cả các file js của hệ thống

LIB: Chứa các file hệ thống, zend

Media: chứa các file hình ảnh của website.

pkginfor: Thông tin gói sản phẩm

SHELL: các file liên quan tới reindex

skin: chức các file css, javascript, image cho template

VAR: chứa các file liên quan tới cache, export

2. Cài đặt giao diện có sẵn:

- Việc cài đặt template cho magento không đơn giản và nhanh chóng như các mã nguồn khác, nó sẽ

tốn khá nhiều thời gian. Tuy nhiên cũng có cách cài đặt rất nhanh chóng.

Bước 1: Bạn download một template free về hoặc có thể mua một template nào đó cho magento.

Hay template mà bạn tự thiết kế. Trong gói template thường có hai mục chính: app và skin.

Bước 2: Bạn tiến hành copy.

Thứ nhất : Nếu bạn muốn giữ lại template cũ phòng khi muốn dùng lại thì bạn làm như sau:

Mở thư mục vừa download về: tên thư mục vừa giải nén app/design/frontend/default , bạn tiến

hành copy thư mục trong này (VD: your_theme) sang thư mục chứa template trong website của

bạn: thư mục gốc chứa web app/design/frontend/default. Bạn phải chú ý your_theme nha. Và

tên thư mục vừa giải nén skin/frontend/default bạn copy thư mục your_theme sang đường dẫn

sau : thư mục gốc chứa web skin/frontend/default

Tiếp theo bạn login vào admin -> System -> Configuration -> Design

www.dvms.vn

Bạn điền vào ô như vậy sau đó nhấn Save Config để lưu lại. Và mở website của bạn để kiểm tra kết

quả.

Thứ hai : nếu bạn không muốn xài template cũ nữa thì tiến hành làm như sau:

www.dvms.vn

Copy thư app và skin trong template vừa tải về sang thư mục gốc chứa web của bạn paste vào đó và

sau đó vào admin cấu hình lại giống như phần trên là OK.

3. Tạo giao diện mới:

3.1. Đây là cấu trúc thư mục chứa các file template của chúng ta:

app/

design/

frontend/

default/

your_temp/

Đây là cấp thư mục lớn chứa toàn bộ template của bạn. Trong your_temp (tên template của bạn)

sẽ còn chứa nhiều thư mục con khác nữa.

your_temp/

layout/(trong đây sẽ chứa các file .xml cấu hình cho việc hiển thị lên trang web).

template/(trong đây sẽ có nhiều thư mục dùng để hiển thị thông tin cần thiết lên website).

3.2. Cấu trúc thư mục chứa các file css, js và images để định dạng cho website của bạn:

skin/

frontend/

default/

your_temp/

js/

css/

images/

favicon.ico

3.3. Bây giờ chúng ta tiến hành tạo một template mới cho website magento:

- Bạn có thể copy toàn bộ các thư mục trong thư mục template của một template khác và tiến hành

chính sửa cho phù hợp với giao diện của bạn.

- Đến đây bạn login vào admin để thay đổi template cũ thành tên template mới của bạn sau đó chạy

thử thử website của bạn.

- Trong thư mục page bạn sẽ thấy có một thư mục con tên html , trong thư mục này chứa các file

footer.phtml, header.phtml,....bạn chỉnh sửa các file này cho phù hợp với

yêu cầu template của bạn.

- Còn nếu muốn chỉnh sửa các cột bên trái và bên phải bạn mở thư mục callouts trong thư mục

template và chỉnh sửa hoặc viết mới các file trong đây.

www.dvms.vn

Bạn có thể xem thêm video sau:

http://www.youtube.com/watch?v=gm551N0_Kv4&feature=player_embedded

Document: Magento Design Guide

CHÚC THÀNH CÔNG!

1. THÔNG TIN LIÊN HỆ HỖ TRỢ

DVMS

(08) 360 289 37 info@dvms.vn

www.DVMS.vn