ĐỒ ÁN XÂY DỰNG WEBSITE BÁN HÀNG BẰNG WORDPRESS

TRƯỜNG CAO ĐẲNG CÔNG NGHỆ THÔNG TIN
HỮU NGHỊ VIỆT-HÀN
KHOA CÔNG NGHỆ THÔNG TIN
====0O0====
ĐỒ ÁN CHUYÊN ĐỀ
CHUYÊN NGÀNH: MẠNG MÁY TÍNH
ĐỀ TÀI:
XÂY DỰNG WEBSITE BÁN HÀNG
BẰNG WORDPRESS
GVHD: Th.S NINH KHÁNH CHI
SVTH: PHẠM TẤN RIN
Đà Nẵng, ngày tháng năm 2016

XÂY DỰNG WEBSITE BÁN HÀNG BẰNG WORDPRESS
MỤC LỤC
MỤC LỤC.......................................................................................................................................2
DANH MỤC TỪ VIẾT TẮT:...............................................................................................................4
DANH MỤC HÌNH ẢNH...................................................................................................................5
LỜI NÓI ĐẦU.................................................................................................................................8
Chương I: TỔNG QUAN VỀ WORDPRESS VÀ PLUGIN WOOCOMMERCE............................................9
1.1Giới thiệu chung về Wordpress..............................................................................................9
1.2Giới thiệu Woocommerce:..................................................................................................13
1.2.1 Cài đặt và thiết lập cơ bản:..................................................................................................14
1.2.2. Tìm hiểu các trang trong Woocommerce:...........................................................................20
1.3Thêm một sản phẩm đơn giản:............................................................................................23
1.3.1.Nhập thông tin sản phẩm:...................................................................................................23
1.3.2.Thiết lập danh mục sản phẩm..............................................................................................26
1.3.3. Thiết lập từ khóa sản phẩm................................................................................................26
1.3.4. Ảnh sản phẩm.....................................................................................................................27
1.3.5. Thư viện hình ảnh của sản phẩm........................................................................................27
1.3.6. Thử nghiệm chức năng giỏ hàng và thanh toán..................................................................31
1.4Cách sử dụng theme Store Front cho Woocommerce:..........................................................34
1.5Các thiết lập cài đặt các thành phần trong Woocommerce:...................................................41
1.5.1. Thiết lập thay đổi kích thước sản phẩm:.............................................................................44
1.5.2. Thiết lập thuế:.....................................................................................................................48
1.5.3. Thêm tỉnh thành Việt Nam và tối ưu thông tin khách hàng................................................52
1.5.4.Tổng quan chức năng tính phí-giao nhận(vận chuyển).........................................................53
1.5.5. Thiết lập giao nhận-tỉ lệ sàn:...............................................................................................55
1.5.6.Thêm nhiều phương thức giao nhận-tỉ lệ sàn:.....................................................................57
1.5.7.Sử dụng loại hình giao nhận (Shpping Class)........................................................................62
1.5.8.Thiết lập thanh toán.............................................................................................................66
1.5.8.1.Thanh toán qua PayPal:.................................................................................................66
PHẠM TẤN RIN-CCMM07A Page 2

1.5.8.2.Tích hợp Ngân Lượng và Bảo Kim:.................................................................................66
1.5.9. Thiết lập Email thông báo:..................................................................................................67
1.6 Sử dụng các Widget trong Woocommerce:..........................................................................68
1.7Thiết lập Yoat SEO cho WooCommerce.................................................................................69
CHƯƠNG II: DEMO CÁC CHỨC NĂNG WEBSITE.............................................................................71
KẾT LUẬN....................................................................................................................................72
TÀI LIỆU THAM KHẢO:..................................................................................................................73

DANH MỤC TỪ VIẾT TẮT:
STT Ký hiệu Ý nghĩa
1 CMS – Content Management System Hệ quản trị nội dung
2 VAT(Value Added Tax) Thuế giá trị gia tăng

