Phát triển theme WordPress tùy biến

Theme là lớp quyết định web của bạn trông như thế nào: bố cục trang, màu sắc, kiểu chữ, cách bài viết và sản phẩm hiển thị. Theme tùy biến là theme được lập trình riêng cho một dự án theo bản thiết kế của bạn, thay vì cài một bộ giao diện bán sẵn ngoài chợ rồi chỉnh trong khuôn nó cho phép.

Cần phân biệt ngay với “tùy chỉnh một theme có sẵn”. Sửa màu, đổi font, kéo vài khối trong một theme thương mại vẫn là làm việc trong giới hạn của theme đó. Theme tùy biến đi xa hơn: Web22 viết phần giao diện từ bản thiết kế, nên web hiện đúng ý bạn tới từng chi tiết và không gánh hàng trăm tùy chọn bạn không dùng. Đây là một nhánh của dịch vụ phát triển WordPress, tập trung riêng vào phần nhìn.

Không phải ai cũng cần một theme code tay từ đầu. Web22 nói thẳng ba mức để bạn không trả tiền cho thứ mình chưa cần:

• Mức 1 — Tùy chỉnh nhẹ theme có sẵn. Bạn đã có một theme ổn, chỉ cần đổi màu, font, sắp lại vài khối. Nhanh, rẻ, hợp web nhỏ. Web22 làm được nhưng thường khuyên bạn tự làm nếu chỉ tới mức này.
• Mức 2 — Child theme (theme con) trên một theme nền. Bạn cần tùy biến sâu hơn nhưng vẫn dựa trên một theme nền tốt. Mọi chỉnh sửa nằm trong theme con, nên khi theme nền cập nhật, tùy biến của bạn không bị ghi đè mất.
• Mức 3 — Theme code tay từ đầu. Bạn cần giao diện đúng nhận diện riêng, web nhẹ tối đa, không đụng hàng và mở rộng được lâu dài. Đây là mức Web22 mạnh nhất.

Buổi tư vấn đầu tiên Web22 giúp bạn xác định mình thật sự cần mức nào — chọn đúng mức tiết kiệm tiền hơn là mặc định làm mức cao nhất.

Theme chợ (mua trên ThemeForest và tương tự) hấp dẫn vì rẻ và có sẵn nhiều mẫu. Nhưng chúng được làm để bán cho hàng nghìn người với mọi ngành, nên phải nhồi thật nhiều tính năng để “ai mua cũng dùng được”. Cái giá bạn trả nằm ở chỗ không thấy ngay:

• Tốc độ: theme chợ kéo theo nhiều mã và thư viện thừa, web nặng và tải chậm. Theme viết riêng chỉ chứa đúng phần bạn dùng nên nhẹ hơn hẳn.
• Đụng hàng: một mẫu bán cho nghìn người thì web bạn dễ giống web khác. Theme riêng cho bạn nhận diện không lẫn.
• Khó bảo trì: code của theme chợ viết để tổng quát, khi cần sửa sâu thường rối và dễ vỡ. Theme riêng có cấu trúc rõ, sửa và mở rộng dễ về sau.
• Lệ thuộc bên bán: theme chợ ngừng cập nhật là bạn mắc kẹt. Theme riêng do bạn sở hữu mã nguồn.

Điều này không có nghĩa theme chợ luôn sai — với web nhỏ, ngân sách hẹp, vòng đời ngắn thì nó hợp lý. Web22 chỉ giúp bạn thấy rõ đánh đổi để chọn đúng.

Nếu bạn đã có bản thiết kế (Figma, hoặc file PSD/XD), Web22 chuyển nó thành theme WordPress chạy được, bám sát bản gốc tới từng khoảng cách và màu sắc. Đây là phần “nghề” rõ nhất của làm theme:

1. Đọc bản thiết kế và tách ra các thành phần dùng lại được: màu, kiểu chữ, nút, thẻ, khối — gom thành một hệ thống nhất quán toàn trang.
2. Dựng giao diện bằng HTML/CSS sạch và đúng ngữ nghĩa, responsive (co giãn đẹp trên điện thoại, máy tính bảng, máy tính).
3. Ghép vào WordPress: chia thành template cho từng loại trang (trang chủ, danh mục, bài viết, sản phẩm), nối với phần quản trị để bạn tự đổi nội dung.
4. Tối ưu và kiểm thử trên nhiều trình duyệt và thiết bị trước khi bàn giao.

Phần thiết kế giao diện và trải nghiệm trước khi dựng theme thuộc về dịch vụ thiết kế UI/UX — nếu bạn chưa có bản thiết kế, Web22 lo được cả khâu này.

WordPress những năm gần đây mở ra cách dựng giao diện mới gọi là block theme (theme dạng khối), đi cùng tính năng chỉnh toàn trang ngay trong trình quản trị (Full Site Editing). Với cách này, bạn sửa được cả phần đầu trang, chân trang, bố cục mà không cần đụng code — thứ mà theme kiểu cũ không cho.

Web22 dựng được cả theme kiểu cũ lẫn block theme, và tư vấn hướng nào hợp với bạn. Block theme cho bạn quyền tự chỉnh nhiều hơn; theme kiểu cũ đôi khi gọn và chắc tay hơn cho giao diện phức tạp. Đây là lựa chọn theo nhu cầu thật, không theo trào lưu.

Phần lớn việc web chậm bắt nguồn từ theme. Một theme lập trình riêng kiểm soát được những thứ ảnh hưởng trực tiếp tới điểm tốc độ Google đo (Core Web Vitals — bộ ba chỉ số trải nghiệm tải trang):

• Chỉ tải đúng mã và phông cần dùng, không kéo theo thư viện thừa.
• Ảnh xuất đúng định dạng nhẹ (WebP), khai kích thước để trang không “nhảy” khi tải.
• Cấu trúc giao diện ổn định, hạn chế hiện tượng nội dung dịch chuyển lúc tải (chỉ số CLS).

Nếu web hiện tại của bạn đang chậm vì theme nặng, đó là việc của dịch vụ tối ưu Core Web Vitals; còn làm theme mới thì tốc độ được tính ngay từ lúc dựng.

Theme trả phí bị bẻ khóa rồi phát tán miễn phí (theme nulled) là cám dỗ phổ biến vì tiết kiệm vài trăm nghìn. Web22 khuyên thật lòng: đừng. Theme nulled thường bị nhúng sẵn mã độc hoặc cửa hậu, cho kẻ gian chiếm web bạn lúc nào không hay; và vì là bản lậu nên không nhận được bản vá bảo mật. Vài trăm nghìn tiết kiệm có thể đổi bằng cả một web bị chiếm và mất uy tín với khách. Một theme viết riêng, mã sạch, không có rủi ro này.

Một nguyên tắc nghề giúp web bạn bền về sau: theme lo phần nhìn, plugin lo phần chạy. Giao diện và bố cục nằm trong theme; còn các chức năng (tính năng đặt lịch, tích hợp, loại dữ liệu riêng) nên nằm trong plugin. Lý do: khi bạn đổi giao diện sau này, các chức năng vẫn còn nguyên vì chúng không bị nhốt trong theme cũ.

Web22 luôn dựng theo ranh giới này. Phần chức năng đặc thù được tách ra — xem dịch vụ viết plugin theo yêu cầu — để bạn thay áo cho web mà không mất phần lõi bên trong.

Đây là lo lắng lớn nhất của khách có web đang hoạt động. Câu trả lời: không mất. Trong WordPress, nội dung (bài viết, trang, sản phẩm, ảnh) nằm tách khỏi theme. Đổi theme là thay lớp giao diện, còn dữ liệu giữ nguyên. Web22 dựng theme mới trên bản sao, kiểm thử kỹ rồi mới chuyển, nên web thật của bạn không gián đoạn và đường dẫn cũ vẫn giữ để không ảnh hưởng thứ hạng đã có.

Khi bàn giao, bạn nhận toàn bộ mã nguồn theme và tài liệu; bạn sở hữu hoàn toàn, một đội khác tiếp quản được. Web22 cũng bố trí phần dễ thay đổi (nội dung, ảnh, một số khối bố cục) để bạn tự chỉnh trong trang quản trị mà không cần gọi lại mỗi lần. Sản phẩm theme được bảo hành 12 tháng (chi tiết theo từng gói, xem chính sách trên web).

Giá một theme tùy biến phụ thuộc số lượng template cần dựng và độ phức tạp giao diện — một trang giới thiệu vài mục khác xa một web bán hàng nhiều loại trang. Mức làm theme nằm trong dải các gói thiết kế web của Web22; xem bảng giá tổng để hình dung, con số chính xác chốt sau khi xem bản thiết kế và phạm vi. Web22 không xuất hoá đơn VAT (chưa có pháp nhân) và sẽ nói rõ khi bạn hỏi.

Gửi Web22 bản thiết kế hoặc mô tả giao diện bạn muốn — Web22 tư vấn 30 phút miễn phí, không ràng buộc, và báo giá chính xác trong 24h. Liên hệ: [email protected] · 0981 828 781.

Tác giả

Nguyen Hien

Sáng lập Web22 — trực tiếp làm thiết kế website và phát triển WordPress từ 2018. Facebook