Товары WooCommerce — это произвольные типы записей WordPress («posts») с произвольными полями. Они упорядочиваются с помощью произвольных таксономий «категории товаров» и «метки товаров». Здесь мы покажем, как работают мультиязычные сайты WooCommerce и что нужно Вашим темам оформления WooCommerce, чтобы они стали Multilingual Ready (готовыми к мультиязычности).
Как работают мультиязычные сайты WooCommerce
Когда на сайте используется WPML, каждому элементу контента назначается язык. Это означает, что у каждого товара, категории и метки будет языковой атрибут. Переводы сохраняются в базе данных как отдельные товары, связанные между собой с помощью языковой таблицы WPML. Переведенные товары используют одни и те же изображения и имеют отдельные поля с текстами на нужном языке.
Администраторы сайта могут удобно выполнять перевод с помощью таблицы перевода товаров WPML. Таким образом, они могут сосредоточиться на переводе нужных текстов, не беспокоясь о том, как переводы хранятся в базе данных.
Поскольку переводы разделены в базе данных, отображать мультиязычные сайты WooCommerce также легко. На самом деле, если Вы используете API WordPress и WooCommerce, Ваша тема оформления уже может быть Multilingual Ready. После небольшого тестирования и, возможно, незначительных правок Вы сможете добиться полной совместимости с мультиязычностью и выйти на новые рынки.
Обязательные плагины для мультиязычных сайтов WooCommerce
Для работы мультиязычных сайтов WooCommerce необходимы следующие плагины:
- WooCommerce
- Базовый плагин WPML, а также дополнения WPML Перевод строк и WPML Перевод медиафайлов
- WPML Multilingual & Multicurrency for WooCommerce
WPML и все связанные с ним плагины, включая WPML Multilingual & Multicurrency for WooCommerce, входят в тип учетной записи Multilingual CMS.
Жестко закодированные тексты в шаблонах
В файлах Ваших шаблонов отображается сочетание информации о товаре и жестко закодированных текстов. Например, большинство шаблонов включает название товара и ссылку «Купить». Название товара берется из базы данных, поэтому Вам не нужно беспокоиться о его переводе.
Вам следует убедиться, что все жестко закодированные тексты можно перевести с помощью GetText.
Правильно
<p><?php _e('Similar products:', 'my-textdomain') ?></p><input type="button" name="buy-button" value="<?php esc_attr_e('Buy now!', 'my-textdomain') ?>" />В приведенном ниже примере строки «Similar products» и «Buy now!» не обернуты в вызовы GetText.
Неправильно
<p><?php echo 'Similar products:'; ?></p>
<input type="button" name="buy-button" value="Buy now!" />Правильно
<p><?php _e('Similar products:', 'my-textdomain') ?></p><input type="button" name="buy-button" value="<?php esc_attr_e('Buy now!', 'my-textdomain') ?>" />Неправильно
<p><?php echo 'Similar products:'; ?></p><input type="button" name="buy-button" value="Buy now!" />Строки «Similar products» и «Buy now!» не обернуты в вызовы GetText.
| Правильно | Неправильно |
|---|---|
<p><?php _e('Similar products:', 'my-textdomain') ?></p><input type="button" name="buy-button" value="<?php esc_attr_e('Buy now!', 'my-textdomain') ?>" /> | <p><?php echo 'Similar products:'; ?></p><input type="button" name="buy-button" value="Buy now!" />Строки «Similar products» и «Buy now!» не обернуты в вызовы GetText. |
Убедитесь, что Вы используете текстовый домен (textdomain) Вашей темы оформления для всех вызовов GetText.
Жестко закодированные страницы WooCommerce
Многие темы оформления для электронной коммерции включают специальные страницы, такие как Корзина или Мой аккаунт. Тема оформления часто содержит ссылки на эти страницы, которые отображаются на каждой странице сайта.
Если Вы используете меню WordPress для этих ссылок, все должно работать корректно. WPML отображает отдельное меню WordPress для каждого языка, поэтому ссылки на эти «специальные страницы» будут разными для каждого языка. Однако, если Вы жестко кодируете эти ссылки в файлах шаблонов, Вам необходимо разрешить WPML заменять их на ссылки, ведущие на эти страницы на нужном языке.
Правильный способ создания ссылок на специальные страницы WooCommerce — использование функций API WordPress и ID страниц WooCommerce. WPML Multilingual & Multicurrency for WooCommerce фильтрует вызовы get_option() с ID страниц WooCommerce. Это вернет ID страницы на текущем языке.
Правильно
<a href="<?php echo get_permalink(get_option('woocommerce_shop_page_id')) ?>"><?php _e('Shop page', 'my-textdomain') ?></a><a href="<?php echo get_permalink(wc_get_page_id('shop')) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>«shop» — это слаг страницы на языке по умолчанию.
Неправильно
<a href="<?php echo get_permalink(5) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>ID страницы «shop page» жестко закодирован. Он будет разным для разных сайтов и языков.
<a href="/shop"><?php _e('Shop page', 'my-textdomain') ?></a>URL-адрес страницы «shop page» жестко закодирован. Он будет разным для разных языков.
| Правильно | Неправильно |
|---|---|
<a href="<?php echo get_permalink(get_option('woocommerce_shop_page_id')) ?>"><?php _e('Shop page', 'my-textdomain') ?></a><a href="<?php echo get_permalink(wc_get_page_id('shop')) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>«shop» — это слаг страницы на языке по умолчанию. | <a href="<?php echo get_permalink(5) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>ID страницы «shop page» жестко закодирован. Он будет разным для разных сайтов и языков. <a href="/shop"><?php _e('Shop page', 'my-textdomain') ?></a>URL-адрес страницы «shop page» жестко закодирован. Он будет разным для разных языков. |
Списки товаров Multilingual Ready
Если Вы используете шорткоды WooCommerce для отображения списка товаров, все готово. WooCommerce загрузит товары на правильном языке и отобразит их.
Если Вы предпочитаете загружать товары вручную, используя собственный код, убедитесь, что Вы используете API WordPress или вызовы API WooCommerce. Если Вы обращаетесь к базе данных напрямую, WPML не будет фильтровать Ваш вызов, и Вы получите смесь всех товаров на всех языках.
Правильно
<?php $products = get_posts(array('post_type' => 'product', 'suppress_filters' => 0)); ?><?php
$args = array(
'post_type' => 'product',
'posts_per_page' => 10,
);
$products = new WP_Query( $args );
?>Неправильно
<?php $products = get_posts(array('post_type' => 'product')); ?>Параметр suppress_filters по умолчанию будет иметь значение true, что предотвратит фильтрацию по языку.
$products = $wpdb->get_results($wpdb->prepare(“SELECT * FROM {$wpdb->posts} WHERE post_type='product' ORDER BY ID DESC LIMIT %d", 10));WPML не фильтрует низкоуровневые SQL-запросы. Будут возвращены все товары на всех языках.
| Правильно | Неправильно |
|---|---|
<?php $products = get_posts(array('post_type' => 'product', 'suppress_filters' => 0)); ?><?php | <?php $products = get_posts(array('post_type' => 'product')); ?>Параметр suppress_filters по умолчанию будет иметь значение true, что предотвратит фильтрацию по языку. $products = $wpdb->get_results($wpdb->prepare(“SELECT * FROM {$wpdb->posts} WHERE post_type='product' ORDER BY ID DESC LIMIT %d", 10));WPML не фильтрует низкоуровневые SQL-запросы. Будут возвращены все товары на всех языках. |
После загрузки нужных товаров Вам не нужно беспокоиться о языках при их отображении. У каждого товара будут свои произвольные поля с информацией на правильном языке.
Шаблоны товаров Multilingual Ready
Поскольку переводы хранятся в отдельных товарах, отображение одного товара на мультиязычном сайте WooCommerce не должно требовать особых усилий.
Возможности мультивалютной оплаты
Ваш мультиязычный сайт WooCommerce также может включать несколько валют. Для многих неамериканских сайтов поддержка нескольких валют является очень важной функцией. Например, многим европейским сайтам потребуется взимать плату в евро, британских фунтах и долларах США. Восточноевропейским сайтам часто требуются российские рубли, тогда как азиатским сайтам необходимо множество других валют.
Поддержка мультивалютности включена в WPML Multilingual & Multicurrency for WooCommerce. Чтобы посетители могли переключаться между валютами, Ваша тема оформления должна включать дополнительный переключатель валют.
Вы можете отобразить переключатель валют с помощью вызова PHP или вставив шорткод.
<?php do_action('currency_switcher', array('format' => '%name (%symbol)')); ?>[currency_switcher]Для получения дополнительной информации см. руководство по мультивалютности для WooCommerce. Обратите внимание, что Вы увидите переключатель валют на фронтенде только в том случае, если на сайте используется несколько валют.
Обеспечение совместимости сайта WooCommerce с RTL
Темы оформления WooCommerce должны следовать тем же рекомендациям по поддержке тем RTL, что и любые другие темы оформления WordPress. Вам следует создать файл rtl.css с правилами CSS для отображения RTL.
Обработка различной длины текста на разных языках с помощью гибкого дизайна
При создании темы оформления WooCommerce, являющейся Multilingual Ready, помните, что некоторые тексты будут длиннее на одних языках и короче на других. Иногда Вы даже не сможете провести тестирование, поскольку переводить будут Ваши конечные пользователи.
Например, посмотрите на эти два блока товаров.
CSS оптимизирован для короткого текста на английском языке
Более длинные тексты на испанском языке не помещаются в отведенное пространство
Как правило, тестируйте свою тему оформления с текстами, которые в 2 раза длиннее и в 2 раза короче. Это защитит Вас в большинстве случаев. Лучший способ работы с текстами разного размера — использование гибких макетов. Гибкие макеты позволят элементам изменять размер и занимать необходимую им площадь. Создание элегантного шаблона с гибкими размерами — задача не из простых, но это помогает избежать визуальных сбоев.
Готовы начать работу?
Если Вы разработчик, создающий темы оформления или расширения для WooCommerce, Вам определенно стоит присоединиться к нашей программе Go Global. Вы получите бесплатную учетную запись разработчика WPML и приоритетную поддержку от нашей команды по совместимости. Магазин WooCommerce — это только один (большой) раздел Вашей темы оформления. Вам обязательно следует прочитать наше руководство по обеспечению совместимости Ваших тем оформления с WPML.
Создаете сайты для клиентов? Купите WPML и начните работу с мультиязычными сайтами для WooCommerce и не только.