DANH MỤC HÌNH ẢNH
Hình 1:Tìm plugin “Woocommerce” trên thư viện........................................................................14
Hình 2:Cài đặt bản dịch và thiết lập cho Woocommerce................................................................15
Hình 3:Cài đặt trang cần thiết cho Woocommerce........................................................................16
Hình 4: Thiết lập vị trí và định dạng tiền tệ phù hợp với Việt Nam.................................................17
Hình 5: Đã thiết lập hoàn thành...................................................................................................18
Hình 6: Cấu hình định dạng tiền mặt............................................................................................19
Hình 7:Bỏ số đơn vị thập phân ở tiền tệ.......................................................................................20
Hình 8:Các trang mặc định của Woocommerce.............................................................................21
Hình 9: Thiết lập trang cửa hàng..................................................................................................22
Hình 10: Thiết lập lại các trang bị mất...........................................................................................22
Hình: 11 Menu thêm sản phẩm....................................................................................................23
Hình 12:Nhập tiêu đề và mô tả chi tiết của sản phẩm....................................................................23
Hình 13: Khung nhập dữ liệu sản phẩm........................................................................................24
Hình 14: Nhập dữ liệu sản phẩm..................................................................................................25
Hình 15: Khung mô tả ngắn sản phẩm..........................................................................................26
Hình 16: Tạo danh mục sản phẩm.................................................................................................26
Hình 17:Thiết lập từ khóa sản phẩm.............................................................................................27
Hình 18: Ảnh đại diện sản phẩm...................................................................................................27
Hình 19: Thư viện ảnh của một sản phẩm.....................................................................................28
Hình 20: Xem trang cửa hàng.......................................................................................................28
Hình 21: Sản phẩm hiển thị ở trang Cửa hàng...............................................................................29
Hình 22: Hình mô tả chi tiết sản phẩm..........................................................................................30
Hình 23: Thêm sản phẩm vào giỏ.................................................................................................31
Hình 24: Trang giỏ hàng...............................................................................................................32
Hình 25: Trang thanh toán chưa hiệu chỉnh..................................................................................33
Hình 26: Trang thanh toán đã được hiệu chỉnh.............................................................................34
Hình 27: Import dữ liệu dummy content......................................................................................35

Hình 29: Thiết lập Import.............................................................................................................36
Hình 30: Sản phẩm mẫu sau khi đã import...................................................................................37
Hình 31: Cài đặt theme Store Front..............................................................................................37
Hình 32: Thiết lập trang chủ.........................................................................................................38
Hình 33: Thiết lập trang chủ làm trang chính.................................................................................38
Hình 34: Trang chủ Store Front.....................................................................................................39
Hình 35: Tùy chỉnh giao diện........................................................................................................40
Hình 36: Tổng quan trang thiết lập...............................................................................................41
Hình 37: Cài đặt chung.................................................................................................................41
Hình 38:Thiết lập cài đặt sản phẩm..............................................................................................42
Hình 39: Thiết lập hình sản phẩm.................................................................................................45
Hình 40:Ảnh catalog....................................................................................................................45
Hình 41: Ảnh sản phẩm đơn lẻ.....................................................................................................46
Hình 42:Hình thu nhỏ sản phẩm...................................................................................................47
Hình 43: Thay đổi thông số kích thước sản phẩm.........................................................................47
Hình 44: Hình tái tạo sản phẩm....................................................................................................48
Hình 46: Kích hoạt tính năng thuế................................................................................................48
Hình 47:Các tùy chọn thiết lập thuế.............................................................................................49
Hình 48: Khung khai báo tỉ lệ thuế................................................................................................50
Hình 49: Ví dụ thiết lập thuế VAT tại Việt Nam với tỉ lệ 10%..........................................................51
Hình 50: Kết quả thiết lập thuế....................................................................................................51
Hình 51: Thiết lập địa chỉ mặc định..............................................................................................52
Hình 52: Thông tin thanh toán đã hiệu chỉnh................................................................................53
Hình 53: Trang cài đặt tính phí giao nhận trong Woocommerce.....................................................54
Hình 54: Thiết lập giao nhận-tỉ lệ sàn...........................................................................................55
Hình 55: Tỉ lệ sàn đã được thiết lập..............................................................................................56
Hình 56: Thanh toán đã được thiết lập tỉ lệ sàn............................................................................57
Hình 57: Các phương thức giao nhận...........................................................................................59
Hình 58: Thiết lập miễn phí giao hàng..........................................................................................59

Hình 59: Thiết lập miễn phí giao hàng..........................................................................................61
Hình 60: Thiết lập loại hình giao nhận..........................................................................................62
Hình 61:Thêm một loại hình giao nhận mới..................................................................................63
Hình 62:Danh sách các loại hình giao nhận...................................................................................63
HÌnh 63: Tùy chọn loại hình giao nhận..........................................................................................64
Hình 64:Thiết lập phí vận chuyển cho loại hình giao nhận.............................................................65
Hình 65: Thiết lập PayPal.............................................................................................................66
Hình 66: Thiết lập Ngân Lượng.....................................................................................................66
Hình 67: Thiết lập Bảo Kim...........................................................................................................67
Hình 68:Các tùy chọn thiết lập email trong Woocommerce...........................................................67
Hình 69:Giao diện Wiget..............................................................................................................68
Hình 70: Xóa bỏ chữ “Archive” trên tiêu đề..................................................................................69
Hình 71: Tùy chỉnh các chuyên mục..............................................................................................70
Hình 72: Tùy chỉnh sitemap..........................................................................................................70

