Phương pháp xây dựng theme theo chuẩn themeforest trên mã nguồn mở wordpress
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (2.3 MB, 100 trang )
LỜI CẢM ƠN
Sau một thời gian tìm hiểu đề tài “Phương pháp xây dựng Theme theo
chuẩn ThemeForest trên mã nguồn mở Wordpress”, em đã hoàn thành tiến độ
dự kiến. Để đạt được kết quả này, em đã nỗ lực thực hiện và đồng thời cũng nhận
được rất nhiều sự giúp đỡ, quan tâm, ủng hộ của các thầy cô bạn bè và gia đình.
Em xin chân thành cảm ơn giáo viên hướng dẫn: Th.S Lê Nam Huy – Bộ
môn Công nghệ phần mềm – Trường Đại học Công nghệ thông tin và truyền thông
– Đại học Thái Nguyên đã tận tình giúp đỡ em hoàn thành đồ án tốt nghiệp này.
Em xin chân thành cảm ơn các thầy cô và ban lãnh đạo trường Đại học
Công nghệ thông tin và truyền thông – Đại học Thái Nguyên đã nhiệt tình giảng
dạy và truyền đạt kiến thức quý báu và bổ ích trong suốt quá trình em học tập tại
trường.
Em xin chân thành cảm ơn các thầy, cô giáo viên thuộc bộ môn Công nghệ
phần mềm đã trang bị cho em những kiến thức chuyên ngành rất hữu ích để em
hoàn thành đề tài và phục vụ cho công việc của em sau này.
Vì thời gian có hạn nên không thể tránh khỏi những thiếu sót, em rất mong
nhận được sự đóng góp ý kiến từ thầy cô và các bạn.
Em xin chân thành cảm ơn!
1
LỜI CAM ĐOAN
Em xin cam đoan đây là đề tài do em tự nghiên cứu, tìm hiểu và được sự
hướng dẫn tận tình của thầy giáo Ths. Lê Nam Huy. Các nội dung nghiên cứu, kết
quả trong đề tài này là trung thực và chưa công bố dưới bất kỳ hình thức nào trước
đây. Những tài liệu phục vụ cho việc tìm hiểu lý thuyết và tham khảo demo đã
được ghi rõ trong phần tài liệu tham khảo.Nếu phát hiện có bất kỳ sự gian lận nào
em xin hoàn toàn chịu trách nhiệm trước hội đồng về nội dung đề tài của mình.
Sinh viên
Phạm Văn Huy
2
MỤC LỤC
LỜI CẢM ƠN
1
LỜI CAM ĐOAN 2
LỜI NÓI ĐẦU
5
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT
9
1.1. Giới thiệu về themeforest 9
1.1.1. Themeforest là gì ?
9
1.1.2. Ưu điểm và nhược điểm của ThemeForest so với thị trường tự do
9
1.1.3. Làm sao để được approve trên ThemeForest11
1.1.4. Tìm hiểu rõ hơn về quá trình review sản phẩm
1.2. Một số ngôn ngữ và công nghệ được sử dụng
1.2.1. Ngôn ngữ HTML
17
1.2.2. Ngôn ngữ Javascript
18
16
17
1.2.3. Ngôn ngữ PHP 21
1.2.4. Hệ quản trị CSDL MySQL
24
1.2.5. Công nghệ Responsive Boostrap
26
1.2.6. Mô hình MVC 29
1.3 Mã nguồn mở WordPress 34
1.4 Cài đặt và triển khai Wordpress 36
1.4.1 Cài đặt Xampp trên Localhost 36
1.4.2 Cài đặt wordpress trên localhost
37
CHƯƠNG 2: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG
2.1. Giới thiệu đề tài
40
2.1.1. Đặt vấn đề 40
2.1.2 Giải pháp 41
2.2. Tính cấp thiết đặt ra 41
2.3 Mục đích, yêu cầu của bài toán cần giải quyết
3
41
40
2.3.1 Mô tả bài toán
41
2.3.2 Phân tích yêu cầu bài toán
41
2.4. Phân tích và thiết kế 42
2.4.1 Các tác nhân tham gia hệ thống
2.4.2 Use case tổng quát hệ thống
42
42
2.4.3 Use case đăng nhập hệ thống 43
2.4.4 Use case quản lý bài viết
43
2.4.5 Use case quản lý giao diện
44
2.4.6 Use case quản lý phản hồi
45
2.4.7 Use case quản lý plugins
46
2.4.8 Use case quản lý setting
47
2.4.9 Use case tổng quát người đọc 48
2.4.10 Biều đồ trình tự
2.4.11 Biều đồ lớp
49
54
CHƯƠNG III. DEMO WORDPRESS TEMPLATE
3.1. Giới thiệu về theme trong Wordpress
3.2 Demo sản phẩm
58
59
3.2.1 Thiết kế 59
3.2.2 Sản phẩm60
3.3 Upload theme lên ThemeForest
65
KẾT LUẬN 66
TÀI LIỆU THAM KHẢO 67
NHẬN XÉT CỦA GIÁO VIÊN HƯỚNG DẪN 68
4
58
DANH MỤC HÌNH ẢNH
Hình 1.1: Yêu cầu tiêu chuẩn – phase 1 phát hành ngày 09/09/2013 16
Hình 1.2: Cấu trúc thư mục của bootstrap.
Hình 1.2: Ví dụ về Bootstrap
27
Hình 1.3: Ví dụ về Bootstrap.
28
Hình 1.4: Mô hình MVC
26
29
Hình 1.5: Quá trình cài đặt Wordpress
36
Hình 1.6: Quá trình cài đặt Wordpress
36
Hình 1.7: Quá trình cài đặt Wordpress
37
Hình 1.8: Quá trình cài đặt Wordpress
37
Hình 1.9: Quá trình cài đặt Wordpress
38
Hình 1.10: Giao diện Administration Control Panel của WordPress. 39
Hình 2.1 : Sơ đồ Use case tổng quát hệ thống
42
Hình 2.2 : Sơ đồ Use case quản lý bài viết
43
Hình 2.3 : Sơ đồ Use case quản lý giao diện
44
Hình 2.4 : Sơ đồ Use case quản lý phản hồi
45
Hình 2.5 : Sơ đồ Use case quản lý plugins
46
Hình 2.6 : Sơ đồ Use case quản lý setting 47
Hình 2.6 : Sơ đồ Use case người đọc
48
Hình 2.7 : Biểu đồ trình tự use case đăng nhập 49
Hình 2.8 : Biểu đồ trình tự use case quản lý bài viết
50
Hình 2.9 : Biểu đồ trình tự use case quản lý giao diện 50
Hình 2.10 : Biểu đồ trình tự use case quản lý phản hồi 51
Hình 2.11 : Biểu đồ trình tự use case quản lý plugins
51
Hình 2.12 : Biểu đồ trình tự use case quản lý settings
52
Hình 2.13 : Biểu đồ trình tự người đọc xem bài viết
52
Hình 2.14 : Biểu đồ trình tự người đọc tìm kiếm bài viết
5
53
Hình 2.15 : Biểu đồ trình tự người đọc phản hồi bài viết
Hình 2.16 : Biểu đồ trình tự người đọc liên hệ
54
Hình 2.17 : Biểu đồ lớp ca sử dụng đăng nhập
54
Hình 2.18 : Biểu đồ lớp ca sử dụng quản lý bài viết
55
Hình 2.19 : Biểu đồ lớp ca sử dụng quản lý giao diện
55
Hình 2.20 : Biểu đồ lớp ca sử dụng quản lý phản hồi
56
Hình 2.21 : Biểu đồ lớp ca sử dụng quản lý Plugins
56
Hình 2.22 : Biểu đồ lớp ca sử dụng quản lý Settings
57
Hình 3.1 : Các file có trong template
Hình 3.4 : Giao diện customize
58
61
Hình 3.5 : Giao diện trang bài viết 61
Hình 3.6 : Giao diện trang phản hồi
62
Hình 3.7 : Giao diện trang plugins 63
Hình 3.8 : Giao diện trang settings64
6
53
DANH MỤC BẢNG BIỂU
Bảng 2.1 : Đặc tả use case đăng nhập hệ thống 43
Bảng 2.2 : Đặc tả use case quản lý bài viết
44
Bảng 2.3 : Đặc tả use case quản lý giao diện
45
Bảng 2.4 : Đặc tả use case quản lý phản hồi
46
Bảng 2.5 : Đặc tả use case quản lý plugins
47
Bảng 2.6 : Đặc tả use case quản lý settings
48
Bảng 2.7 : Đặc tả use case người đọc
49
7
LỜI NÓI ĐẦU
Với sự phát triển nhảy vọt của công nghệ thông tin hiện nay, Internet ngày
càng giữ vai trò quan trọng trong các lĩnh vực khoa học kĩ thuật và đời sống. Dĩ
nhiên các bạn đã được nghe nói nhiều về Internet, nói một cách đơn giản, Internet
là một tập hợp máy tính nối kết với nhau, là một mạng máy tính toàn cầu mà bất kì
ai cũng có thể kết nối bằng máy PC của họ. Với mạng Internet, tin học thật sự tạo
nên một cuộc cách mạng trao đổi thông tin trong mọi lĩnh vực văn hóa, xã hội,
chính trị, kinh tế...
Trong thời đại ngày nay, thời đại mà “người người làm Web, nhà nhà làm
Web” thì việc có một Website để quảng bá công ty hay một Website cá nhân
không còn là điều gì xa xỉ nữa.
Với công nghệ Word Wide Web, hay còn gọi là Web sẽ giúp bạn đưa những
thông tin mong muốn của mình lên mạng Internet cho mọi người cùng xem một
cách dễ dàng với các công cụ và những ngôn ngữ lập trình khác nhau. Sự ra đời
của các ngôn ngữ lập trình cho phép chúng ta xây dựng các trang Web đáp ứng
được các yêu cầu của người sử dụng. WordPress được viết bằng ngôn ngữ lập trình
PHP và sử dụng MySQL Database(cơ sở dữ liệu database) là một mã nguồn mở dễ
sử dụng. Với lí do đó, được sự hướng dẫn và giúp đỡ của thầy Lê Nam Huy em đã
chọn đề tài “Phương pháp xây dựng Theme theo chuẩn Theme forest trên mã
nguồn mở Wordpress” làm đề tài cho đồ án tốt nghiệp của mình.
8
CHƯƠNG 1: CƠ SỞ LÝ THUYẾT
1.1. Giới thiệu về themeforest
1.1.1. Themeforest
Theme forest là một marketplace, nơi mà các tác giả (author) sẽ tự do
upload các sản phẩm của họ đến những người quan tâm, những sản phẩm đó có thể
là PSD, HTML, Template (Joomla, Wordpress, Magento, Prestashop..). Khi đó sẽ
có 1 đội ngũ làm công việc review sản phẩm để đánh giá sản phẩm của bạn có đạt
tiêu chuẩn của TF hay không. Khi đã được approve thì lợi nhuận của việc bán sản
phẩm sẽ được chia theo phần trăm, một phần của bạn và một phần của TF, việc ăn
chia này được quy định rõ trong các điều khoản của TF. Nói đơn giản, TF là trung
gian giữa người mua và người bán và những gì bạn cần làm là tạo ra những sản
phẩm chất lượng đem đến người dùng
1.1.2. Ưu điểm và nhược điểm của ThemeForest so với thị trường tự do
a. Ưu điểm
ThemeForest là thị trường số 1 thế giới về các sản phẩm liên quan đến
theme dành cho các freelancer và lượng khách hàng đông đảo nhất hiện nay. Do đó
nếu 1 sản phẩm của bạn được approve trên TF thì lập tức sẽ có một lượng khách
hàng truy cập không hề nhỏ. Nếu bạn có ý định tự làm thì bạn sẽ phải đầu tư 1
khoản tương đối cho dịch vụ quảng cáo như Adwords, Facebook ...
Uy tín, chất lượng: Việc theme của bạn được upload lên TF, vượt qua khâu
review của TF đồng nghĩa với việc đó là 1 sản phẩm chất lượng, đã được đánh giá
tốt. Giả sử bạn mới mở một trang nicethemes.com để bán theme chẳng hạn, khách
hàng vào xem sẽ ngờ vực, bán tín bán nghi vì thương hiệu của bạn mới toanh. Còn
Themeforest lại khác, đó là một nơi an toàn để khách hàng đặt tiền vào. Công
việc chỉ có thiết kế: Nếu mở một trang bán theme riêng, bạn sẽ phải xây dựng một
website, thiết kế trang chủ, demo, xây dựng module bán hàng, các cổng thanh toán,
mã sản phẩm, cơ chế kiếm tra để support, bảo mật, các khiếu nại thắc mắc, đổi
9
trả… Bạn sẽ phải có một team SEO, Marketing các kiểu nữa nếu muốn đẩy thương
hiệu đi xa. Còn với Themeforest, tất cả những gì bạn phải làm là có một thiết kế
đẹp, và bạn chỉ tập trung vào thiết kế, đẩy tất cả những cái “dirty behind”gồm
thanh toán, bảo mật, mua bán… cho Themeforest. Bạn chỉ chờ cuối tháng nhận
tiền thôi.
b. Nhược điểm
Tuân thủ luật: Nó giống như một trò chơi mạo hiểm vậy. Nếu bạn vi phạm
một số nguyên tắc của Themeforest thì bạn sẽ bị ban nick/username và bao nhiêu
công sức xây dựng xưa nay sẽ đổ xuống sông xuống bể, các themes sẽ bị xóa hết,
tiền đang có trên Themeforest sẽ bị phong tỏa, cả uy tín, thương hiệu bao lâu bạn
gây dựng cũng không còn. Đó thực sự là một cuộc mạo hiểm, nó giống như nhiều
fanpage trên Facebook nhiều năm gây dựng giờ bị facebook cho ra đảo sau một
đêm. Tuy nhiên, sẽ không có vấn đề gì nếu như bạn tuân thủ luật chơi, không làm
điều gì vi phạm tới bản quyền, ăn cắp ý tưởng, ăn cắp thiết kế…
Mất từ 30% – 50% cho mỗi sản phẩm bán được: Bạn sẽ phải chia cho
Themeforest từ 30 – 50% lợi nhuận, tùy theo vị trí của bạn. Nếu bạn đã bán được
$75,000 trên Themeforest thì bạn được hưởng 70%, còn nếu mới bắt đầu thì bạn
chỉ được hưởng 50% thôi. Ban đầu, khi mới bắt đầu bạn sẽ thấy 50% không là gì,
vì bạn chỉ cần bán được hàng, có tiền, mà nhận được $20/theme cũng làm bạn
sung sướng. Tuy nhiên, về sau bạn sẽ thấy nhận được 70%/theme vẫn còn là ít, và
bạn vẫn khó chịu, ấm ức về cái con số 30% kia lắm. Mặc dù nếu bán theme riêng
thì bạn cũng sẽ mất một khoản chi phí cho việc thuê server, trả lương nhân viên…
Không được định giá sản phẩm: Giá sản phẩm là do Themeforest quy định,
tuân theo những nguyên tắc chung của thị trường. Chẳng hạn như theme bình
thường là $40, blog đơn giản là $35, blog phức tạp là $45, portfolio có thể là $40,
$45, magazine cũng vậy. Nếu hỗ trợ WooCommerce thì là $55 hoặc $60. Bạn sẽ
vô cùng ấm ức khi thấy cũng một theme kiểu vậy, thậm chí xấu hơn, đơn giản hơn
mà bán ngoài thị trường là $55, hoặc $55 cho một cái blog. Đó là còn chưa kể
10
giá $40 đã thấp rồi lại còn bị cắt xén mất vài chục phần trăm
Quá trình review: Cái này thì không biết nên xếp hạng là ưu hay nhược
điểm. Review vừa là ưu điểm, vừa là nhược điểm. Nhược điểm là ở chỗ không
phải cái gì bạn thiết kế cũng sẽ được đưa lên để bán mà chỉ có một số thôi. Mỗi lần
muốn upload cái gì đó lên bạn sẽ bị kiểm duyệt. Ngay cả update theme cũng phải
chờ kiểm duyệt. Ưu điểm của nó là sẽ có người giúp bạn đánh giá xem design đó
đã đủ tốt chưa. Đồng thời giúp bạn tập trung vào chất lượng hơn là số lượng.
Nhận xét: Themeforest là một môi trường tuyệt vời để học tập. Xung quanh
có những sự cạnh tranh, hôm nào cũng có theme mới để học hỏi, khách hàng từ
nhiều nơi và họ chỉ quan tâm tới design. Do đó bạn sẽ tập trung vào việc học thiết
kế sao cho đẹp và nắm được nhu cầu của thị trường.
Có rất nhiều tác giả nổi tiếng họ vẫn bán theme trên Themeforest, vẫn bán
đều, bán ngon, ví dụ như ThemeFusion, Kriesi… Việc bán theme trên Themeforest
sẽ giúp bản thân tập trung vào thiết kế mạnh hơn là thiết kế nhiều. Nó còn nhanh
nổi nữa. Sau khi tạo được danh tiếng trên Themeforest, sau này muốn tách ra bán
trên thị trường tự do thì cũng có một lượng khách nào đó theo mình, tin tưởng…
1.1.3. Làm sao để được approve trên ThemeForest
Themeforest là một thị trường bán theme và templates trực tuyến lớn nhất
thế giới. Bạn có thể trở thành tác giả bán theme/template trên Themeforest để có
thêm thu nhập. Bạn có thể gửi thiết kế của mình lên Themeforest để bán và kiếm
tiền. Tuy nhiên, nhằm duy trì và đảm bảo chất lượng, Themeforest có một đội ngũ
gọi là “Reviewer”. Họ sẽ duyệt những sản phẩm bạn gửi lên trước khi được đồng ý
bán, và xác suất bạn bị gửi trả lại cũng khá cao, nhưng cũng không phải lo, nếu
bạn hiểu rõ cơ chế hoạt động của thị trường này thì bạn sẽ không còn bị reject/fail
nữa.
Khi mới bước vào Themeforest hoặc một thị trường của Envato, có thể bạn
sẽ có nhiều thắc mắc (giống như mình hồi trước):
Tại sao cái công trình 3 tháng của tôi lại bị Themeforest reject sau 3
11
phút?
Tại sao tôi có trình độ PSD 15 năm và từng làm 100 dự án mà vẫn bị
reject?
Tại sao một thiết kế nhìn cũng giống của tôi mà lại được approve còn tôi
bị reject?
Liệu có phải những tác giả đã nổi tiếng rồi thì up cái gì lên cũng được
approve?
Liệu có phải Themefores đã hết cơ hội cho những người mới?
Liệu có phải họ ghét người Việt Nam?
Thật ra thì Themeforest khá công bằng. Họ không hề ưu ái ai hay thiên vị gì
ai cả. Hoặc nếu có ưu ái thì với những tác giả đã giúp Themeforest bán cả triệu đô
tiên hàng, chúng ta cũng chẳng có gì để ghen tị với họ cả. Themeforest chẳng có
lý do gì để thiên vị ai đó. Mình sẽ trả lời mẫu vài câu hỏi cho những thắc mắc trên:
Tại sao công trình 3 tháng của tôi lại bị reject sau chỉ 3 phút? Vì nó
không phù hợp, còn không phù hợp chỗ nào thì phần dưới sẽ nói sau. Bạn đưa cái
theme 3 tháng của bạn cho một người không hiểu biết gì về công nghệ thông tin thì
cũng không có ý nghĩa gì với họ cả. Lý do là không phù hợp.
Tại sao tôi có trình độ PSD 15 năm và từng làm 100 dự án mà vẫn bị
reject? Vì có thể những cái bạn thiết kế và những cái Themeforest cần là khác
nhau. Có thể bạn chỉ thiết kế theo yêu cầu chứ không sáng tác được sản phẩm mới
(một thứ mà Themeforest yêu cầu).
Tại sao một thiết kế nhìn cũng giống của tôi mà lại được approve còn tôi
bị reject? Thật ra cũng không giống lắm đâu, chỉ là bạn chưa đủ trình độ lâu năm
trong thiết kế để nhìn ra được họ khác biệt với bạn đến mức nào thôi. Có thể nó
giống về ảnh, một vài hiệu ứng, tuy nhiên sự khác nhau giữa chuyên nghiệp với
không chuyên nghiệp đôi khi chỉ là một chút khác về viền ảnh, màu chữ, kích
thước chữ, khoảng cách chữ… Đằng sau đó là cả một sự nghiên cứu và kinh
12
nghiệm lâu năm của các designer mà bạn mới nhìn cứ tưởng là giống nhau. Đó là
còn chưa kể tới việc review là một vấn đề đầy cảm tính.
Liệu có phải những tác giả đã nổi tiếng rồi thì up cái gì lên cũng được
approve? Không.
Liệu có phải Themefores đã hết cơ hội cho những người mới? Không.
Liệu có phải họ ghét người Việt Nam? Không.
Chốt lại: Bạn cần nâng cao tay nghề design, bạn cần học hỏi, bạn cần tìm
hiểu thị trường, bạn cần hiểu về Themeforest. Không nên thắc mắc vì Themeforest
không vô lý.
Vậy tóm lại là cần những gì để Approve Theme ?
Chắc chắn rằng design của bạn thật tốt và duy nhất
Design là vấn đề quan trọng nhất vì nó ảnh hưởng trực tiếp tới người dùng,
hãy chắc chắn rằng design của bạn không giống bất kỳ một design nào trước đó
hoặc hãy tạo sự khác biệt so với đa số các design.
Chất lượng thiết kế là yếu tố được xem xét đầu tiên. Nó là “thiết kế”, nó
không liên quan tới khả năng code hay sự thành thạo PSD. Vấn đề viết code chỉ là
vấn đề thứ 3 trong review process. Thiết kế là một yếu tố thuộc về “thẩm mĩ”, nó
là xấu hay đẹp. Có thể bạn sẽ thấy “xấu” và “đẹp” là những vấn đề tương đối cảm
tính, theo kiểu: “tôi thấy đẹp còn reviewer thấy xấu” thì làm thế nào?
Thật ra không phải vậy. Trong thiết kế, có rất nhiều thứ phải nói tới mà
không thể viết hết trong bài này được. Nhưng tóm lại bạn sẽ phải học thiết kế như
việc học một cái gì đó bình thường. Đó là về cách sử dụng typography, spacing,
visual hierachy, color, contrast, layout… và nhiều vấn đề khác đối với thiết kế.
Ở Việt Nam chúng ta ít khi được học thiết kế một cách bài bản. Bạn có thể
biết về PSD, HTML, CSS, JS, PHP, WordPress, Joomla và bạn tận dụng, nhét tất
cả những cái mình hiểu biết vào trong một bản thiết kế với nhiều chức năng. Bạn
không hiểu tại sao nó bị reject, thật ra, nó gặp rất nhiều lỗi về typography, spacing,
visual hierachy… mà nếu không có kiến thức về chúng, bạn sẽ không hiểu.
13
Có nhiều thiết kế nhìn rất đơn giản, đơn giản hơn cái của bạn nhiều mà vấn
được approve. Đơn giản vì thiết kế đẹp, nó tuân thủ theo những nguyên tắc thiết kế
và nhìn bắt mắt. Và TF muốn phê duyêt các design khác nhau nhằm đem đến sự
lựa chọn khác nhau tới khách hàng thay vì các design nhìn khá là giống nhau.
Vượt qua phase này thì các bạn đã qua được 50% review rồi.
Đảm bảo chất lượng code của bạn.
Chất lượng code ảnh hưởng khá lớn tới việc review, chất lượng nghèo nàn
sẽ đem đến kết quả hard reject hoặc nhẹ hơn là soft reject. Bạn phải làm cho code
thật sạch, tối ưu và thể hiện được trình độ của người lập trình. Code clean và tối ưu
sẽ làm cho họ có đánh giá tốt về chất lượng. Comment những phần cần chú ý để
code dễ đọc dễ hiểu. Chia code thành các khối, mỗi khối thực hiện một chức năng
nào đó.
Tuân thủ đúng các tiêu chuẩn kỹ thuật của TF, ví dụ cách đặt tên hàm, biến,
nên hay không nên sử dụng các hàm, vị trí các hàm được sử dụng đặt ở đâu ?
Với công việc front-end, đảm bảo đạt “pixel perfect” so với PSD, chức
năng responsive cũng đạt mức hoàn hảo.
Validate và Test sản phẩm của bạn thật kỹ
Validate Theme cũng là một phần quan trọng của quá trình xét duyệt, và
cũng là một phần của chất lượng sản phẩm của bạn. Tiêu chuẩn ở đây không có
nghĩa chỉ vượt qua kiểm tra HTML CSS của công cụ test W3C, bạn phải test
theme với rất nhiều cách khác hoặc với các plugin để kiểm tra đầu ra và có ảnh
hưởng tới giao diện của theme hay không ?
Thử với nhiều dữ liệu post, bạn có thể thử test với WPTesst.io, trang web
này mô tả rằng có thể test dữ liệu một cách tuyệt vời với nhiều trường hợp được
kiểm tra. Thêm nữa, bạn có thể dùng plugin Monster Widget, nó sẽ giúp bạn test
13 default widget nhằm tiết kiệm thời gian test sidebar của bạn.
Cũng trong phạm vi test plugin, hãy chắc chắn test các plugin phổ biến để
đảm bảo dữ liệu hiển thị chính xác. Shortcode, plugin, nhúng video, chia sẻ mạng
14
xã hội và các koại widget khác cũng cần kiểm tra kỹ nhằm đảm bảo mang đến
những trải nghiệm tốt nhất đến ngời dùng. Hãy nhớ rằng những điều này không
được TF yêu cầu nhưng đó là các bước để thấy các lỗi nhỏ và ngăn ngừa tối đa các
lỗi trong theme.
Và bạn cũng có thể dùng plugin Theme Check để kiểm tra thêm các lỗi phát
sinh khác.
Các loại chức năng được tách riêng với theme
Bạn đang sử dụng 1 theme cho công ty của bạn nhưng sau một khoảng thời
gian bạn cảm thấy không còn thích giao diện cũ nữa và bạn quyết định bỏ hàng giờ
ra để tìm một cái mới. Bạn có thể tìm thấy một design tốt, phù hợp làm website của
công ty bạn nhưng đến thì cài đặt thì bạn có cảm giác như đang bị lừa dối, khi mà
tất cả các testiominial (nhận xét của khách hàng) biến mất, trang porfolio của công
ty thì không tìm thấy và các shortcode bạn sử dụng cho các bài viết cũ bị mất. Vậy
bạn sẽ cảm thấy như thế nào ? Đó chính xác là sự thất vọng vào một giao diện tồi,
kém chất lượng và bạn cũng không thể dùng một giao diện mãi mãi. Và các chức
năng được yêu cầu riêng rẽ, độc lập để đảm bảo rằng các chức năng đã được quản
lý bằng plugin và không ảnh hưởng tới các thông tin của website. Tóm lại là hãy
tách các function ra ngoài và biến chúng thành các plugin. Và may mắn rằng có
một giải pháp cho cả bạn và người dùng, đó là dùng TMG Plugin Activation
Library. Đây là một phần bắt buộc của theme và được TF yêu cầu cần có, plugin
này sẽ yêu cầu người dùng phải cài một số plugin để theme có thể chạy hoàn hảo
nhất. Nếu không muốn dùng plugin thì bạn có thể dùng Class của plugin này để sử
dụng các chức năng trên mà không cần phải cài đặt.
Chuẩn bị 1 trang Demo cho theme của bạn
Trang Demo quan trọng với cả khách hàng mua Theme cũng như TF và
nhóm review của TF sẽ kiểm tra trang demo của bạn trước khi theme tới khách
hàng. Demo chứng minh rằng design củ bạn là duy nhất cũng như code hợp lệ và
đầu ra của code chất lượng.
15
Có một demo tốt sẽ mang cho bạn nhiều thuận lợi cũng như đánh giá của
nhóm review sẽ tốt hơn. Nếu có ấn tượng tốt và code chất lượng thì theme có thể
được bán trên TF, bên cạnh đó người mua hàng cũng là nhóm thứ 2 nhìn thấy
demo và có thể ảnh hướng tới quyết định mua Theme của họ.
Kiểm tra vấn đề bản quyền
Đây là một vấn đề rất quan trọng, hầu như đây là nguyên nhân của các lỗi bị
soft reject bở vì nếu bạn không trả phí cho nó thì cả bạn và TF có thể bị kiện vì
xâm phạm bản quyền. Bạn phải mua bản quyền thương mại cho mỗi phần mở mổ
mà sử dụng trong theme của bạn. Nó có thể là Javascript plugin, CSS framework,
Wordpress pluin, stock photos và các đoạn code nhỏ hay mỗi phần thiết kế mà bạn
lấy từ người khác để làm theme, nói chung là mọi thứ.
Nếu bạn mua một thứ gì đó để dùng cho theme tức là bạn đang cần bản
quyền thương mại. Nếu bạn mua từ Envato marketplace thì tức là bạn đang cần
bản quyền mở rộng cho sản phẩm bạn muốn mua. Tóm lại là bạn cần giấy phép để
có thể sử dụng các thành phần khác cho dự án mà bạn muốn kiếm tiền, cụ thể ở
đây là theme.
Bạn cần nhớ kỹ rằng một sản phẩm được free to user không có nghĩa là
được sử dụng miễn phí cho các dự án thương mại. Một số tác giả có thể muốn bạn
phải hỏi ý kiến họ trước khi sử dụng vào theme của bạn và phải thêm một bản gốc
trước khi bạn sửa đổi nó. Bạn có thể đọc thêm về bản quyền GPT-3
Chuẩn bị document cho Theme
Một vấn đề khác cần để ý khi theme được review đó là chất lượng
document của theme. Thông thường, các sản phẩm tối hoặc không có document sẽ
bị từ chối. Và nếu document của bạn đủ hoặc không tốt lắm hay nội dung nghèo
nàn cũng là 1 lý do để sản phẩm của bạn bị soft reject. Hãy chắc chắn rằng bạn
chuẩn bị một bản hướng dẫn tốt. Tạo 1 doument tốt và đưa nó theme là điều cơ bản
khi gửi theme lên TF, điều này hoàn toàn không khó và hãy nhớ đừng quên điều
đó.
16
Sẵn sàng cho việc sẽ bị Rejection
Điều này có vẻ làm bạn mất tinh thần nhưng bạn cũng cần sẵn sàng khi sản
phẩm của bạn bị từ chối. Có thể bạn đang nghĩ rằng mình có 1 theme tốt với các
phần mở rộng (có bản quyền) tốt và làm demo cũng như document thực sự ấn
tượng nhưng những người ở TF review mỗi ngày và sự thật là họ sẽ cảm thấy sản
phẩm của bạn cần thiết nếu nó thực sự tốt. Có 2 loại reject là hard reject và soft
reject.
Hard reject có nghĩa là theme của bạn không thể chấp nhận bởi TF, có
thể là design xấu hoặc không tuân thủ các tiêu chuẩn của một design.
Soft reject có nghĩa là theme của bạn có thể được chấp nhận nếu bạn sửa lại
một số nội dung không phù hợp mà reviewer đưa ra (có thể là 1 phần design cần sửa
hay code có vấn đề cần chỉnh sửa ...). Việc của bạn là hoàn thành các feedback đó và
tiếp tục gửi lại TF, nếu mọi thứ tốt thì Theme của bạn sẽ được approve sớm nhất có
thể.
1.1.4. Tìm hiểu rõ hơn về quá trình review sản phẩm
17
Hình 1.1: Yêu cầu tiêu chuẩn – phase 1 phát hành ngày 09/09/2013
1.2. Một số ngôn ngữ và công nghệ được sử dụng
1.2.1. Ngôn ngữ HTML
HTML (viết tắt từ HyperText Markup Language) là một ngôn ngữ đánh dấu
18
siêu văn bản, được thiết kế ra để xây dựng các trang web.
Siêu văn bản (HyperText): Như ta đã biết, liên kết siêu văn bản là một từ
hay một câu trong trang Web dùng để chỉ đến trang Web khác. Khi nhấn chuột lên
một trong các liên kết này, trình duyệt web (như Netscape Navigator hoặc Internet
Explorer) sẽ đưa ta tức khắc đến trang Web kia mà không cần hỏi han gì. Vì những
liên kết siêu văn bản này thật sự là tính năng đặc trưng của World Wide Web, các
trang Web thường được biết như là những tài liệu siêu văn bản. Vì thế, HTML có
từ siêu văn bản trong tên của nó.
Đánh dấu (Markup): Có từ điển định nghĩa markup là các chỉ dẫn chi tiết về
kiểu dáng được ghi trên bản viết tay để xếp chữ in. Như vậy, chúng ta có thể hiểu
đó là các lệnh chi tiết về kiểu dáng được đánh vào tài liệu văn bản để đưa lên
WWW.
Nói chung, HTML tồn tại như là các tập tin văn bản chứa trên các máy tính
nối vào mạng Internet. Các file này có chứa thẻ đánh dấu và thường được truyền đi
trên mạng internet thông qua giao thức mạng HTTP. Sau đó thì phần HTML của
chúng sẽ được hiển thị thông qua một trình duyệt web, một loại phần mềm trực
quan đảm nhiệm công việc đọc văn bản của trang cho người sử dụng.
Cấu trúc của một tài liệu HTML
Các tập tin HTML luôn bắt đầu bằng thẻ <HTML>.Thẻ này không làm gì
khác ngoài nhiệm vụ báo cho trình duyệt Web biết rằng nó đang đọc một tài liệu
có chứa các mã HTML.Tương tự, dòng cuối trong tài liệu định dạng HTML luôn
luôn là thẻ </HTML>, có tác dụng thông báo sự kết thúc của văn bản HTML với
trình duyệt.
Chi tiết kế tiếp trong catalog thẻ HTML dùng để chia tài liệu thành hai
phần: đầu và thân.
Phần đầu giống như lời giới thiệu cho trang. Các trình duyệt Web dùng
phần đầu này để thu nhặt các loại thông tin khác nhau về trang. Để xác định phần
đầu, ta sử dụng thẻ <HEAD> và thẻ </HEAD> ngay sau thẻ <HTML>. Mặc dù ta
19
có thể đặt một số chi tiết bên trong phạm vi phần đầu này, nhưng phổ biến nhất là
tên trang. Nếu có ai đó xem trang này trong browser, thì tên trang sẽ xuất hiện
trong dải tên của cửa sổ browser. Để xác định tên trang, ta đặt đoạn văn bản tên đó
giữa các thẻ <TITLE> và </TITLE>.
Phần thân là nơi nhập vào các văn bản sẽ xuất hiện trên trang Web lẫn các
thẻ khác quy định dáng vẻ của trang. Để xác định phần thân, ta đặt các thẻ
<BODY> và </BODY> sau phần đầu (dưới </HEAD>).
Dưới đây là cấu trúc cơ bản của một trang web định dạng HTML:
<HTML>
<HEAD>
<TITLE> tên trang <TITLE>
Các thẻ tiêu đề khác
</HEAD>
<BODY>
Văn bản và các thẻ của trang Web
</BODY>
</HTML>
1.2.2. Ngôn ngữ Javascript
JavaScript là một ngôn ngữ lập trình kịch bản dựa trên đối tượng được phát
triển từ các ý niệm nguyên mẫu.Ngôn ngữ này được dùng rộng rãi cho các trang
web, nhưng cũng được dùng để tạo khả năng viết script sử dụng các đối tượng nằm
sẵn trong các ứng dụng. Giống Java, JavaScript có cú pháp tương tự C, nhưng nó
gần với Self hơn Java. .js là phần mở rộng thường được dùng cho tập tin mã nguồn
JavaScript.
Javascript là ngôn ngữ dưới dạng script có thể gắn với các file HTML. Nó
không được biên dịch mà được chương trình duyệt diễn dịch.Không giống Java
phải chuyển thành mã để trình duyệt biên dịch, trình duyệt đọc Javascript dưới
dạng mã nguồn. Chính vì vậy, ta có thể dễ dàng học Javascript qua các ví dụ bởi ta
20
có thể thấy cách sử dụng Javascript trên các trang web.
Javascript có khả năng đáp ứng các sự kiện như tải hay loại bỏ các
form.Khả năng này cho phép Javascript trở thành ngôn ngữ script động.
Giống với HTML và Java, Javascript được thiết kế độc lập với hệ điều
hành.Nó có thể chạy trên bất kì hệ điều hành nào có hỗ trọ Javascript. Ngoài ra,
Javascript còn giống Java ở khía cạnh an ninh là không thể đọc và viết vào file của
người dùng.
Cũng giống như C, JavaScript không có bộ xử lý xuất/nhập (input/output)
riêng.Trong khi C sử dụng thư viện xuất/nhập chuẩn, JavaScript dựa vào phần
mềm ngôn ngữ được gắn vào để thực hiện xuất/nhập.
Hiện nay, JavaScript được sử dụng rất nhiều trong việc thiết kế trang web
động và một số hiệu ứng hình ảnh thông qua DOM. Ngoài ra, JavaScript còn được
dùng để thực hiện một số tác vụ không thể thực hiện được với chỉ HTML như
kiểm tra thông tin nhập vào, tự động thay đổi hình ảnh,... Ở Việt Nam, JavaScript
còn được ứng dụng để làm bộ gõ tiếng Việt. Tuy nhiên, mỗi trình duyệt áp dụng
JavaScript khác nhau và không tuân theo chuẩn W3C DOM, do đó trong rất nhiều
trường hợp lập trình viên phải viết nhiều phiên bản của cùng một đoạn mã nguồn
để có thể hoạt động trên nhiều trình duyệt.
Đặc tính của ngôn ngữ java script:
Javascript là một ngôn ngữ có đặc tính:
Đơn giản.
Động (Dynamic).
Hướng đối tượng (Object Oriented).
Một trong những đặc tính quan trọng của ngôn ngữ javascript là khả năng
tạo và sử dụng các đối tượng (Object). Các Object này cho phép người lập trình sử
dụng để phát triển ứng dụng.
Trong javascript ,các Object được nhìn theo 2 khía cạnh:
Các Object đã tồn tại.
21
Các Object do người lập trình xây dựng.
Cách nhúng Javascript vào trong tập tin HTML
Có 2 cách để nhúng Javascript vào trong tập tin HTML
Cách 1: Viết chưong trình Javascript trực tiếp trong file HTML
<script type=”text/javascript”>
//Các lệnh Javascript
</script>
Cách 2: Sử dụng tập tin javascript bên ngoài :
Cũng giống như CSS ngoại tuyến, chúng ta cũng có thể nhúng Javascript
vào tập tin HTML bằng cách liên kết đến một tập tin bên ngoài, đây cũng là
phương thức được sử dụng nhiều nhất.
Với phương pháp này, các lệnh Javascrip sẽ được viết trong một file riêng
biệt có phần mở rộng là .js (Ví dụ ta có tập tin my.js)
Để nhúng tập tin demo.js vào tập tin HTML ta sử dụng đoạn mã sau:
type="javascript"
src="demo.js"
type="text/javascript"></script>
Một số ví dụ javascript:
JavaScript: Viết tại ngỏ ra HTML
<!DOCTYPE html>
<html>
<body>
JavaScript can write directly into the HTML
output stream:
<script>
document.write("
This is a heading
");document.write("
This is a paragraph.
");22
</script>
You can only use <strong>document.write</strong> in the HTML
output.
If you use it after the document has loaded (e.g. in a function), the whole
document will be overwritten.
</body>
</html>
Bạn có thể chỉ sử dụng document.write trong ngõ ra HTML (HTML
output). Nếu bạn sử dụng sau khi tài liệu đã được tải thì toàn bộ nội dung của tài
liệu sẽ bị ghi đè lên.
JavaScript: Dùng để bắt sự kiện người dùng
<!DOCTYPE html>
<html>
<body>
My First JavaScript
JavaScript can react to events. Like the click
of a button:
