Việt hóa & tùy chỉnh Flatsome cho web Việt Nam

Flatsome là theme bán hàng WordPress phổ biến nhất tại Việt Nam với hơn 200.000 website đang dùng và điểm đánh giá 4.8★ trên ThemeForest. Nhưng mua theme về mới là bước đầu — muốn website chuyên nghiệp và thân thiện với khách Việt, bạn cần việt hóa, chỉnh font, đổi màu thương hiệu và tùy biến WooCommerce. Bài này hướng dẫn từng bước, thực chiến, không cần biết code.
Việt hóa theme Flatsome: 3 cách phổ biến
Việt hóa Flatsome nghĩa là dịch toàn bộ chuỗi văn bản mặc định ("Add to cart", "Checkout", "Related products"...) sang tiếng Việt. Có 3 cách, xếp theo mức độ dễ dùng và an toàn khi cập nhật theme.
Cách 1 — Loco Translate (khuyên dùng)
Loco Translate là plugin miễn phí, dịch trực tiếp trong trang quản trị mà không cần phần mềm ngoài. Các bước:
- Vào Plugins → Add New, tìm "Loco Translate", cài và kích hoạt.
- Vào Loco Translate → Themes → Flatsome.
- Bấm New language, chọn Vietnamese (vi_VN), và chọn nơi lưu là System (thư mục wp-content/languages/loco) để không mất khi cập nhật theme.
- Dịch từng chuỗi ở cột bên phải, bấm Save — Loco tự sinh file .po (bản dịch) và .mo (bản biên dịch cho máy đọc).
Ưu điểm: dễ, trực quan, bản dịch nằm ngoài theme nên an toàn. Nhược điểm: nếu dịch quá nhiều chuỗi, việc quét chuỗi có thể làm chậm nhẹ trang admin.
Cách 2 — File .po/.mo qua Poedit
Nếu quen làm việc offline, tải file flatsome.pot trong thư mục wp-content/themes/flatsome/languages, mở bằng phần mềm Poedit, dịch rồi lưu thành vi.po và vi.mo, upload ngược lại. Cách này nhanh khi cần dịch hàng loạt, nhưng phải cẩn thận đặt file đúng chỗ để không bị ghi đè khi update.
Cách 3 — Gói ngôn ngữ có sẵn
Nhiều bản Flatsome bán tại Việt Nam đã kèm sẵn file việt hóa vi_VN. Chỉ cần copy file .mo vào đúng thư mục languages là dùng được ngay. Nhanh nhất nhưng chất lượng bản dịch phụ thuộc người làm trước — nên rà lại các chuỗi quan trọng như nút thanh toán, thông báo giỏ hàng.
Chỉnh font tiếng Việt cho Flatsome hiển thị đẹp, đủ dấu
Font tiếng Việt là điểm dễ hỏng nhất khi việt hóa theme Flatsome, vì nhiều font Latin mặc định không hỗ trợ đủ dấu (bị mất mũ, thiếu dấu nặng). Giải pháp là chọn font có bộ ký tự Vietnamese.
- Vào Appearance → Customize → Typography.
- Chọn các font Google hỗ trợ tiếng Việt tốt: Be Vietnam Pro, Inter, Nunito Sans, Roboto, Open Sans.
- Đặt cỡ chữ body 16–17px, dòng cao (line-height) 1.6–1.7 để đọc thoải mái trên tiếng Việt vốn nhiều dấu.
- Nếu dùng font Việt riêng (self-hosted), thêm qua plugin hoặc CSS @font-face và trỏ font-family trong Customize.
Mẹo tốc độ: chỉ tải weight cần dùng (400, 600, 700) để tránh nặng trang. Font nhiều biến thể làm tăng thời gian tải, ảnh hưởng trải nghiệm và SEO.
Đổi màu thương hiệu và bố cục header/footer
Đổi màu thương hiệu giúp website Flatsome khác biệt và đồng bộ nhận diện, làm hoàn toàn trong Customize mà không cần sửa code. Đây là phần mang lại thay đổi thị giác lớn nhất chỉ trong vài phút.
| Hạng mục | Vị trí trong Customize | Nên chỉnh gì |
|---|---|---|
| Màu chính (Primary) | Style → General → Colors | Đặt màu nút, link, giá tiền theo brand |
| Màu phụ (Secondary) | Style → General → Colors | Màu nút phụ, nhấn mạnh |
| Header | Header → Layout / Elements | Logo, menu, thanh tìm kiếm, giỏ hàng, hotline |
| Footer | Footer | Thông tin công ty, MST, chính sách, mạng xã hội |
| Nút bấm | Style → Buttons | Bo góc, đổ bóng, kiểu chữ nút |
Với header, khách Việt quen thấy số hotline nổi bật và thanh tìm kiếm ngay đầu trang — hãy bật chúng trong Header Builder. Với footer, đừng quên thêm địa chỉ, mã số thuế và link chính sách đổi trả để tăng độ tin cậy (E-E-A-T) và đúng quy định TMĐT tại Việt Nam. Nếu bạn muốn xem cách các mẫu dựng sẵn bố trí header/footer, tham khảo bộ giao diện Flatsome & Elementor để lấy ý tưởng.
Tùy chỉnh WooCommerce cho khách hàng Việt Nam
Tùy chỉnh WooCommerce đúng thói quen mua sắm Việt sẽ tăng tỷ lệ chốt đơn rõ rệt, vì WooCommerce (nền tảng chiếm khoảng 28% thị phần TMĐT toàn cầu) vốn cấu hình mặc định theo phương Tây. Dưới đây là các điểm cần Việt hóa về mặt vận hành, không chỉ ngôn ngữ:
- Tiền tệ: WooCommerce → Settings → General, chọn đơn vị đ (VNĐ), đặt ký hiệu sau số, bỏ số thập phân (49.000đ thay vì 49,000.00₫).
- Địa chỉ: mặc định bán cho Việt Nam, ẩn các trường không cần (company, address line 2) để checkout gọn.
- Thanh toán: bật COD (thanh toán khi nhận hàng) — hình thức phổ biến nhất ở Việt Nam — và chuyển khoản ngân hàng; cân nhắc thêm cổng như VNPAY, MoMo qua plugin.
- Vận chuyển: cấu hình phí ship theo khu vực (nội thành / tỉnh), tích hợp GHTK, GHN nếu cần.
- Nút mua hàng: đổi "Add to cart" thành "Thêm vào giỏ", "Buy now" thành "Mua ngay" — làm ở bước việt hóa Loco Translate.
Flatsome đi kèm nhiều tùy chọn WooCommerce riêng trong Customize (kiểu trang sản phẩm, số cột, quick view, ảnh phóng to). Bật Quick View và Sticky Add to Cart giúp khách mua nhanh trên điện thoại — nơi phần lớn khách Việt mua sắm.
Quy trình chuẩn: làm theo thứ tự này để không phải làm lại
Thứ tự tùy chỉnh hợp lý sẽ tiết kiệm thời gian và tránh xung đột giữa các bước. Đây là quy trình gợi ý:
- Cài theme + demo phù hợp ngành (xem hướng dẫn cài đặt).
- Việt hóa bằng Loco Translate (sinh .po/.mo).
- Chỉnh font tiếng Việt trong Typography.
- Đổi màu thương hiệu, dựng header/footer.
- Cấu hình WooCommerce theo khách Việt.
- Kiểm tra trên điện thoại và tối ưu tốc độ.
Việc chọn đúng theme ngay từ đầu quyết định 70% công sức về sau. Nếu bạn đang phân vân giữa các nền tảng và cách chọn theme bán hàng phù hợp, hãy đọc bài trụ cột theme WordPress bán hàng để có cái nhìn tổng thể trước khi bắt tay tùy chỉnh. Bạn cũng có thể chọn ngay giao diện theo ngành, ví dụ thời trang & trang sức hoặc mỹ phẩm & làm đẹp, để rút ngắn thời gian dựng site.
Chọn giao diện Flatsome đã tối ưu cho khách Việt
Hơn 400 giao diện WordPress theo ngành, nhiều mẫu đã việt hóa và tối ưu WooCommerce sẵn. Nhập mã DCWEB để được giảm giá.
Xem kho giao diện →