LỜI NÓI ĐẦU
Xã hội phát triển về nhiều mặt, kèm theo đó là sự bùng nổ mạnh mẽ của công
nghệ thông tin. Nhu cầu của con người ngày càng được nâng cao. Để đáp ứng cho nhu
cầu con người trong việc mua hàng hóa thông minh thông qua các website bán hàng.
Chúng ta chỉ cần ở bất kỳ đâu chỉ cần có kết nối Internet thì có thể mua hàng ở bất kỳ
nơi nào với các chế độ vận chuyển chuyên nghiệp trên toàn quốc. Để đáp ứng được
điều đó thì công nghệ website hiện nay có rất nhiều cách để tạo nên một website bán
hàng thông minh. Trong đó chúng ta không thể không nói đến Wordpress. Đây là một
công cụ rất phổ biến trên thế giới nói chung và Việt Nam nói riêng.Trong Wordpress
có một Plugin rất nổi tiếng được viết từ các lập trình viên thực thụ từ Wootheme đó
chính là Woocommerce. Nó được phản hồi rất tịch cực trong ngành công nghệ website
đặc biệt là website bán hàng tính đến thời điểm hiện tại. Với sự hỗ trợ đặc biệt của
Plugin Woocommerce trong việc tạo một website bán hàng. Em đã chọn đề tài “Xây
dựng website bán hàng bằng Wordpress”.
Mặc dù đã rất cố gắng nỗ lực để hoàn thành đề tài,bên cạnh đó không thể tránh
khỏi những thiếu sót. Mong rằng nhận được sự phản hồi tích cực từ phía thầy cô và
các bạn.
Xin chân thành cảm ơn!

Chương I: TỔNG QUAN VỀ WORDPRESS VÀ PLUGIN
WOOCOMMERCE
1.1 Giới thiệu chung về Wordpress.
WordPress là một phần mềm nguồn mở (Open Source Software) được viết bằng
ngôn ngữ lập trình website PHP (Hypertext Preprocessor) và sử dụng hệ quản trị cơ sở
dữ liệu MySQL. WordPress được ra mắt lần đầu tiên vào ngày 27/5/2003 bởi tác giả
Matt Mullenweg và Mike Little. Hiện nay WordPress được sở hữu và phát triển bởi
công ty Automattic có trụ sở tại San Francisco, California thuộc hợp chủng quốc Hoa
Kỳ.
WordPress là một mã nguồn mở bằng ngôn ngữ PHP để hỗ trợ tạo blog cá nhân,
và nó được rất nhiều người sử dụng ủng hộ về tính dễ sử dụng, nhiều tính năng hữu
ích. Qua thời gian, số lượng người sử dụng tăng lên, các cộng tác viên là những lập
trình viên cũng tham gia đông đảo để phát triển mã nguồn WordPress có thêm những
tính năng tuyệt vời. Và cho đến thời điểm 2015, WordPress đã được xem như là một
hệ quản trị nội dung (CMS – Content Management System) vượt trội để hỗ trợ người
dùng tạo ra nhiều thể loại website khác nhau như blog, website tin tức/tạp chí, giới
thiệu doanh nghiệp, bán hàng – thương mại điện tử, thậm chí với các loại website có
độ phức tạp cao như đặt phòng khách sạn, thuê xe, đăng dự án bất động sản,v v . Hầu
như mọi hình thức website với quy mô nhỏ và vừa đều có thể triển khai trên nền tảng
WordPress.
Nhưng như thế không có nghĩa là WordPress chỉ thích hợp với các dự án nhỏ, mà
hiện nay có tới khoảng 25% website trong danh sách 100 website lớn nhất thế giới sử
dụng mã nguồn WordPress. Ví dụ như trang tạp chí TechCrunch, Mashable, CNN,
BBC America, Variety, Sony Music, MTV News, Bata, Quartz,…rất nhiều không
thể kể hết được.
Những Thành tựu của Wordpress
Khi tìm hiểu về WordPress, bạn sẽ thật tự hào khi biết rằng mã nguồn mà các
bạn đang tìm hiểu ngay sau đây có những thành tựu rất vượt bậc và là một mã nguồn
CMS mở phổ biến nhất hành tinh. Để kiểm chứng điều đó, các bạn cần biết là:
• Trên thế giới, có khoảng 25 bài viết được đăng lên các website sử dụng
WordPress mỗi giây.
• Số lượng website làm bằng WordPress chiếm 23% tổng số lượng website trên
thế giới.

• Trong số 100% các website sử dụng mã nguồn CMS, WordPress chiếm 60%.
• Phiên bản WordPress 4.0 đạt hơn 16 triệu lượt tải chỉ sau khoảng hai tháng.
• WordPress đã được dịch sang 52 ngôn ngữ khác nhau. Tuy nhiên lại chưa có
phiên bản tiếng Việt chính thức, nhưng bạn có thể Việt hóa dễ dàng bằng cách tìm bài
trên blog với từ khóa “Việt hóa WordPress“.
• Có hơn 80 chương trình họp mặt về WordPress được tổ chức vào năm 2014.
• Mã nguồn WordPress hiện đang có khoảng 785 lập trình viên cùng hợp tác
phát triển.
• Chỉ tính các giao diện (hay còn gọi là theme) miễn phí trên thư viện
WordPress.org thì đã có hơn 2.700 themes khác nhau.
*Hoạt động của mã nguồn Wordpress:
Các dữ liệu làm việc thế nào?
Trong mã nguồn WordPress, nó đã được lập trình nhiều tính năng giúp bản thân
nó có thể tương tác với cơ sở dữ liệu (database) như MySQL để giúp người sử dụng có
thể lưu trữ dữ liệu mềm trên website. Tất cả các dữ liệu mềm được lưu trữ vào database
sẽ bao gồm các nội dung văn bản được nhập vào website, các thiết lập (vì các thiết lập
sẽ lưu dưới dạng một kiểu dữ liệu) và một số dữ liệu khác.
Nếu vào xem database thông qua phpMyAdmin hoặc các ứng dụng tương tự, sẽ
thấy WordPress có nhiều bảng dữ liệu để chứa các dữ liệu được lưu vào.
WordPress làm gì mỗi khi có người truy cập vào website?
Khi một người truy cập vào website, WordPress sẽ tự động xử lý theo quy trình
sau:

