WooCommerce Währungssymbol ändern: eigene Zeichen und Position
Um das Währungssymbol in WooCommerce zu ändern, wenn FOX aktiv ist, ändern Sie es in FOX und nicht in WooCommerce. FOX bestimmt, welches Symbol jeder Preis zeigt, auch bei der Basiswährung – ein Snippet oder eine WooCommerce-Einstellung hat daher keine sichtbare Wirkung. Nachfolgend erfahren Sie, wie Sie ein Symbol für eine Währung auswählen, ein in der Liste fehlendes Symbol hinzufügen (US$, CA$, HK$, S/, reiner Text wie AED), es links oder rechts vom Betrag platzieren, für Zeichen, die es noch nicht als Schriftzeichen gibt, ein Bild verwenden und ein Symbol korrigieren, das ein Theme oder ein Übersetzungs-Plugin ständig ersetzt.
Woher FOX das Währungssymbol nimmt
Jede Währung im Tab Währungen (Currencies) der FOX-Einstellungen (WooCommerce → Einstellungen → Währung) ist eine Zeile, und zwei ihrer Spalten steuern das Zeichen: Symbol und Position. Auf der Website beantwortet FOX die WooCommerce-Filter woocommerce_currency_symbol und woocommerce_price_format mit Priorität 9999 mit den Werten der Währung, die der Besucher gewählt hat. Daraus ergeben sich drei Folgen:
- Das Symbol und die Währungsposition (Currency position) unter WooCommerce → Einstellungen → Allgemein spielen keine Rolle mehr. Die Basiswährung erhält Symbol und Position wie jede andere Währung aus ihrer FOX-Zeile.
- Ein
woocommerce_currency_symbol-Snippet mit der Standardpriorität läuft vor FOX, und FOX überschreibt dessen Ergebnis. Dieses Snippet brauchen Sie überhaupt nicht. - Alles, was Preise über WooCommerce ausgibt (Produktseiten, Warenkorb, Mini-Warenkorb, Kasse, in dieser Währung versendete E-Mails), zeigt automatisch dasselbe Symbol.
Die Spalte Symbol ist eine Auswahlliste und kein Textfeld. Sie bietet die eingebaute Liste der Weltsymbole plus Ihre eigenen Symbole an; ein Zeichen, das nicht in der Liste steht, muss also zuerst hinzugefügt werden.
Ein Währungssymbol hinzufügen, das nicht in der Liste steht
Die eingebaute Liste enthält pro Währung ein Zeichen, was oft nicht reicht: $ bedeutet in Argentinien den argentinischen Peso und anderswo den US-Dollar, die indische und die pakistanische Rupie sehen in vielen Schriftarten gleich aus, und manche Märkte bevorzugen einen Code wie AED oder SAR gegenüber dem lokalen Zeichen. Fügen Sie Ihr eigenes hinzu:
- Klicken Sie im Tab Währungen (Currencies) auf Eigene Währungssymbole hinzufügen (Add custom currency symbols). Das öffnet den Tab Optionen (Options) beim Feld Eigene Währungssymbole (Custom currency symbols).
- Geben Sie die Symbole durch Kommas getrennt ein, ohne Leerzeichen nach den Kommas, zum Beispiel
US$,CA$,HK$,S/,AED. Ein Leerzeichen nach einem Komma wird Teil des nächsten Symbols. - Speichern Sie die Einstellungen. Die neuen Symbole erscheinen am Ende jeder Symbol-Auswahlliste erst nach diesem Speichern.
- Gehen Sie zurück zum Tab Währungen (Currencies), wählen Sie in der Zeile der Währung das neue Symbol aus (oder fügen Sie die Währung zuerst mit Währung hinzufügen (Append Currency) hinzu) und speichern Sie erneut.
Das Feld nimmt reinen Text an. Buchstaben, Unicode-Zeichen und kurze Codes funktionieren; HTML wird maskiert, ein <img>-Tag lässt sich daher nicht als Symbol verwenden (siehe die Bildmethode weiter unten). Lassen Sie ein eigenes Symbol so lange im Feld stehen, wie eine Währung es verwendet: Die Auswahlliste bietet nur aufgeführte Symbole an, sodass nach dem Entfernen das nächste Speichern dieser Währung stattdessen das erste Symbol der Liste zuweisen würde.
Entwickler können Symbole per Code mit dem Filter woocs_currency_symbols hinzufügen, der die gesamte Liste erhält:
/*
* FOX: add symbols to the Symbol drop-down of the currency rows.
* Child theme functions.php or a code snippets plugin.
*/
add_filter('woocs_currency_symbols', function ($symbols) {
$symbols[] = 'US$';
$symbols[] = 'CA$';
return $symbols;
});
Eine Währung ohne ISO-Code (eine Treueeinheit, Telegram Stars) braucht mehr als ein Symbol, weil WooCommerce Währungscodes validiert. Dieser Fall wird unter Eigene Währungscodes behandelt.
Position des Währungssymbols: links oder rechts, mit oder ohne Leerzeichen
Die Spalte Position jeder Zeile bietet vier Optionen:
| Option | Ergebnis für 129.99 in PLN |
|---|---|
| $P - links (left) | zł129.99 |
| P$ - rechts (right) | 129.99zł |
| $ P - links mit Leerzeichen (left space) | zł 129.99 |
| P $ - rechts mit Leerzeichen (right space) | 129.99 zł |
Das Leerzeichen ist ein geschütztes Leerzeichen, sodass das Symbol nie getrennt vom Betrag in die nächste Zeile umbricht. Jede Währung behält ihre eigene Position, sodass ein Shop $1,299.00 und 1 299,00 € nebeneinander anzeigen kann. Dezimalstellen und Trennzeichen werden in derselben Zeile festgelegt; die Konventionen der einzelnen Märkte finden Sie unter Währungssymbole der Welt.
Ist die Position in FOX richtig, aber eine Art von Preis zeigt das Zeichen weiterhin auf der falschen Seite (oft Preisspannen variabler Produkte oder Preise in einem Page-Builder-Widget), dann wird dieser Preis nicht vom Formatierer von WooCommerce erzeugt: Ein Theme-Template oder ein anderes Plugin setzt die Zeichenkette selbst zusammen. Wechseln Sie in einer Staging-Kopie zu einem Standard-Theme wie Storefront oder deaktivieren Sie die preisbezogenen Plugins einzeln, um herauszufinden, welches es ist. Zwei Einstellungen werden häufig mit der Symbolposition verwechselt. Der Tab Seite (Side) positioniert den schwebenden Umschalter. Das Feld Eigenes Preisformat (Custom price format) im Tab Optionen (Options) umschließt den gesamten formatierten Preis: __PRICE__ (__CODE__) gibt den Preis mit seinem Symbol und dann den Währungscode aus, zum Beispiel 129.99 zł (PLN), verschiebt aber nicht das Symbol.
Ein anderes Symbol anzeigen, ohne Preise umzurechnen
Manchmal soll nur ein anderes Zeichen für eine Region erscheinen, bei gleichen Zahlen. Fügen Sie die Währung hinzu, setzen Sie ihren Kurs auf 1 und tragen Sie 1 in beide Felder Untergrenze (Floor) und Obergrenze (Ceiling) ihrer Spalte Kurs-Unter-/Obergrenze (Rate floor/ceiling) ein. Automatische Kursaktualisierungen können den Kurs dann nicht von 1 wegbewegen, und das Umschalten auf diese Währung ändert nur das Symbol (und den Währungscode, falls der Shop Kunden in der gewählten Währung bezahlen lässt).
Symbole ohne Schriftzeichen: das neue Dirham-Zeichen und andere Bilder
Manche Zeichen, etwa das 2025 von den VAE eingeführte Dirham-Zeichen, sind noch nicht als Schriftzeichen verfügbar, das gängige Schriftarten darstellen können. Es gibt sie nur als Bild. Die zuverlässige Lösung ist ein Textsymbol, das überall funktioniert (AED, Dhs), und ein kleines Skript, das diesen Text im Browser des Besuchers durch das Bild ersetzt:
/*
* FOX: show an image instead of a text currency symbol.
* Child theme functions.php or a code snippets plugin.
*/
add_action('wp_footer', function () {
?>
<script>
(function () {
var symbolText = 'AED'; // the text symbol selected for the currency in FOX
var imageUrl = '/wp-content/uploads/dirham-sign.svg'; // your image in the Media Library
function swapSymbols() {
document.querySelectorAll('.woocommerce-Price-currencySymbol').forEach(function (el) {
if (el.textContent.trim() === symbolText) {
el.innerHTML = '<img src="' + imageUrl + '" alt="' + symbolText + '" class="fox-symbol-img">';
}
});
}
swapSymbols();
// prices added later: mini cart, checkout updates, AJAX product lists
new MutationObserver(swapSymbols).observe(document.body, {childList: true, subtree: true});
})();
</script>
<style>
.fox-symbol-img { display: inline-block; height: 0.8em; width: auto; margin: 0; vertical-align: baseline; }
</style>
<?php
}, 999);
Das Skript ändert jedes Element woocommerce-Price-currencySymbol, also die Stelle, an der WooCommerce in jedem formatierten Preis das Zeichen ausgibt. Das Textsymbol bleibt dort erhalten, wo kein Browser-Skript läuft oder wo Preise anders gezeichnet werden: in Bestell-E-Mails, PDF-Rechnungen, im Admin-Bereich, in der Auswahlliste des Umschalters (eine Listenoption kann kein Bild enthalten) und im blockbasierten Warenkorb und Checkout, die das Symbol als Teil des Betragstexts ausgeben. Deshalb sollte das Textsymbol eines sein, das Ihre Kunden auch für sich allein verstehen.
Ein anderes Symbol pro Sprache
Auf einer mehrsprachigen Website möchten Sie vielleicht د.إ in der arabischen Version und AED in der englischen. FOX leitet die Währungsdaten im Frontend durch den Filter woocs_currency_data_manipulation, sodass sich das Symbol pro Anfrage ändern lässt. Die Einstellungsseite liest die Währungen ohne diesen Filter, Ihre gespeicherten Symbole bleiben also unberührt.
/*
* FOX: currency symbol per site language (WPML).
* With Polylang use: $lang = function_exists('pll_current_language') ? pll_current_language() : '';
* Child theme functions.php or a code snippets plugin.
*/
add_filter('woocs_currency_data_manipulation', function ($currencies) {
$lang = apply_filters('wpml_current_language', null);
if ($lang === 'ar' && isset($currencies['AED'])) {
$currencies['AED']['symbol'] = 'د.إ';
}
return $currencies;
}, 20);
Wie Sie die Währung selbst beim Sprachwechsel umschalten, lesen Sie unter So schalten Sie die Währung mit der Sprache in WPML um.
Auf der Website erscheint das falsche Symbol
Ein Übersetzungs-Plugin schreibt das Symbol um
FOX übersetzt keine Symbole. Plugins für maschinelle Übersetzung und die Übersetzungsfunktion des Browsers tun es: Sie lesen SEK als Wort und machen daraus kr oder übersetzen ein Textsymbol in eine andere Sprache. Schließen Sie Preise in den Einstellungen des Übersetzers von der Übersetzung aus (die meisten haben eine Option „nicht übersetzen“ oder eine Ausschlussliste, die CSS-Selektoren annimmt): .woocommerce-Price-amount deckt jeden Preis ab, den WooCommerce ausgibt, .woocs_price_code ist der FOX-Wrapper um Produktpreise, und .woocs_price_info ist der FOX-Preisinfo-Block.
Das Symbol erscheint als leeres Kästchen oder als ein anderes Zeichen
Die Schriftart des Themes hat kein Glyph für dieses Zeichen, und der Browser weicht auf eine andere Schriftart aus oder zeichnet ein Kästchen. Das kommt bei neueren Zeichen sowie bei Rupie und Hrywnja häufig vor. Wählen Sie eine Schriftart, die das Zeichen enthält, oder stellen Sie die Währung über das Feld für eigene Symbole auf ein Textsymbol wie Rs oder UAH um.
Das Symbol ändert sich überhaupt nicht
- Das neue Symbol wurde im Feld für eigene Symbole eingetippt, aber nicht in der Währungszeile ausgewählt, oder die Einstellungen wurden nach der Auswahl nicht gespeichert.
- Ein Seiten-Cache liefert weiterhin das HTML aus, das vor der Änderung erzeugt wurde. Leeren Sie den Website-Cache und jeden CDN-Cache und prüfen Sie dann in einem privaten Fenster.
- Das Theme oder ein Plugin gibt Preise aus einem eigenen Template mit fest eingetragenem Zeichen aus. Stimmt das Zeichen mit einem Standard-Theme, liegt die Ursache beim Theme.
Ist das Symbol in den FOX-Einstellungen richtig und auf einem Standard-Theme mit deaktivierten anderen Plugins trotzdem falsch, beschreiben Sie die Seite und die Währung im FOX-Support-Forum.