Page-Builder-Inhalte für die Übersetzung registrieren

Erfahren Sie, wie Sie benutzerdefinierte Page-Builder-Inhalte für die Übersetzung über die Datei wpml-config.xml registrieren. Registrieren Sie Strings, Medien, Page-Builder-Widgets, Shortcode-IDs und mehr.

Dieser Leitfaden richtet sich an Entwickler, die Themes und Plugins erstellen oder benutzerdefinierten Page-Builder-Code zu ihrer Website hinzufügen.

Wenn Sie einen Page-Builder von Drittanbietern verwenden und die benutzerdefinierten Widgets auf Ihrer Website nicht übersetzen können, wenden Sie sich bitte an den WPML-Support.

Müssen Sie eine wpml-config.xml-Datei generieren? Besuchen Sie unsere Schritt-für-Schritt-Anleitung zur automatischen Generierung einer Konfigurationsdatei mit dem Plugin Multilingual Tools.

Strings übersetzen

Betrachten wir ein Beispiel, bei dem Sie einer Seite mit Visual Composer ein Text-Trennzeichen hinzugefügt haben. Dieses Trennzeichen hat einen Titel, und sein Shortcode sieht so aus:

[vc_text_separator title="Separator Title"]

Um den Titel dieses Text-Trennzeichens zu übersetzen, müssen Sie Ihrer Datei wpml-config.xml einige Zeilen hinzufügen. Auf diese Weise „weiß“ WPML, dass der Titel dieses Trennzeichens übersetzt werden muss.

Der folgende Code ist ein Beispiel dafür, was Sie in diesem Fall zur Datei wpml-config.xml hinzufügen müssen.

Beispiel für das Hinzufügen eines Page-Builder-Shortcodes zur Datei wpml-config.xml

<wpml-config>
  <shortcodes>
    <shortcode>
        <tag>vc_text_separator</tag>
        <attributes>
            <attribute>title</attribute>
        </attributes>
    </shortcode>
  </shortcodes>
</wpml-config>

Gehen wir die Struktur des obigen Beispiels durch:

Beginnen Sie mit dem Tag shortcodes. Alle Shortcodes auf Ihrer Website, die übersetzt werden müssen, sollten unter diesem Tag platziert werden.
Verwenden Sie das Tag shortcode, um alle Tags zu umschließen, die zu einem einzigen Shortcode gehören.
Verwenden Sie das Tag namens tag, um den Namen des Shortcodes zu definieren. In diesem Fall ist es vc_text_separator. Wenn Sie möchten, können Sie Tags optionale benutzerdefinierte Labels hinzufügen. Diese Labels werden neben dem Text sowohl im Erweiterten Übersetzungs-Editor als auch im Klassischen Übersetzungs-Editor angezeigt. Exportierte XLIFF-Dateien enthalten diese Labels ebenfalls. Im folgenden Beispiel sehen Sie, wie Sie Tags und Attributen Labels hinzufügen.
Shortcodes können ein oder mehrere Attribute haben, daher müssen Sie sie in das Tag attributes (Plural) einschließen und das Tag attribute (Singular) verwenden, um den Titel jedes Attributs zu definieren.

Page-Builder enthalten (manchmal) Designelemente, die Link-Attribute aufweisen.

Sie können interne Links automatisch auf die übersetzte Version dieses Beitrags verweisen lassen, indem Sie die Link-Option verwenden: type="link".

Sie können hierfür das Attribut encoding verwenden. Es verarbeitet spezielle Codierungen, die verschiedene Page-Builder verwenden. Das Encoding-Attribut ist normalerweise spezifisch für den von Ihnen verwendeten Page-Builder. Es akzeptiert die folgenden Werte:

base64 – Visual Composer Raw-HTML-Shortcode. Der Shortcode speichert das HTML als base64-String.
vc_link – Spezielle Link-Formatierung für Visual Composer.
vc_values – Spezielle Visual-Composer-Codierung für Werte in Fortschrittsbalken-, Kreisdiagramm- und Liniendiagramm-Widgets.
av_link – Spezielle Link-Formatierung für Enfold.
allow_html_tags – Normalerweise werden HTML-Tags aus Shortcode-Attributen entfernt. Setzen Sie das Encoding auf allow_html_tags, wenn das Shortcode-Attribut HTML-Tags zulassen soll. Verwenden Sie dies mit Vorsicht, da das Zulassen von HTML-Tags in einigen Situationen die Formatierung durcheinanderbringen und ein Sicherheitsproblem darstellen kann.

Beispiel für das Hinzufügen eines Shortcode-Link-Attributs: type="link"

<wpml-config>
  <shortcodes>
    <shortcode>
            <tag>av_button</tag>
            <attributes>
                <attribute>label</attribute>
                <attribute type="link" encoding="av_link">link</attribute>
            </attributes>
    </shortcode>
  </shortcodes>