Bước 1 – Khởi động mã nguồn
Tập tin index.php trong mã nguồn (không phải của theme hay plugin) được tải ra,
sau đó nó sẽ truy xuất các tập tin cốt lõi khác như wp-config.php vốn để kết nối đến cơ
sở dữ liệu, wp-settings.php,…. Bạn có thể mở tập tin index.php lên xem và lần mò theo
các tập tin được nhúng vào sẽ biết được quy trình nó load theo thứ tự các tập tin.
Ở bước này, WordPress sẽ kết nối đến cơ sở dữ liệu được thiết lập trong wp-
config.php, sau đó sẽ tiến hành tải những tính năng trong mã nguồn như /wp-
include/functions.php, /wp-include/options.php,…nhằm nạp sẵn các chức năng cần
thiết để có thể tiếp nhận những dữ liệu.
Và cũng trong bước này, toàn bộ các dữ liệu được lưu vào bảng wp_options có
giá trị ở cột autoload là true sẽ được lôi ra hết, dù thiết lập đó có được sử dụng hay
không. Mục đích của bước này là mang sẵn các tuỳ chọn của website cùng các plugin
để hỗ trợ cho các bước sau, đặc biệt là bước tải plugin để nó làm việc chính xác. Đó là
lý do tại sao ở bài tối ưu bảng wp_options, mình có khuyên bạn nên xoá bớt các hàng
dữ liệu không dùng đến ở bảng này để giảm thời gian tải.
Bước 2 – Kích hoạt plugin
Các plugin mà bạn đang kích hoạt trong website sẽ được tải ra ngay sau khi mã
nguồn WordPress khởi động xong. Bởi vì các tính năng trong WordPress Core được sử
dụng trong plugin thường sẽ được gắn vào hookinit (bạn tạm thời hiểu nó là một điểm
neo để kích hoạt kịch bản nào đó) nên nó sẽ load ngay sau khi WordPress khởi động là
vậy.
Bước 3 – Thực thi tập tin functions.php trong theme
Lúc này, WordPress sẽ tiến hành dò tìm đến tập tin functions.php trong theme
đang được kích hoạt để tải các tính năng mà người tạo ra theme đã khai báo ở đó. Vậy
làm sao WordPress có thể hiểu được website đang dùng theme nào? Đó là ở bước 1, nó
đã kết nối vào database và dựa theo khoá current_theme trong cột option_name tại
bảng wp_options.

WordPress xác định thêm hiện tại thông qua database
Bước 4 – Phân tích truy vấn và khởi tạo truy vấn
Đây là bước quan trọng để website của bạn có thể hiển thị nội dung ra bên ngoài,
vì các nội dung sẽ được trả về sau khi các truy vấn gửi vào database. Nếu bạn muốn
biết nó phân tích như thế nào thì xem tại đây.
Truy vấn nghĩa là một mệnh lệnh được gửi vào database nhằm lấy các thông tin
mà truy vấn đó cần xem. Truy vấn ở đây là truy vấn SQL gửi vào MySQL Server.
Trước tiên, WordPress sẽ chạy hàm wp() được thiết lập trong /wp-
include/functions.php vốn để gọi phương thức $wp->main() cho mục đích thiết lập
truy vấn. Đối tượng $wp được tạo ra bởi lớp WP trong /wp-include/class-wp.php.
/**
* Set up the WordPress query.
*
* @since 2.0.0
*
* @param string|array $query_vars Default WP_Query arguments.
*/
function wp( $query_vars = '' ) {
global $wp, $wp_query, $wp_the_query;
$wp->main( $query_vars );
if ( !isset($wp_the_query) )
$wp_the_query = $wp_query;
}
Lúc này, phương thức $wp->parse_request() sẽ được khởi động cho mục đích
phân tích truy vấn dựa theo đường dẫn của website. Vì bạn biết rằng WordPress sẽ tự
động sinh truy vấn dựa theo đường dẫn, ví dụ khi chúng ta vào http://domain.com/?
p=123 thì WordPress sẽ gửi một truy vấn vào database để lấy dữ liệu của post mang số
ID là 123.
Sau khi truy vấn được phân tích, WordPress sẽ làm việc tiếp theo là thiết lập các
hàm điều kiện thông qua phương thức $wp_query->parse_query(). Sau đó nó sẽ chuyển

