Hướng dẫn dịch ngôn ngữ trong Plugin và Theme WordPress

Nếu bạn thiết kế website WordPress với chỉ một ngôn ngữ, bạn không cần quan tâm đến việc dịch sang các tiếng khác. Nhưng với những Pro thiết kế website chuyên nghiệp, chúng ta cần phải lập trình chuẩn cấu trúc của mã nguồn này.

1. Tại sao phải dịch ngôn ngữ trong WordPress

Trong bài này tôi sẽ nêu ta một lỗi các bạn làm website bằng WordPress hay mắc phải hoặc chưa chú nhiều đến nó. Với trang lỗi 404 của WP, mọi thông tin sẽ nằm trong template: 404.php và nội dung trang này thường thông báo với người dùng rằng đường dẫn hiện tại không tồn tại. Và thường nội dung có nó như sau:

<?php
get_header(); ?>
<section class="container">
    <div class="error-page">
        <h4 class="title">404</h4>
        <p>Rất tiếc dữ liệu bạn tìm hiện chưa có</p>															
    </div>
</section>
<?php get_footer();

Rất nhiều bạn mới học WordPress thường hay viết thẳng nội dung thông báo vào html như <p>Rất tiếc dữ liệu bạn tìm hiện chưa có</p> điều này sẽ gặp chút khó khăn khi khách hàng yêu cầu chúng ta thêm ngôn ngữ mới cho Website.

Chuẩn website wordpress phải là: <p><?php esc_html_e('Sorry, the data you are looking for is not available yet', 'Wpshare247_text_domain'); ?></p>

Nghĩa là chúng ta cần phải bao chúng bằng hàm dịch (translate) của WP, Tôi cũng khuyên bạn rằng mọi quy chuẩn các text này chúng ta nên cố gắng ghi bằng tiếng anh rồi từ đó dịch qua các ngôn ngữ khác, để tiết kiệm được thời gian dịch ngôn ngữ tiếng anh.

WordPress cũng đã hỗ trợ chúng ta rất nhiều hàm dịch ví dụ như:

<?php
echo __('this is a some message', 'Wpshare247_text_domain');
_e('this is a some message', 'Wpshare247_text_domain');
esc_html_e('this is a some message', 'Wpshare247_text_domain');
_n( '%s post', '%s posts', $count, 'Wpshare247_text_domain' );

Trong đó __() và _e() là 2 hàm hay dùng để dịch nhất trong website chúng ta. Bạn có thể tham khảo thêm tại đây: các hàm dịch trong WordPress

Bạn cũng cần chú ý Wpshare247_text_domain là text domain dùng xuyên suốt trong ví dụ của bài viết này để dịch ngôn ngữ.

2. Dịch ngôn ngữ trong theme WordPress

2.1 Sử dụng thư mục languages mặc định của WP

Trước tiên bạn hãy thêm đoạn code sau vào file functions.php của theme WP mình đang dùng nhé:

function wpshare247_theme_setup(){
    load_theme_textdomain( 'Wpshare247_text_domain' );
}
add_action( 'after_setup_theme', 'wpshare247_theme_setup' );

Bước tiếp theo bạn tìm đến thư mục wp-content\languages\themes trong source chúng ta đang dùng rồi tạo file dịch Wpshare247_text_domain-vi.po, tôi ví dụ website chúng ta có 2 ngôn ngữ (Anh – Việt) và chúng ta đang thực hiện công việc dịch cho ngôn ngữ Tiếng Việt.

Vậy chúng ta tạo Wpshare247_text_domain-vi.po bằng cách nào?

Có lẽ bạn còn rất lạ lẵm với tên file .po đúng không? Trước khi đi vào trọng tâm tôi muốn bạn biết rằng WordPress dịch từ ngôn ngữ này sang ngôn ngữ khác thông qua 2 file, đó là .po và .mo, file .po là file quản lý text để dịch, nghĩa là file này quản lý mọi chuỗi ký tự dịch, sau đó từ file này sẽ biên dịch thành file có đuôi là .mo, mo chính là file mà WordPress cần dùng đến.

Nội dung đơn giản của  file .po như sau, tôi đánh dấu nội dung này là (**) để còn dùng bên dưới nhé

# Translation of Themes - Twenty Twenty in Vietnamese
msgid ""
msgstr ""
"PO-Revision-Date: 2021-06-21 18:14+0700\n"
"MIME-Version: 1.0\n"
"Content-Type: text/plain; charset=UTF-8\n"
"Content-Transfer-Encoding: 8bit\n"
"Plural-Forms: nplurals=1; plural=0;\n"
"X-Generator: Poedit 2.0.7\n"
"Language: vi_VN\n"
"Project-Id-Version: Themes - Twenty Twenty\n"
"POT-Creation-Date: \n"
"Last-Translator: \n"
"Language-Team: \n"

