WooCommerce-Produkte sind benutzerdefinierte WordPress-Beiträge („posts“) mit benutzerdefinierten Feldern. Sie werden mithilfe der benutzerdefinierten Taxonomien „Produktkategorien“ und „Produkt-Schlagwörter“ angeordnet. Hier zeigen wir Ihnen, wie mehrsprachige WooCommerce-Websites funktionieren und was Ihre WooCommerce-Themes benötigen, um Multilingual Ready (mehrsprachig einsatzbereit) zu sein.
Wie mehrsprachige WooCommerce-Websites funktionieren
Wenn eine Website WPML verwendet, wird jedem Inhaltselement eine Sprache zugewiesen. Das bedeutet, dass jedes Produkt, jede Kategorie und jedes Schlagwort ein Sprachattribut hat. Übersetzungen werden in der Datenbank als separate Produkte gespeichert und über die Sprachtabelle von WPML miteinander verknüpft. Übersetzte Produkte teilen sich dieselben Bilder und haben ihre eigenen Felder mit Texten in der richtigen Sprache.
Website-Administratoren können bequem über die Produktübersetzungstabelle von WPML übersetzen. Auf diese Weise können sie sich auf das Übersetzen der erforderlichen Texte konzentrieren, ohne sich darum kümmern zu müssen, wie Übersetzungen in der Datenbank gespeichert werden.
Da Übersetzungen in der Datenbank getrennt sind, ist es auch einfach, mehrsprachige WooCommerce-Websites anzuzeigen. Wenn Sie die WordPress- und WooCommerce-APIs verwenden, ist Ihr Theme möglicherweise bereits Multilingual Ready. Mit ein wenig Testen und möglicherweise kleinen Bearbeitungen können Sie eine vollständige mehrsprachige Kompatibilität erreichen und neue Märkte erschließen.
Erforderliche Plugins für mehrsprachige WooCommerce-Websites
Um mehrsprachige WooCommerce-Websites zu betreiben, werden die folgenden Plugins benötigt:
- WooCommerce
- Das WPML-Core-Plugin sowie die Add-ons WPML String-Übersetzung und WPML Medienübersetzung
- WPML Multilingual & Multicurrency for WooCommerce
WPML und alle zugehörigen Plugins, einschließlich WPML Multilingual & Multicurrency for WooCommerce, sind im Kontotyp Multilingual CMS enthalten.
Hartcodierte Texte in Templates
Ihre Template-Dateien zeigen eine Mischung aus Produktinformationen und hartcodierten Texten an. Zum Beispiel enthalten die meisten Templates den Produktnamen und einen „Buy“-Link. Der Produktname stammt aus der Datenbank, sodass Sie sich nicht um dessen Übersetzung kümmern müssen.
Sie sollten sicherstellen, dass alle hartcodierten Texte unter Verwendung von GetText übersetzbar sind.
Gut
<p><?php _e('Similar products:', 'my-textdomain') ?></p><input type="button" name="buy-button" value="<?php esc_attr_e('Buy now!', 'my-textdomain') ?>" />Im folgenden Beispiel sind „Similar products“ und „Buy now!“ nicht in GetText-Aufrufe verpackt.
Schlecht
<p><?php echo 'Similar products:'; ?></p>
<input type="button" name="buy-button" value="Buy now!" />Gut
<p><?php _e('Similar products:', 'my-textdomain') ?></p><input type="button" name="buy-button" value="<?php esc_attr_e('Buy now!', 'my-textdomain') ?>" />Schlecht
<p><?php echo 'Similar products:'; ?></p><input type="button" name="buy-button" value="Buy now!" />„Similar products“ und „Buy now!“ sind nicht in GetText-Aufrufe verpackt.
| Gut | Schlecht |
|---|---|
<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“ und „Buy now!“ sind nicht in GetText-Aufrufe verpackt. |
Stellen Sie sicher, dass Sie für alle GetText-Aufrufe die Textdomain Ihres Themes verwenden.
Hartcodierte WooCommerce-Seiten
Viele E-Commerce-Themes enthalten spezielle Seiten, wie die Warenkorb- oder Konto-Seiten. Das Theme enthält oft Links zu diesen Seiten, die auf jeder Seite der Website erscheinen.
Wenn Sie ein WordPress-Menü für diese Links verwenden, sollte alles bereit sein. WPML zeigt für jede Sprache ein anderes WordPress-Menü an, sodass die Links zu diesen ‚speziellen Seiten‘ je nach Sprache unterschiedlich sind. Wenn Sie diese Links jedoch in Template-Dateien hartcodieren, müssen Sie WPML erlauben, die Links durch Links zu diesen Seiten in der richtigen Sprache zu ersetzen.
Der richtige Weg, um auf die speziellen WooCommerce-Seiten zu verlinken, ist die Verwendung der WordPress-API-Funktionen und der WooCommerce-Seiten-IDs. WPML Multilingual & Multicurrency for WooCommerce filtert Aufrufe von get_option() mit den WooCommerce-Seiten-IDs. Es wird die ID der Seite in der aktuellen Sprache zurückgegeben.
Gut
<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>Das „shop“ ist der Slug der Seite in der Standardsprache.
Schlecht
<a href="<?php echo get_permalink(5) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>Die ID der „shop page“ ist hartcodiert. Sie wird für verschiedene Websites und für verschiedene Sprachen unterschiedlich sein.
<a href="/shop"><?php _e('Shop page', 'my-textdomain') ?></a>Die URL der „shop page“ ist hartcodiert. Sie wird für verschiedene Sprachen unterschiedlich sein.
| Gut | Schlecht |
|---|---|
<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>Das „shop“ ist der Slug der Seite in der Standardsprache. | <a href="<?php echo get_permalink(5) ?>"><?php _e('Shop page', 'my-textdomain') ?></a>Die ID der „shop page“ ist hartcodiert. Sie wird für verschiedene Websites und für verschiedene Sprachen unterschiedlich sein. <a href="/shop"><?php _e('Shop page', 'my-textdomain') ?></a>Die URL der „shop page“ ist hartcodiert. Sie wird für verschiedene Sprachen unterschiedlich sein. |
Multilingual Ready Produktlisten
Wenn Sie die WooCommerce-Shortcodes verwenden, um die Produktliste anzuzeigen, sind Sie bestens gerüstet. WooCommerce lädt die Produkte in der richtigen Sprache und zeigt sie an.
Wenn Sie es vorziehen, Produkte manuell mit Ihrem eigenen Code zu laden, stellen Sie sicher, dass Sie die WordPress-API oder WooCommerce-API-Aufrufe verwenden. Wenn Sie direkt auf die Datenbank zugreifen, filtert WPML Ihren Aufruf nicht und Sie erhalten eine Mischung aller Produkte in allen Sprachen.
Gut
<?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 );
?>Schlecht
<?php $products = get_posts(array('post_type' => 'product')); ?>suppress_filters ist standardmäßig auf true gesetzt, was die Sprachfilterung verhindert.
$products = $wpdb->get_results($wpdb->prepare(“SELECT * FROM {$wpdb->posts} WHERE post_type='product' ORDER BY ID DESC LIMIT %d", 10));WPML filtert keine Low-Level-SQL-Abfragen. Alle Produkte in allen Sprachen werden zurückgegeben.
| Gut | Schlecht |
|---|---|
<?php $products = get_posts(array('post_type' => 'product', 'suppress_filters' => 0)); ?><?php | <?php $products = get_posts(array('post_type' => 'product')); ?>suppress_filters ist standardmäßig auf true gesetzt, was die Sprachfilterung verhindert. $products = $wpdb->get_results($wpdb->prepare(“SELECT * FROM {$wpdb->posts} WHERE post_type='product' ORDER BY ID DESC LIMIT %d", 10));WPML filtert keine Low-Level-SQL-Abfragen. Alle Produkte in allen Sprachen werden zurückgegeben. |
Sobald Sie die richtigen Produkte geladen haben, müssen Sie sich bei deren Anzeige keine Gedanken über Sprachen machen. Jedes Produkt verfügt über seine eigenen benutzerdefinierten Felder mit Informationen in der korrekten Sprache.
Multilingual Ready Produkt-Templates
Da Übersetzungen in separaten Produkten gespeichert werden, sollte die Anzeige eines einzelnen Produkts auf einer mehrsprachigen WooCommerce-Website keinen besonderen Aufwand erfordern.
Zahlungsoptionen für mehrere Währungen
Ihre mehrsprachige WooCommerce-Website kann auch mehrere Währungen umfassen. Für viele nicht-amerikanische Websites ist die Unterstützung mehrerer Währungen eine sehr wichtige Funktion. Zum Beispiel müssen viele europäische Websites in Euro, Britischen Pfund und US-Dollar abrechnen. Osteuropäische Websites benötigen oft den russischen Rubel, während asiatische Websites eine Vielzahl anderer Währungen benötigen.
Die Unterstützung für mehrere Währungen ist in WPML Multilingual & Multicurrency for WooCommerce enthalten. Damit Besucher zwischen Währungen wechseln können, sollte Ihr Theme einen optionalen Währungsumschalter enthalten.
Sie können einen Währungsumschalter entweder über einen PHP-Aufruf oder durch Einfügen eines Shortcodes anzeigen.
<?php do_action('currency_switcher', array('format' => '%name (%symbol)')); ?>[currency_switcher]Weitere Informationen finden Sie im Tutorial zu mehreren Währungen für WooCommerce. Bitte beachten Sie, dass Sie den Währungsumschalter im Frontend nur sehen, wenn die Website mehrere Währungen verwendet.
Ihre WooCommerce-Website RTL-kompatibel machen
WooCommerce-Themes müssen denselben Richtlinien zur Unterstützung von RTL-Themes folgen wie alle anderen WordPress-Themes. Sie sollten eine Datei rtl.css mit den CSS-Regeln für die RTL-Anzeige erstellen.
Umgang mit unterschiedlichen Textlängen in verschiedenen Sprachen durch Fluid Design
Wenn Sie Ihr Multilingual Ready WooCommerce-Theme erstellen, denken Sie daran, dass einige Texte in bestimmten Sprachen länger und in anderen kürzer sein werden. Manchmal werden Sie nicht einmal testen können, da Ihre Endnutzer übersetzen werden.
Sehen Sie sich zum Beispiel diese beiden Produktblöcke an.
CSS optimiert für kurzen Text auf Englisch
Längere spanische Texte passen nicht in den Platz
Als Faustregel gilt: Testen Sie Ihr Theme mit Texten, die 2x länger und ½ kürzer sind. Damit sind Sie in den meisten Fällen auf der sicheren Seite. Der beste Weg, um mit Texten unterschiedlicher Größe umzugehen, ist die Verwendung von Fluid Layouts. Fluid Layouts ermöglichen es Elementen, ihre Größe anzupassen und den benötigten Platz einzunehmen. Ein elegantes Template mit fließenden Größen zu erstellen, ist nicht trivial, hilft aber dabei, visuelle Fehler zu vermeiden.
Bereit loszulegen?
Wenn Sie als Entwickler WooCommerce-Themes oder -Erweiterungen erstellen, sollten Sie auf jeden Fall an unserem Go Global-Programm teilnehmen. Sie erhalten ein kostenloses WPML-Entwicklerkonto und bevorzugten Support von unserem Kompatibilitäts-Team. Der WooCommerce-Shop ist nur ein (großer) Teil Ihres Themes. Sie sollten unbedingt unseren Leitfaden zum Erreichen der WPML-Kompatibilität für Ihre Themes lesen.
Bauen Sie Websites für Kunden? Kaufen Sie WPML und legen Sie mit mehrsprachigen Websites für WooCommerce und darüber hinaus los.