các truy vấn đã được tạo ra thành truy vấn bằng các lệnh SQL nhằm gửi đến MySQL để
lấy dữ liệu bài viết bằng phương thức $wp_query->get_posts(). Nếu database có dữ
liệu, các bài viết sẽ được lấy về sau khi gửi truy vấn và nó sẽ được lưu vào đối
tượng$wp_query để nó sử dụng trong các vòng lặp cho việc hiển thị bài viết.
Trong quá trình gửi truy vấn này, nếu nó không tìm thấy dữ liệu thì sẽ phân tích
và hiển thị báo lỗi 404.
Và cuối cùng là nó có dữ liệu, thì nó sẽ thiết lập biến $post để sử dụng trong
vòng lặp. Biến $post là đối tượng chứa các dữ liệu của bài viết thông qua các thuộc
tính. Phần này chúng ta sẽ đào sâu hơn ở phần tìm hiểu sâu về query và vòng lặp.
Bước 5 – Thực thi các tập tin khuôn mẫu (template) trong theme
Sau khi nó đã có dữ liệu bài viết và các dữ liệu liên quan mà nó đã làm ở bước 4,
thì nó sẽ tiến hành xử lý các tập tin template của theme thông qua cấu trúc template.
Sau đó các nội dung và trang chủ của website sẽ được hiển thị dựa theo các template
tags dưới dạng HTML.
1.2 Giới thiệu Woocommerce:
Woocommerce là một plugin miễn phí được sử dụng để tạo một trang thương
mại điện tử cỡ nhỏ tốt nhất hiện nay trong WordPress. Nó cũng như bao plugin khác là
bổ sung chức năng vào website nhưng nó sẽ bổ sung gần như toàn diện các chức năng
mà một trang bán hàng đơn giản cần có.
Woocommerce sẽ có các chức năng chính như:
• Tạo sản phẩm với định dạng thông thường, sản phẩm có thuộc tính, sản phẩm
affiliate và sản phẩm kỹ thuật số (có thể tải về).
• Hỗ trợ một số hình thức thanh toán online như PayPal, Credit Card, CoD,
Cash và sẽ càng nhiều hơn khi cài thêm plugin hỗ trợ cho riêng nó.
• Hỗ trợ tự tính thuế sản phẩm hoặc thuế theo đơn hàng.
• Hỗ trợ tự tính giá chuyển phát, có rất nhiều loại tính giá chuyển phát và sẽ đa
dạng hơn khi cài thêm plugin như có thể tính giá chuyển phát dựa theo cân
nặng, kích thước, tỉnh thành,…
• Trang quản lý đơn hàng chuyên nghiệp, lọc đơn hàng thông qua từng trạng
thái.
• Hỗ trợ template hiển thị riêng để có thể tự cấu hình lại template hiển thị phần
shop và sản phẩm, cái này rất có lợi cho lập trình viên.

• Có sẵn nhiều theme và extension (plugin mở rộng) để biến thành trang shop
chuyên nghiệp.
• Và hàng tá các chức năng hay ho khác nữa.
Như vậy với các tính năng kể trên, Woocommerce có thể lựa chọn cho những ai cần
làm một trang shop đơn giản ngay trên website WordPress của mình để giới thiệu sản
phẩm và cho phép khách đặt hàng trực tuyến để bán hàng tiện lợi hơn.
1.2.1 Cài đặt và thiết lập cơ bản:
-Trước tiên bạn tìm plugin tên Woocommerce trong Dashboard và cài plugin tên
WooCommerce – excelling eCommerce rồi cài nó.
Hình 1:Tìm plugin “Woocommerce” trên thư viện

Sau khi cài đặt thì kích hoạt như bình thường. Sau khi kích hoạt nó sẽ chuyển
thẳng bạn đến trang thiết lập ban đầu cho Woocommerce. Hãy ấn vào nút Cài đặt bản
dịch để nó cài bộ ngôn ngữ phù hợp cho website, ví dụ bạn đang dùng WordPress
tiếng Việt thì nó sẽ cài bản dịch tiếng Việt cho Woocommerce. Sau đó ấn nút Bắt đầu.
Hình 2:Cài đặt bản dịch và thiết lập cho Woocommerce

Kế đến là bước cài đặt trang cần thiết cho Woocommerce, ở đây nó sẽ cài một số
trang bắt buộc như Cửa hàng, Giỏ hàng, Thanh toán,…vì nếu không có các trang này
thì sẽ không hoàn thiện được. Do vậy ta sẽ ấn nútTiếp tục.
Hình 3:Cài đặt trang cần thiết cho Woocommerce

Kế tiếp là cài đặt vị trí cửa hàng, ở đây bạn sẽ cài đặt quốc gia của cửa hàng bạn,
loại tiền tệ, định dạng tiền tệ. Nếu bạn thiết lập cho cửa hàng tại Việt Nam thì nên thiết
lập như ảnh dưới.
Hình 4: Thiết lập vị trí và định dạng tiền tệ phù hợp với Việt Nam.