</wpml-config>

Wenn Sie darüber nachdenken, urlencoded-Shortcodes zu verwenden, lesen Sie unbedingt die Seite über das Übersetzen von urlencoded-Shortcodes.

Beispiel für das Hinzufügen von Tag- und Attribut-Labels

<wpml-config>
    <shortcodes>
        <shortcode>
            <tag label="My shortcode label">my_shortcode</tag>
            <attributes>
                <attribute label="Shortcode title">title</attribute>
            </attributes>
        </shortcode>
    </shortcodes>
</wpml-config>

Das Hinzufügen von Labels zu Tags und Attributen ermöglicht es Ihnen, benutzerdefinierte Labels im Erweiterten Übersetzungs-Editor oder Klassischen Übersetzungs-Editor anzuzeigen. Dies kann dem Übersetzer helfen, den Kontext des Strings besser zu verstehen.

Felder für eine bessere Organisation gruppieren

Um die Übersichtlichkeit und Organisation Ihrer XML-Konfiguration zu verbessern, können Sie Feld-Labels mit dem Gruppennamen versehen. Betrachten Sie dieses Beispiel eines CTA-Buttons:

<wpml-config>
    <shortcodes>
        <shortcode>
            <tag label="Call To Action: Content">et_pb_cta</tag>
            <attributes>
                <attribute label="Call To Action: Title">title</attribute>
                <attribute label="Call To Action: Button Text">button_text</attribute>
                <attribute label="Call To Action: Button URL" type="link">button_url</attribute>
            </attributes>
        </shortcode>
    </shortcodes>
</wpml-config>

Hier trägt jedes Attribut des Shortcodes et_pb_cta ein Label Call To Action: . WPML gibt diese Labels nicht an den Erweiterten Übersetzungs-Editor weiter: Der Übersetzer sieht jedes Attribut als eigenes Feld, gruppiert unter dem Shortcode, und unterscheidet die Felder anhand des Textes, den jedes enthält. Das Attribut label ist weiterhin Teil des Konfigurationsformats und sollte dennoch festgelegt werden:

CTA-Button im Erweiterten Übersetzungs-Editor übersetzen

Medien übersetzen

Sie können WPML Medienübersetzung verwenden, um in Page-Builder-Inhalten unterschiedliche Bilder für verschiedene Sprachen zu verwenden. Dies geschieht durch die Konvertierung von Bild-IDs und Bild-URLs. Sie müssen dem Page-Builder, der Shortcodes verwendet, „mitteilen“, wie diese Konvertierung durchgeführt werden soll. Der folgende Code ist ein Beispiel dafür, was Sie in diesem Fall zur Datei wpml-config.xml hinzufügen müssen.

Beispiel für das Hinzufügen eines Page-Builder-Shortcodes zur Datei wpml-config.xml für die Bildübersetzung

<wpml-config>
  <shortcodes>
    <shortcode>
        <!-- Convert media IDs in `gallery_ids` attribute, and ignore the shortcode content -->
        <tag ignore-content="1">et_pb_gallery</tag>
        <attributes>
          <attribute type="media-ids">gallery_ids</attribute>
        <attributes>
    </shortcode>
    <shortcode>
        <!-- Convert the media URL in the content, translate some string attributes for `title` and `alt`, convert media URL in `src` attribute -->
        <tag type="media-url">et_pb_image</tag>
        <attributes>
          <attribute>title_text</attribute>
          <attribute>alt</attribute>
          <attribute type="media-url">src</attribute>
        </attributes>
    </shortcode>
  </shortcodes>
</wpml-config>

Sie können die folgenden Werte verwenden:

ignore-content – Sie können es innerhalb eines tag-Elements verwenden. Dieser Wert ist optional und kann entweder 0 oder 1 sein. Sie können dieses Attribut verwenden, um Abwärtskompatibilität für neue Medien-Shortcodes zu erreichen. Wenn der Wert auf 1 gesetzt ist, wird der Shortcode-Inhalt nicht verarbeitet.
type – Sie können es innerhalb eines tag-Elements verwenden. Sie können auch Shortcode-Inhalte, die eine Medien-URL enthalten, als optionalen Wert innerhalb von media-url verwenden.
type – Sie können es auch innerhalb eines attribute-Elements verwenden. In diesem Fall kann es einen der folgenden optionalen Werte haben:
- media-ids – eine kommagetrennte Liste von Medien-IDs.
- media-url – URL der Medien
- link – verweist auf eine andere Seite der Website, und WPML konvertiert sie automatisch in die URL der übersetzten Seite

Medien in Block-Attributen übersetzen

Sie können die Attributtypen media-url und media-ids auch mit Gutenberg-Blöcken verwenden, um Medien wie Hintergrundbilder zu übersetzen. Dies funktioniert ähnlich wie bei Shortcodes, verwendet jedoch das Element <gutenberg-block> mit verschachtelten <key>-Elementen, um type="media-url" und type="media-ids" zu definieren.

