Upload
tien-nguyen
View
101
Download
2
Embed Size (px)
Citation preview
APOLLOTHEME
Copyright © 2015 Apollotheme . All Rights Reserved.
Website: http://apollotheme.com/Gmail : [email protected]
NỘI DUNG
I. Giới thiệu ApollothemeII. Giới thiệu framework của ApollothemeII. Kinh nghiệm làm theme với Liquid
4. CHƯƠNG TRÌNH APOLLO
• Website: http://apollotheme.com/• Gmail: [email protected]• Phone : 09 77932264
II. FRAMEWORK APOLLOTHEME
Những module chính sử dụng liquid1. Slideshow2. Megamenu3. Block product list4. Block product tabs
1. SLIDESHOW
• Tạo config cho slideshow: Config chung, config cho từng slides (Upload hình ảnh, chèn văn vản, link, …)
• Sử dụng Liquid để lấy các biến, nội dung từ config
II. KINH NGHIỆM LÀM THEMEQuy trình làm theme- Có một theme cơ bản có đầy đủ chức năng làm themebase
- Sử dụng framework boostrap, html5, css3, …- Phân tích file PSD nhận được trước khi bắt đầu làm- Xác định các màu, khoảng cách chính (Màu chính, màu phụ, màu văn bản,
…)- Tạo các config cho các block của theme- Sắp xếp các block theo design- Css từng thành phần (Css các khối chung, khối riêng, các phần tử, …)
Header- Topbar: Danh sách liên kết
- Header main: Logo, block service, block search, block cart
Megamenu
Slideshow- Gồm 2 banner bên phải
Danh sách sản phẩm- Danh sách sản phẩm gồm 2 hàng và 4 cột
- Sử dụng bootstrap carousel
DANH SÁCH LIÊN KẾT- Sử dụng trên topbar, footer, …
- Sử dụng menu để khách hàng có thể tùy biến dễ dàng
DANH SÁCH LIÊN KẾT- Tạo config cho mỗi block (setting_schema.json)
- Thiết lập giao diện cho block
- Lấy biến từ config. Sử dụng Liquid để in các liên kết
II. KINH NGHIỆM LÀM THEME
- Sau khi hoàn thành cần kiểm tra lại theme- Test lại website trên các trình duyệt, thiết bị.- Kiểm tra các config có trong theme.- Validate html.- Kiểm tra tốc độ load site.
III. ƯU ĐIỂM CỦA HỆ THỐNG
- Tiện lợi cho người sử dụng theme- Có thể chỉnh sửa, thay đổi tạo một phong cách hoàn toàn
riêng biệt dựa trên theme mẫu- Dễ dàng để thiết lập một website thương mại điện tử- Sử dụng theme cho desktop và mobile riêng biệt
IV. HẠN CHẾ
- Chưa sử dụng sass như Shopify- Không có danh mục con- Chưa có tìm kiếm sản phẩm nâng cao
(Theo giá, theo đặc tính, …)- Chưa hỗ trợ multilanguage