Ở bước cài đặt vận chuyển và thuế bạn cứ ấn Tiếp tục mà không cần chọn gì nhé,
cái này chúng ta sẽ thiết lập kỹ hơn ở mục riêng của nó. Sau khi thiết lập xong thì quay
lại trang quản trị.
Hình 5: Đã thiết lập hoàn thành

Ngoài ra chúng ta còn một bước cuối nữa là chỉnh lại định dạng tiền tệ một chút
nữa để cho nó phù hợp nhất với định dạng tiền tệ Việt Nam, đó là xóa 2 số 0 ở cuối đi.
Bạn hãy vào Woocommerce -> Cài đặt.
Hình 6: Cấu hình định dạng tiền mặt

Sau đó ở tab Chung, bạn sửa thành 0 ở phần Số đơn vị thập phân.
Hình 7:Bỏ số đơn vị thập phân ở tiền tệ
Okay, bây giờ giá tiền của sản phẩm sẽ hiển thị chính xác là 150.000 nếu chúng
ta nhập giá là 150000.
1.2.2. Tìm hiểu các trang trong Woocommerce:
Mặc định sau khi cài xong Woocommerce, bạn vào phần quản lý trang (Pages) sẽ
thấy có một số trang mặc định mà Woocommerce tự tạo ra để có thể sử dụng các chức
năng cần thiết trên trang bán hàng.

Hình 8:Các trang mặc định của Woocommerce
Ở đây bao gồm:
• Cửa hàng: Trang này sẽ hiển thị các sản phẩm mới nhất trên website và có
phân trang.
• Giỏ hàng: Trang này sẽ là trang giỏ hàng của bạn khi thêm hàng vào giỏ, nó sẽ
hiển thị các sản phẩm có trong giỏ hàng.
• Tài khoản của tôi: Đây là trang quản lý tài khoản của khách hàng nếu họ đăng
nhập vào website.
• Thanh toán: Trang thanh toán đơn hàng, hay còn gọi là trang Checkout.
Còn cái Trang mẫu là cái Sample page khi cài WordPress, không có gì cả.
Trong đó, trang Cửa hàng sẽ được thiết lập ở Woocommerce -> Cài đặt -> Sản
phẩm -> Hiển thị.

Hình 9: Thiết lập trang cửa hàng
Các trang còn lại tuy không thiết lập ở đây nhưng để nó hoạt động thì nội dung
phải cần có các shortcode tương ứng như sau:
• Giỏ hàng: [woocommerce_cart]
• Tài khoản của tôi: [woocommerce_my_account]
• Thanh toán: [woocommerce_checkout]
Dĩ nhiên là những shortcode đó đều có trong các trang mặc định mà
Woocommerce tạo ra rồi.
Lỡ xóa các trang của Woocommerce, làm sao để tạo lại?
Khi một hoặc tất cả trang có sẵn trong Woocommerce bị mất do bạn lỡ xóa đi
hoặc vì lý do nào đó, bạn có thể tạo lại bằng cách vào Woocommerce -> Tình trạng hệ
thống -> Công cụ -> và ấn vào nút Cài đặt trang.
Hình 10: Thiết lập lại các trang bị mất

1.3 Thêm một sản phẩm đơn giản:
1.3.1.Nhập thông tin sản phẩm:
Để thêm một sản phẩm, bạn vào Sản phẩm -> Thêm sản phẩm.
Hình: 11 Menu thêm sản phẩm
Tại đây nó sẽ giống như trang thêm bài viết, nhưng nó sẽ có nhiều chức năng
riêng để thêm một sản phẩm.
Phần tiêu đề và nội dung chúng ta sẽ nhập nó như tiêu đề sản phẩm và nội dung
mô tả chi tiết của sản phẩm.
Hình 12:Nhập tiêu đề và mô tả chi tiết của sản phẩm

Ngay bên dưới nó là phần Dữ liệu sản phẩm, ở đây bạn hãy chọn là Sản phẩm
đơn giản. Ở bên dưới khung đó là các phần bạn nhập thông tin sản phẩm như giá cả,
mã sản phẩm, quản lý kho hàng,….
Hình 13: Khung nhập dữ liệu sản phẩm
• Chung: Phần này sẽ nhập thông tin về mã sản phẩm và giá sản phẩm.
o Mã sản phẩm: Nhập mã sản phẩm để bạn tiện quản lý trong kho hàng.
o Giá bán chuẩn: Giá chuẩn của sản phẩm.
o Giá khuyến mãi: Giá sản phẩm sau khi được giảm, bạn có thể lên lịch để giá
khuyến mãi có hiệu lực trong thời gian nhất định.
• Kiểm kê kho hàng: Phần này sẽ thiết lập số lượng sản phẩm trong kho và tình trạng
hàng hóa trong kho.
o Quản lý kho hàng: Bạn muốn thiết lập số lượng hàng trong kho thì đánh dấu vào.
o Tình trạng kho hàng: Tình trạng của sản phẩm này là còn hàng hay hết hàng.
Nếu bạn bật tính năng kiểm kê kho hàng thì khi khách mua hết số lượng đã thiết
lập thì nó đưa về tình trạng hết hàng.
o Bán riêng: Đánh dấu nếu bạn muốn khách chỉ được mua với số lượng 1 cái của
mặt hàng này trong một đơn hàng.
• Giao nhận: Thiết lập trọng lượng, kích thước của sản phẩm và loại hình giao hàng.
o Trọng lượng: Nhập số trọng lượng của sản phẩm, đơn vị sẽ được thiết lập ở
Woocommerce -> Cài đặt.
o Kích thước: Nhập chiều dài, chiều rộng và chiều cao của sản phẩm, đơn vị sẽ
được thiết lập ở Woocommerce -> Cài đặt.

