In diesem Gast-Post erklärt Michael Wassmer, wie Sie mit WordPress einen mehrsprachigen Produktkatalog erstellen können.

Die Idee für diesen Post stammt aus einer Diskussion im Forum über das Teilen von kundenspezifischen Feldern und Medien zwischen Übersetzungen.

Das Ziel – ein mehrsprachiger Produktkatalog mit WordPress

Um meinen kleinen zweisprachigen Shop einzurichten, wollte ich kein kompliziertes E-Commerce CMS benutzen, WordPress war genau das, was ich brauchte. Ich freute mich auch darauf, das WPML-Plugin an einem etwas komplexeren Projekt als einem gewöhnlichen klassischen Blog oder einer normalen Webseite zu testen.

In meinem Englisch/Französisch Online-Katalog wird jedes Produkt in einem dafür vorgesehenen Post beschrieben. Um ein Produkt hinzuzufügen, füge ich einfach einen Post im Backend von WordPress hinzu, gebe ihm dabei den Produktnamen als Titel, tippe die Beschreibung in den Textbereich für den Inhalt ein, lade die Produktbilder in die Bildergalerie des Posts hoch und verwende die kundenspezifischen Felder für Werte wie den Preis, die Bestellnr. und die Größe.

So würde ein Produktpost auf Englisch (der voreingestellten Sprache) aussehen:

Post_Beispiel

Nun, nachdem ich den Originalpost für ein Produkt geschrieben habe, wie erstelle ich die übersetzte (französische) Version davon? Nach der Anleitung von WPML klicke ich einfach auf die Sprachbox unter dem Fenster Inhalt veröffentlichen, klicke auf „anzeigen" neben „Übersetzungen" und dann auf „hinzufügen". Es öffnet sich eine neue Postseite, in die ich alle übersetzten Angaben meines Produkts eingeben kann: französischer Titel, französische Beschreibung usw.

Problem – In Übersetzungen werden die Produktinformationen dupliziert

Aber Moment mal! Jetzt kommt das Nervige. Ich muss auch die kundenspezifischen Werte noch einmal eingeben: Referenz, Preis und Größe. In meinem Fall sind diese Werte in allen Sprachen gleich, also es ist nicht sinnvoll, sie zweimal eingeben zu müssen. Das ist ein offensichtliches Problem, durch das ich viel Zeit verlieren würde, wenn ich dieselben Informationen für jede Übersetzung eines Produktposts mehrere Male eingeben müsste.

Bei den Produktbildern ist es genauso. Ich möchte die ganzen Produktbilder nicht ein zweites Mal für das selbe Produkt in seiner übersetzten Version hochladen. Logischerweise sind die Produktbilder in jeder Sprache gleich, also sollte ich sie auch nur einmal hochladen müssen.

Also, lassen Sie uns den übersetzten Post einfach so speichern, ohne eine Übersetzung für die kundenspezifischen Felder einzugeben und ohne die Produktbilder hochzuladen.

Ok, jetzt schauen wir uns mal einen Code an. Hier ist ein sehr grundlegendes Beispiel einer Artikellistungsseite für eine Kategorie (normalerweise die archive.php– Datei Ihres WP-Themes) :

<?php while (have_posts()) : the_post(); ?>
  <ul class = "product">
    <li class = "title"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
    <li class = "ref"><?php echo get_post_meta($post->ID, 'Reference', true); ?></li>
    <li class = "price"><?php echo get_post_meta($post->ID, 'Price', true); ?></li>
  </ul>
<?php endwhile; ?>

Dies ist eine klassische Schleife. Sie zeigt eine Liste meiner Produkte und die zugehörigen kundenspezifischen Werte an – und Preis und Bestellnummer.

Wenn ich nun in der Sprachauswahl im Frontend meiner Webseite auf eine andere Sprache klicke (in meinem Fall Französisch), wird die Übersetzung der Artikeltitel angezeigt, aber nicht die Bestellnummer und der Preis. Das ist normal, denken Sie daran, wir haben sie im übersetzten Post nicht eingegeben…