# themes/mytheme/404.php:6
msgid "Sorry, the data you are looking for is not available yet"
msgstr "Rất tiếc dữ liệu bạn tìm hiện chưa có"

msgid "Read more"
msgstr "Xem thêm"

Tốt rồi, để tạo được file này cũng như biên dịch chúng thành file .mo, bạn cần dùng đến phần mềm Poedit, bạn có thể download chúng từ trang chủ nhé: https://poedit.net/

Tạo file .po bằng Poedit

Sau khi tải về và cài vào Poedit vào máy, bây giờ tiếp theo bạn hãy copy nội dung (**) rồi tạo file Wpshare247_text_domain-vi.txt tại thư mục wp-content\languages\themes.

Chú ý cấu trúc đặt tên file nhé: [textdomain] [-] [mã ISO ngôn ngữ qui ước quốc tế].txt

• textdomain là: Wpshare247_text_domain => dùng trong hàm dịch __() hoặc _e()
• vi: mã ngôn ngữ tiếng việt, tìm mã ISO các quốc gia ở đâu? Bạn có thể tra cứu tại đây https://www.loc.gov/standards/iso639-2/php/code_list.php và xem ở cột ISO 639-1 Code nhé.

Tiếp theo bạn hãy rename Wpshare247_text_domain-vi.txt thành Wpshare247_text_domain-vi.po 

Chỉnh sửa và thêm key dịch

Giờ đây bạn hãy nhấp đúp vào file .po để chỉnh sửa hoặc thêm mới key dịch nhé.

A. Sửa key dịch 

Nhấp vào dòng muốn sửa, nhìn xuống bên dưới có 2 ô Source text và Translate, bạn có thể sửa cả 2 ô đó sau mỗi lần sửa thì nhấn lưu lại

B. Thêm mới key dịch

Để thêm mới key dịch bạn cần mở file .po bằng Notepad++ hoặc Notepad thường.

Bạn hãy thêm lần lược tất cả các key cần dịch trong theme, sau đó nhấp lưu lại. Chú ý sau khi bước lưu này Poedit sẽ tự tạo cho chúng ta 1 file cùng tên với đuôi là .mo

Như vậy là bạn bây giờ bạn có thể nhìn thấy việc dịch ngôn ngữ trong WordPress rất dễ dàng, để kiểm tra việc dịch có hoạt động hay chưa, bạn chỉ cần vào Cài đặt > Tổng quan để chuyển đổi qua lại giữa các ngôn ngữ nhé.

2.1 Sử dụng thư mục tự tạo trong theme WP

Để dễ dàng quản lý ngôn ngữ trong WordPress chúng ta nên đặt thư mục languages trong theme hiện tại chúng ta thay vì để chúng trong wp-content\languages\themes như làm cách trên. Việc này đòi hỏi tùy chỉnh lại một xíu thôi không quá phức tạp.

Trước tiên chúng ta cần chỉnh sửa lại action after_setup_theme, việc này giúp chúng ta thay đổi lại đường dẫn load file .po và .mo như sau:

function wpshare247_theme_setup(){
    load_theme_textdomain( 'Wpshare247_text_domain',  get_template_directory() . '/languages' );
}
add_action( 'after_setup_theme', 'wpshare247_theme_setup' );

Tiếp theo, bạn cần thạo thư mục languages trong mytheme của chúng ta đang dùng, cụ thể như sau:

wp-content\themes\mytheme\languages => mytheme là tên thư mục theme của bạn. Rồi chép 2 file Wpshare247_text_domain-vi.po, Wpshare247_text_domain-vi.mo vào languages nhé.

Xem: Hướng dẫn cách dịch ngôn ngữ Plugin trong Theme WordPress

3. Nói thêm về file .po và .mo, .pot

Khi chỉnh sửa hoặc thêm mới key dịch bạn hãy dùng file .po, sau khi lưu lại bằng phần mềm poedit thì file .mo tự sinh ra vì vậy bạn đừng quan tâm đến file .mo.

Còn file .pot là gì?

Thỉnh thoảng bạn tìm thấy đâu đó trong theme hoặc plugin language.pot, cơ bản là bạn sẽ không quan tâm nó. Thật chất file .pot rất hữu ích, bạn hãy hình dung, sau khi bạn làm xong một website đa ngôn ngữ bằng WordPress sẽ có rất nhiều key dịch từ tiếng này sang tiếng khác. Vì sậy pot chính là file tổng hợp tất cả các key trong một theme hoặc plugin hoàn chỉnh. Chúng thường là tiếng anh ở dòng key, còn dòng dịch msgstr thường là trống.

Khi bạn cần thêm ngôn ngữ khác cho website mình bạn chỉ cần copy từ file .pot sau đó đổi lại tên .po theo ngôn ngữ sắp thêm vào, sau đó bạn cần phải dịch tất cả mọi key trong file .po mới nhé.

Hi vọng với bài viết này sẽ giúp cho bạn dễ dàng làm được các website đa ngôn ngữ nhé.