WooCommerceの商品は、カスタムフィールドを持つカスタムWordPress「投稿」です。これらは「商品カテゴリー」および「商品タグ」のカスタムタクソノミーを使用して整理されます。ここでは、多言語のWooCommerceサイトがどのように機能するか、そしてWooCommerceテーマを多言語対応にするために何が必要かを紹介します。
多言語WooCommerceサイトの仕組み
サイトでWPMLを使用すると、コンテンツのすべての要素に言語が割り当てられます。つまり、各商品、カテゴリー、タグに言語属性が追加されます。翻訳は個別の商品としてデータベースに保存され、WPMLの言語テーブルを使用してリンクされます。翻訳された商品は同じ画像を共有し、適切な言語のテキストを持つ個別のフィールドを持ちます。
サイト管理者は、WPMLの商品翻訳テーブルを使用して便利に翻訳できます。これにより、データベースに翻訳がどのように保存されているかを心配することなく、必要なテキストの翻訳に集中できます。
データベース内で翻訳が分離されているため、多言語のWooCommerceサイトを表示するのも簡単です。実際、WordPressおよびWooCommerce APIを使用している場合、テーマはすでに多言語対応になっている可能性があります。少しのテストと小規模な編集を行うだけで、完全な多言語の互換性を実現し、新しい市場を開拓できます。
多言語WooCommerceサイトに必要なプラグイン
多言語のWooCommerceサイトを運営するには、以下のプラグインが必要です。
- WooCommerce
- WPMLコアプラグイン、WPML 文字列翻訳、およびWPML メディア翻訳アドオン
- WPML Multilingual & Multicurrency for WooCommerce
WPMLおよびWPML Multilingual & Multicurrency for WooCommerceを含むすべての関連プラグインは、Multilingual CMSアカウントタイプに付属しています。
テンプレート内のハードコーディングされたテキスト
テンプレートファイルには、商品情報とハードコーディングされたテキストが混在して表示されます。たとえば、ほとんどのテンプレートには商品名と「Buy」リンクが含まれます。商品名はデータベースから取得されるため、翻訳について心配する必要はありません。
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呼び出しでラップされていません。 |
すべてのGetText呼び出しで、テーマのテキストドメインを使用していることを確認してください。
ハードコーディングされたWooCommerceページ
多くのeコマーステーマには、Cart（カート）やAccount（アカウント）ページなどの特別なページが含まれています。テーマには多くの場合、サイトのすべてのページに表示されるこれらのページへのリンクが含まれています。
これらのリンクにWordPressメニューを使用している場合は、それ以上の設定は不要です。WPMLは言語ごとに異なるWordPressメニューを表示するため、これらの「特別なページ」へのリンクは言語ごとに異なります。ただし、テンプレートファイルにこれらのリンクをハードコーディングする場合は、WPMLがリンクを適切な言語のページへのリンクに置き換えられるようにする必要があります。
特別なWooCommerceページにリンクする正しい方法は、WordPress API関数とWooCommerceページIDを使用することです。WPML Multilingual & Multicurrency for WooCommerceは、WooCommerceページIDを使用するget_option()への呼び出しをフィルタリングします。これにより、現在の言語のページ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>「shop page」のIDがハードコーディングされています。これはサイトや言語によって異なります。
<a href="/shop"><?php _e('Shop page', 'my-textdomain') ?></a>「shop page」のURLがハードコーディングされています。これは言語によって異なります。
| 良い例 | 悪い例 |
|---|---|
<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>「shop page」のIDがハードコーディングされています。これはサイトや言語によって異なります。 <a href="/shop"><?php _e('Shop page', 'my-textdomain') ?></a>「shop page」のURLがハードコーディングされています。これは言語によって異なります。 |
多言語対応の商品リスト
商品リストを表示するためにWooCommerceのショートコードを使用している場合は、それ以上の設定は不要です。WooCommerceは正しい言語で商品を読み込み、表示します。
独自のコードを使用して手動で商品を読み込む場合は、WordPress APIを使用するか、WooCommerce API呼び出しを使用していることを確認してください。データベースに直接アクセスすると、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クエリをフィルタリングしません。すべての言語のすべての商品が返されます。 |
適切な商品を読み込んだ後は、表示する際に言語について心配する必要はありません。各商品には、正しい言語の情報が含まれた独自のカスタムフィールドが付属します。
多言語対応の商品テンプレート
翻訳は個別の商品として保存されるため、多言語のWooCommerceサイトで単一の商品を表示するのに特別な手間はかかりません。
マルチ通貨の支払いオプション
多言語のWooCommerceサイトには、複数の通貨を含めることもできます。アメリカ以外の多くのサイトにとって、複数の通貨をサポートすることは非常に重要な機能です。たとえば、多くのヨーロッパのサイトでは、ユーロ、英ポンド、米ドルでの請求が必要になります。東ヨーロッパのサイトではロシアルーブルが頻繁に必要とされ、アジアのサイトではさまざまな他の通貨が必要になります。
マルチ通貨のサポートはWPML Multilingual & Multicurrency for WooCommerceに含まれています。訪問者が通貨を切り替えられるようにするには、テーマにオプションの通貨切り替えを含める必要があります。
PHP呼び出しを使用するか、ショートコードを挿入することで、通貨切り替えを表示できます。
<?php do_action('currency_switcher', array('format' => '%name (%symbol)')); ?>[currency_switcher]詳細については、WooCommerceのマルチ通貨に関するチュートリアルを参照してください。サイトで複数の通貨を使用している場合にのみ、フロントエンドに通貨切り替えが表示されることに注意してください。
WooCommerceサイトのRTL対応
WooCommerceテーマは、他のWordPressテーマと同じRTLテーマサポートのガイドラインに従う必要があります。RTL表示用のCSSルールを含むrtl.cssファイルを作成する必要があります。
フルイドデザインを使用した異なる言語での異なるテキスト長への対応
多言語対応のWooCommerceテーマを作成する際は、一部のテキストが特定の言語では長くなり、他の言語では短くなることを覚えておいてください。エンドユーザーが翻訳を行うため、テストすらできない場合もあります。
たとえば、次の2つの商品ブロックを見てください。
英語の短いテキストに最適化されたCSS
長いスペイン語のテキストがスペースに収まらない
経験則として、2倍の長さと半分の長さのテキストでテーマをテストしてください。これにより、ほとんどのケースをカバーできます。異なるサイズのテキストを処理する最良の方法は、フルイドレイアウトを許可することです。フルイドレイアウトにより、要素がサイズ変更され、必要な領域を確保できるようになります。流動的なサイズを持つエレガントなテンプレートを作成するのは簡単ではありませんが、そうすることで視覚的な不具合を回避できます。
さあ、始めましょう
WooCommerceテーマや拡張機能を構築している開発者の場合は、ぜひGo Globalプログラムにご参加ください。無料のWPML開発者アカウントを受け取り、当社の互換性チームから優先的なサポートを受けることができます。WooCommerceショップは、テーマの（大きな）一部にすぎません。テーマのWPML互換性を実現するためのガイドもぜひお読みください。
クライアント向けのサイトを構築していますか？WPMLを購入して、WooCommerceやその他の多言語サイトを使い始めましょう。