Wie schaffe ich es nun, dass WordPress die kundenspezifischen Werte anzeigt, die ich im englischen Originalpost eingegeben habe?

Lösung – Teilen von kundenspezifischen Feldern zwischen Übersetzungen

WPML ist ein leistungsstarkes Plugin, das uns viele nützliche Funktionen bietet, um die Werte aus dem Originalpost sogar auf die übersetzten Seiten zu übertragen.

Wir werden die icl_object_id() Funktion verwenden und den vorherigen Code durch Folgendes ersetzen:

<?php while (have_posts()) : the_post(); ?>
<?php
  // Get the original post ID (in my case the english one)
  $o_ID = icl_object_id($post->ID, 'post', false, 'en'); ?>
  <ul class= "product">
    <li class = "title"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
    <li class = "ref"><?php echo get_post_meta($o_ID, 'Reference', true); ?></li>
    <li class = "price"><?php echo get_post_meta($o_ID, 'Price', true); ?></li>
  </ul>
<?php endwhile; ?>

Im Grunde habe ich die ID des Originalposts entsprechend des übersetzten Posts angefordert und diese ID verwendet, um die kundenspezifischen Werte zu erhalten. Je nach Originalsprache Ihrer Posts können Sie die letzten Parameter von icl_object_id ändern (‚de‘ für Deutsch, ‚fr‘ für Französisch usw.) Weitere Informationen über die anderen Parameter dieser Funktionen erhalten Sie hier und auf der Codier-API-Seite gibt es eine Liste der anderen Funktionen.

Das war’s für die kundenspezifischen Felder, wie mache ich jetzt dasselbe mit der Bildergalerie?

Nehmen wir unser erstes Beispiel und zeigen auch drei Vorschaubilder für jeden Post in der Liste:

<?php while (have_posts()) : the_post(); ?>

<?php
  // Get the original post ID (in my case the english one)
  $o_ID = icl_object_id($post->ID, 'post', false, 'en'); ?>

  <ul class= "product">
    <li class = "title"><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></li>
    <li class = "ref"><?php echo get_post_meta($o_ID, 'Reference', true); ?></li>
    <li class = "price"><?php echo get_post_meta($o_ID, 'Price', true); ?></li>

<?php

  // Get 3 thumbnails from the original post
  $args = array('post_type' => 'attachment','numberposts' => 3,'post_status' => null,'post_parent' => $o_ID);
  $attachments = get_posts($args);
  if ($attachments) {
    foreach ($attachments as $attachment) {
      echo '<li class="thumbnail">'.wp_get_attachment_image($attachment->ID).'</li>';
    }
  }
?>
</ul>

<?php endwhile; ?>

Zusammenfassung

Sie können dieses kleine Script ganz leicht individuell abwandeln, um es Ihren Bedürfnissen anzupassen, sodass mehr (oder weniger) Bilder angezeigt werden oder unterschiedliche Größen.

Das war’s schon. Jetzt können Sie Ihre Artikelliste in allen Sprachen anzeigen und sie wird immer alle kundenspezifischen Felder und Bilder des Produkts enthalten, selbst wenn diese technisch nur im Originalpost abgespeichert sind.

Richtig interessant wird dies bei größeren Katalogen mit mehr Sprachen. Stellen Sie sich vor, Sie müssen den Preis eines Produkts in fünf Sprachen ändern. Mit der normalen Methode müssten Sie alle fünf Posts editieren. Mit Hilfe dieser einfachen Methode haben Sie immer eine „Hauptsprache", deren Posts die vollständigen Angaben über Ihre Produkte enthalten, welche in den Übersetzungen erneut verwendet werden.

Michael Wassmer ist ein freiberuflicher Webdesigner, der in Barcelona, Spanien, lebt. Sie können ihn unter mike@michaelwassmer.net kontaktieren.