Die Verwendung dieses Elements ermöglicht es unserem Add-on WPML Medienübersetzung, Hintergrundbilder zu übersetzen.

Dies funktioniert sowohl für Gutenberg-Blöcke als auch für Divi 5. Diese Divi-Version verwendet Blöcke zum Speichern von Inhalten, sodass das Element <gutenberg-block> funktioniert, um die Medienübersetzung hinzuzufügen.

Hier ist ein Beispiel für das Hinzufügen der Medienübersetzung für Gutenberg-Block-Attribute:

<wpml-config>
  <gutenberg-blocks>
        <gutenberg-block type="divi/section" translate="1">
            <key name="module">
                <key name="decoration">
                    <key name="background">
                        <key name="desktop">
                            <key name="value">
                                <key name="image">
                                    <key name="url" type="media-url" />
                                </key>
                            </key>
                        </key>
                    </key>
                </key>
            </key>
        </gutenberg-block>
  </gutenberg-blocks>
</wpml-config>

Page-Builder-Widgets übersetzen

WPML ermöglicht es Ihnen, Page-Builder-Widgets in Ihrer Sprachkonfigurationsdatei zu registrieren. Detaillierte Informationen finden Sie auf unserer Dokumentationsseite darüber, wie Sie Page-Builder-Widgets für die Übersetzung registrieren.

Shortcode-IDs automatisch konvertieren

Ab WPML 4.5.9 können Sie die IDs von Beiträgen oder Taxonomie-Begriffen deklarieren, die sich in Shortcode-Attributen befinden. Diese IDs können dann automatisch im Frontend Ihrer Website konvertiert werden.

Ab WPML 4.8 erstreckt sich dieselbe Logik auf in Admin-Texten gespeicherte Objekt-IDs sowie auf IDs in benutzerdefinierten Feldern von Beiträgen und in Feldern für benutzerdefinierte Taxonomie-Begriffe.

Betrachten Sie zum Beispiel den folgenden Shortcode:

[foo_product_list product_ids="12,34,56"]

Sie können mit der folgenden Konfiguration deklarieren, dass das Attribut product_ids Beitrags-IDs enthält:

Deklarieren, dass das Attribut product_ids Beitrags-IDs enthält

<shortcode>
    <tag ignore-content="1">foo_product_list</tag>
    <attributes>
        <attribute type="post-ids" sub-type="product">product_ids</attribute>
    </attributes>
</shortcode>

Im Frontend wird der Shortcode automatisch konvertiert zu:

[foo_product_list product_ids="13,35,57"]

Sie können die folgenden Konfigurationsattribute verwenden:

type – entweder post-ids oder taxonomy-ids
sub-type (optional) – eine spezifische Entität des type, falls diese bereits bekannt ist. Zum Beispiel product für den benutzerdefinierten Beitragstyp Product, der von WooCommerce stammt. Wenn dies nicht definiert ist, wird die spezifische Entität erraten.

Die ID-Konvertierung ist vielseitig und versucht, sich an die meisten möglichen Formate von IDs anzupassen (einzelne ID, Liste von IDs, serialisiertes Array, JSON-codiertes Array).

Attributnamen mit einem Platzhalter

Einige Shortcodes speichern IDs in vielen Attributen mit ähnlichen Namen, zum Beispiel include_category, include_portfolio_category und include_product_cat. Eine einzige <attribute>-Zeile kann sie alle abdecken. Setzen Sie ein * in den Attributnamen:

Deklarieren aller include_- und exclude_-Attribute als Träger von Taxonomie-IDs

<shortcode>
    <tag>fusion_post_cards</tag>
    <attributes>
        <attribute type="taxonomy-ids" exclude="include_product_skus">include_*</attribute>
        <attribute type="taxonomy-ids" exclude="exclude_product_skus">exclude_*</attribute>
    </attributes>
</shortcode>

* steht für einen oder mehrere Buchstaben, Ziffern, _ oder -.
* funktioniert nur mit type="post-ids" und type="taxonomy-ids".
WPML gleicht den Rest des Namens exakt ab. WPML akzeptiert keine regulären Ausdrücke in Attributnamen.
exclude (optional) – eine kommagetrennte Liste vollständiger Attributnamen. WPML konvertiert die IDs in diesen Attributen nicht. Verwenden Sie dies für Attribute, die dem Namen entsprechen, aber keine IDs enthalten, wie z. B. include_product_skus.

Zusätzliche Ressourcen

Um mehr über die Datei wpml-config.xml zu erfahren, besuchen Sie den Leitfaden zu Sprachkonfigurationsdateien.

Zur Anpassung anderer Elemente mithilfe der Datei wpml-config.xml besuchen Sie unsere zusätzlichen Leitfäden: