Shopify App Dokumentation
Alles, was Sie zur Einrichtung und Anpassung der Währungsumrechnung in Ihrem Shopify-Shop benötigen
Inhaltsverzeichnis
1 Installation
Aus dem Shopify App Store installieren
- Besuchen Sie die Currency.Wiki-App-Seite im Shopify App Store
- Klicken Sie auf 'App hinzufügen' und autorisieren Sie die Installation
- Die App öffnet sich und führt Sie durch den Einrichtungsassistenten
- Schließen Sie den Einrichtungsassistenten ab, um mit der Preisumrechnung zu starten
Tipp: Der Einrichtungsassistent dauert etwa 2 Minuten und führt Sie durch jeden Schritt.
2 Einrichtungsassistent
Der Einrichtungsassistent hilft Ihnen, die App korrekt zu konfigurieren. Er führt Sie durch die Aktualisierung Ihres Währungsformats und das Aktivieren der App-Einbettung.
Schritt 1: Willkommen
Überprüfen Sie, was der Einrichtungsprozess beinhaltet, und klicken Sie auf 'Los geht's'.
Schritt 2: Währungsformat aktualisieren
Gehen Sie zu Shopify Admin → Einstellungen → Allgemein → Shop-Standards. Finden Sie Ihre Währung und klicken Sie auf das Drei-Punkte-Menü → 'Währungsformatierung ändern'. Aktualisieren Sie die HTML-Felder mit unserer Wrapper-Klasse:
HTML mit Währung:
<span class="cwiki">${{amount}} USD</span>
HTML ohne Währung:
<span class="cwiki">${{amount}}</span>
Wichtig: Die cwiki-Wrapper-Klasse ist essenziell. Sie zeigt unserer App, welche Elemente auf Ihrer Seite Preise sind, damit nur echte Preise und keine Telefonnummern oder Bestellnummern umgerechnet werden.
Schritt 3: App-Einbettung aktivieren
Aktivieren Sie die App im Bereich App Embeds Ihres Themes:
- Gehen Sie zu Onlineshop → Themes → Anpassen
- Suchen Sie in der linken Seitenleiste nach 'App Embeds'
- Finden Sie 'Currency.Wiki App' und schalten Sie sie EIN
- Klicken Sie auf Speichern im Theme-Editor
Schritt 4: Einrichtung überprüfen
Klicken Sie auf 'Shop scannen', um die Einrichtung zu überprüfen. Der Assistent prüft die cwiki-Wrapper-Klasse und die App-Einbettung. Bei Erfolg sind Sie startklar!
3 Widget-Stile
Wählen Sie aus 6 Widget-Stilen, die zu Ihrem Shop-Design passen. Jeder Stil kann mit Ihren Markenfarben angepasst werden.
Minimal-Dropdown
Kompakte Header-Integration mit einfacher Dropdown-Liste. Am besten für die Platzierung oben rechts.
Schwebende Pill
Mobilfreundlicher, schwebender Button mit ausklappbarem Panel. Ideal für mobile Shops. Positioniert in den Ecken.
Seitenleisten-Drawer
Vollflächiges, ausfahrbares Panel mit Suchfunktion. Perfekt für Shops mit vielen Währungen.
Modal-Popup
Zentrierter Overlay mit Rasterlayout. Macht die Währungsauswahl zum Fokus.
Inline-Tab-Umschalter
Horizontale Tabs für beliebte Währungen. Schnelles Umschalten ohne Menüs.
Ecken-Badge
Minimalistisches Ecksymbol, das sich beim Klicken erweitert. Am unauffälligsten für klare Designs.
Tipp: Verwenden Sie die Widget-Einstellungen in Ihrer App-Administration, um alle Stile mit Ihren Shop-Farben vorzuschauen.
4 Admin-Dashboard
Das Admin-Dashboard gibt Ihnen volle Kontrolle darüber, wie die Währungsumrechnung in Ihrem Shop funktioniert.
Dashboard-Startseite
Schalten Sie das Widget ein/aus, sehen Sie Umrechnungsstatistiken und eine Live-Vorschau Ihres Widgets.
Widget-Einstellungen
Wählen Sie Widget-Stil, Position, Farben, Größe, Rahmenradius und Flaggenoptionen.
Währungsverwaltung
Aktivieren/deaktivieren Sie Währungen, ordnen Sie die Liste neu, konfigurieren Sie das Verhalten der automatischen Erkennung und legen Sie Wechselkurseinstellungen fest.
Analytics
Sehen Sie Umrechnungscharts, Top-Währungen und die Verteilung Ihrer internationalen Kunden.
Theme & Erscheinungsbild
Wählen Sie Theme-Modus (auto, hell, dunkel, individuell), legen Sie Farben fest, aktivieren Sie Glassmorphism-Effekte und konfigurieren Sie das Verhalten des Dunkelmodus.
Checkout-Hinweis
Aktivieren Sie eine Nachricht auf Warenkorb-/Checkout-Seiten, um Kunden über die Checkout-Währung zu informieren.
5 Erweiterte Einstellungen
Erweiterte Einstellungen geben Pro-Nutzern mehr Kontrolle über Preisformatierung und Umrechnungsverhalten.
Preisformatierung (Pro)
- Dezimalstellen - Steuern Sie, wie viele Dezimalstellen angezeigt werden (0-6).
- Zahlenformat - Wählen Sie das Format (Auto, US, EU, Indisch, Space•Dot, Space•Comma).
- Symbolposition - Währungssymbol vor oder nach dem Betrag platzieren, oder automatisch je nach Währung.
- Rundung - Standard, immer aufrunden, immer abrunden oder keine Rundung. Option zum Runden auf .99.
Theme-Integration (Pro)
Betten Sie das Widget oder den Warenkorb-Hinweis manuell überall in Ihr Theme ein – mit diesen HTML-Snippets:
Widget-Einbettung (in header.liquid oder beliebigem Abschnitt):
<div class="cwiki-widget"></div>
Warenkorb-Hinweis (in cart.liquid einfügen):
<div class="cwiki-banner"></div>
Entwickleroptionen (Pro)
- Style-Overrides - Fügen Sie benutzerdefiniertes CSS ein, um das Widget-Design anzupassen.
- Click-Listener - Preise erneut umrechnen, wenn bestimmte Elemente angeklickt werden (z.B. Größenwähler, Produktoptionen).
- Zusätzliche Preiselemente - Zielen Sie auf weitere Preiselemente außerhalb des Standard-.cwiki-Wrapper.
- URL-Muster - Erneut nach Preisen suchen, wenn die URL bestimmte Zeichenfolgen enthält (für AJAX-Inhalte, Endlos-Scroll).
- Umrechnungsverzögerung - Warten Sie vor der Umrechnung von Preisen (für Inhalte, die nach Seitenladezeit erscheinen).
Achtung: Diese Optionen sind für fortgeschrittene Nutzer. Testen Sie auf einem Vorschau-Theme, bevor Sie veröffentlichen.
6 Fehlerbehebung
Preise werden nicht umgerechnet?
Stellen Sie sicher, dass die cwiki-Wrapper-Klasse in Ihren Währungseinstellungen enthalten ist. Gehen Sie zu Einstellungen → Allgemein → Shop-Standards und prüfen Sie die HTML-Formatierung. Vergewissern Sie sich außerdem, dass die App-Einbettung im Theme-Editor aktiviert ist.
Widget wird nicht angezeigt?
Prüfen Sie, ob die App-Einbettung im Bereich App Embeds Ihres Themes aktiviert ist. Öffnen Sie ggf. den Theme-Editor, suchen Sie App Embeds und stellen Sie sicher, dass Currency.Wiki aktiviert ist. Speichern und Shop aktualisieren.
Preise flackern beim Laden?
Unsere App ist für flackerfreies Laden optimiert. Wenn Sie Flackern sehen, prüfen Sie, ob Caching-Plugins stören. Stellen Sie auch sicher, dass die App-Einbettung im Head-Bereich Ihres Themes geladen wird.
Falsche Währung erkannt?
Die Geo-Erkennung basiert auf der IP-Adresse des Besuchers. VPNs oder Firmennetzwerke können die Erkennung beeinflussen. Besucher können immer manuell ihre bevorzugte Währung wählen. Sie können auch eine Standard-Fallback-Währung in den Einstellungen festlegen.
Widget passt nicht zu meinem Theme?
Verwenden Sie die Theme & Erscheinungsbild-Einstellungen, um Farben anzupassen, oder aktivieren Sie den Automodus, um die Theme-Farben automatisch zu erkennen. Sie können auch benutzerdefiniertes CSS in den erweiterten Einstellungen verwenden.
Brauchen Sie Hilfe?
Unser Support-Team hilft Ihnen gerne bei allen Fragen zur Einrichtung oder Konfiguration.