o Loại hình giao nhận hàng: Chọn loại hình giao nhận hàng, cái này mình sẽ nói
kỹ hơn ở bài khác.
• Các sản phẩm được kết nối: Kết nối các sản phẩm lại với nhau để người mua có thể
dễ dàng tìm ra các sản đó và gợi ý khách hàng mua kèm thêm.
o Bán thêm: Gợi ý khách hàng mua sản phẩm thay cho sản phẩm hiện tại mà họ
đang xem. Ví dụ sau này bạn có một sản phẩm tốt hơn sản phẩm này thì có thể
thêm nó vào phần này.
o Bán chéo: Gợi ý khách hàng mua thêm trong lúc xem giỏ hàng, ví dụ bạn bán
iPhone 6S thì nên thêm các sản phẩm như sạc, vỏ điện thoại vào phần bán chéo
để họ mua kèm thêm.
o Nhóm: Chọn nhóm sản phẩm cần đưa vào. Nhóm sản phẩm nghĩa là họ mua theo
một nhóm chứ không mua riêng lẻ, cái này mình sẽ nói riêng ở phần khác.
• Các thuộc tính: Thiết lập thuộc tính sản phẩm như màu sắc, kích thước,…nhưng
mình sẽ nói kỹ hơn ở phần khác.
• Nâng cao: Một số thiết lập thêm cho sản phẩm.
o Ghi chú thanh toán: Ghi chú mà bạn muốn gửi đến khách hàng sau khi mua
hàng.
o Menu đơn hàng: Số thứ tự ưu tiên của sản phẩm trong giỏ hàng, số càng nhỏ thì
càng ưu tiên.
o Cho phép đánh giá: Đánh dấu nếu muốn cho khách hàng đánh giá sản phẩm.
Hình 14: Nhập dữ liệu sản phẩm
Tiếp tục kéo xuống dưới, chúng ta sẽ thấy phần mô tả ngắn của sản phẩm. Phần
này để bạn nhập mô tả ngắn, ví dụ như một lời giới thiệu ngắn về sản phẩm vì nó sẽ
hiển thị ngay bên dưới giá sản phẩm trong trang chi tiết của sản phẩm.

Hình 15: Khung mô tả ngắn sản phẩm
1.3.2.Thiết lập danh mục sản phẩm.
Tiếp tục nhìn qua bên tay phải của trang thêm sản phẩm sẽ thấy phần thiết lập
danh mục sản phẩm, nhìn chung nó giống hệt chức năng Category (Chuyên mục) trong
bài viết thôi. Nếu chưa có bạn có thể thêm mới một danh mục và chọn nó.
Hình 16: Tạo danh mục sản phẩm
1.3.3. Thiết lập từ khóa sản phẩm
Từ khóa sản phẩm là các từ khóa mà bạn cho là có liên quan đến sản phẩm. Ví dụ
mình đặt danh mục là Áo thun thì nên chọn từ khóa các kiểu như áo lacoste, áo cá sấu,
áo pike chẳng hạn.

Hình 17:Thiết lập từ khóa sản phẩm
1.3.4. Ảnh sản phẩm
Mỗi sản phẩm nên có một ảnh sản phẩm, hay còn gọi là ảnh đại diện cho sản
phẩm.
Hình 18: Ảnh đại diện sản phẩm
1.3.5. Thư viện hình ảnh của sản phẩm
Ngay bên dưới phần ảnh sản phẩm là phần thư viện hình ảnh sản phẩm, nói chính
xác hơn thì đây là danh sách nhiều hình ảnh mà bạn muốn nó hiển thị theo dưới dạng
slide (trình diễn ảnh) trong trang sản phẩm. Bạn nên chọn một số tấm ảnh khác của sản
phẩm này ở đây, khi chọn ảnh bạn hãy ấn Ctrl để chọn nhiều ảnh.

Hình 19: Thư viện ảnh của một sản phẩm
Xong rồi, , bây giờ hãy ấn nút đăng bài viết . Sau đó vào lại trang Cửa hàng của
bạn.
Hình 20: Xem trang cửa hàng

Và bạn đã thấy sản phẩm mình vừa đăng lên nó thế này.
Hình 21: Sản phẩm hiển thị ở trang Cửa hàng.

Và khi click vào trang chi tiết một sản phẩm nó sẽ hiển thị thế này.
Hình 22: Hình mô tả chi tiết sản phẩm

1.3.6. Thử nghiệm chức năng giỏ hàng và thanh toán
Bây giờ hãy thử thêm sản phẩm của bạn vào giỏ đi. Lúc này bạn sẽ thấy nó để
một thông báo là đã thêm sản phẩm vào giỏ hàng.
Hình 23: Thêm sản phẩm vào giỏ

Và khi bạn click vào giỏ hàng thì nó sẽ hiển thị thế này.
Hình 24: Trang giỏ hàng
Tiếp theo ấn nút thanh toán.Ban đầu chưa chỉnh sửa Code nó sẽ hiển thị như thế
này và có thêm các phần không phù hợp đối với Việt Nam.Ví dụ Bang/hạt,Postcode

Hình 25: Trang thanh toán chưa hiệu chỉnh

Sau khi được chỉnh sửa Code sẽ được hiển thị như sau:
Hình 26: Trang thanh toán đã được hiệu chỉnh
1.4 Cách sử dụng theme Store Front cho Woocommerce:
Khi sử dụng Woocommerce thì chắc chắn không phải theme nào cũng có thể hỗ
trợ hiển thị gian hàng của mình tốt nhất. Lý do là vì mỗi theme đều có cách thiết kế
khác nhau, nên có thể nhiều theme mà đặc biệt là theme miễn phí sẽ không hỗ trợ hiển
thị tốt trong Woocommerce.
Và khi chấp nhận sử dụng Woocommerce, nếu bạn muốn gian hàng của mình
đẹp thì chắc chắn sẽ cần phải mua một số theme trả phí dành riêng cho Woocommerce
tại WooThemes hoặc ThemeForest (phong phú hơn) nhưng bạn chỉ nên sử dụng theme
trả phí cho Woocommerce khi bạn đã thật sự biết cách sử dụng nó.
Tải bản FULL (file word 73 trang): bit.ly/2Ywib4t
Dự phòng: fb.com/KhoTaiLieuAZ

* Các tính năng của theme Store Front:
• Hoàn toàn miễn phí và mã nguồn mở.
• Tương thích tốt với các plugin hỗ trợ thiết kế như Origin Page Builder hoặc
Visual Composer để tự thiết kế bố cục cho mỗi trang.
• Hỗ trợ cấu trúc HTML5 và Schema chuẩn SEO.
• Khu vực tùy chỉnh Customize đầy đủ.
• Dễ sử dụng.
• Hỗ trợ Responsive.
• Có hỗ trợ phần mở rộng Storefront Designer để hỗ trợ tùy biến chuyên nghiệp
hơn.
• Code thân thiện với lập trình viên.
• Hỗ trợ nhiều child theme (trả phí).
Thêm dữ liệu mẫu (Dummy content) cho Woocommerce.
Dữ liệu mẫu của Woocommerce là một gói dữ liệu đã tạo sẵn một số sản phẩm
để chúng ta có thể dễ dàng thử nghiệm các chức năng hoặc theme. Mục đích mình kêu
các bạn thêm dữ liệu mẫu này vào là để chúng ta có thể thấy theme hiển thị đầy đủ thế
nào.
Đầu tiên bạn tải plugin Woocommerce về máy tính và giải nén ra. Khi giải nén
ra, bạn vào thư mục/woocommerce/dummy-data/ sẽ thấy các tập tin dữ liệu mẫu.
Nhưng ở đây chúng ta chỉ sử dụng tập tin dummy-data.xml.
Cuối cùng là bạn truy cập vào website -> Công cụ -> Nhập vào -> WordPress
(cài plugin WordPress Importer nếu bạn chưa cài) và upload tập tin dummy-data.xml
lên.
Hình 27: Import dữ liệu dummy content
Tải bản FULL (file word 73 trang): bit.ly/2Ywib4t
Dự phòng: fb.com/KhoTaiLieuAZ

Đưa các sản phẩm về user của bạn và đánh dấu vào Download and import file
attachments rồi Submit.
Hình 29: Thiết lập Import
Nếu mạng của bạn hơi chậm và bị timeout, hãy mở tập tin php.ini trong localhost
và tìm dòng
01 max_execution_time
Sau đó tăng giá trị nó lên khoảng 200 là đẹp.
01 max_execution_time = 200
Thông báo sau khi nhập dữ liệu mẫu thành công.
4288905

ĐỒ ÁN XÂY DỰNG WEBSITE BÁN HÀNG BẰNG WORDPRESS

More Related Content

What's hot (20)

Similar to ĐỒ ÁN XÂY DỰNG WEBSITE BÁN HÀNG BẰNG WORDPRESS (20)

More from nataliej4 (20)

Recently uploaded (20)

ĐỒ ÁN XÂY DỰNG WEBSITE BÁN HÀNG BẰNG WORDPRESS