Schnelle Antwort
So fügen Sie eine 360-Produktansicht zu Shopify hinzu: Veröffentlichen Sie einen Spin in Spinnify Studio unter demselben Namen wie Ihre Variante SKU, installieren Sie Spinnify Shopify app, verbinden Sie den Store unter Einstellungen → Integrationen, fügen Sie den Block Spinnify 3D Button zu Ihrer Produktvorlage hinzu und testen Sie ihn auf einer Live-Produkt-URL. Das Widget wird geladen, wenn der Käufer darauf tippt, damit PageSpeed gesund bleibt.
Shopify Händler suchen nach „360 Product Viewer shopify“, wenn flache Galeriefotos nicht ausreichen – aber sie stellen sich auch zuerst praktische Fragen: Welche Bildgröße erwartet Shopify und wird ein anderes Skript das Theme verlangsamen? Dieser Leitfaden beantwortet beides. Sie sehen die empfohlenen Shopify-Produktbildabmessungen für Ihre Standbilder, wie Spinnify eine 360°-Ebene hinzufügt, ohne Frames erneut in Shopify-Dateien hochzuladen, und den genauen Match-Field- und Themenblock-Ablauf, den wir heute ausliefern.
Was ist eine 360-Produktansicht auf Shopify?
Eine 360-Produktansicht auf Shopify ist eine interaktive Drehung auf der Produktdetailseite (PDP): Der Käufer zieht nach links oder rechts, um den realen Artikel aus vielen Blickwinkeln zu betrachten. Es handelt sich nicht um ein schweres 3D-Netz oder eine Videodatei, die in Shopify gehostet wird. Spinnify stellt optimierte WebP/AVIF-Frames aus seinem CDN bereit, wenn jemand auf **3D-Ansicht** tippt – das gleiche leichte Flipbook-Muster, das auf benutzerdefinierten HTML-Storefronts verwendet wird.
Shopify Produktbildgröße (und wo 360° passt)
Abfragen wie „shopify Produktbildgröße“ sind beliebt, weil Händler gestochen scharfe Standbilder wünschen, bevor sie etwas Interaktives hinzufügen. Shopify empfiehlt quadratische Produktbilder mit etwa 2048 × 2048 Pixeln für die Hauptgalerie; Halten Sie das Dateigewicht angemessen. Ihre 360°-Sequenz befindet sich in Spinnify – nicht in Dutzenden zusätzlicher Galerie-Slots – Sie kämpfen also nicht gegen die Bilderbeschränkung von Shopify pro Produkt.
- Hauptgalerie-Standbilder: bis zu 2048 × 2048 Pixel im Quadrat (Shopify-Richtlinie).
- Spinnify Aufnahme: 4:3-Querformatserie (bis zu 36 Frames) aus Studio oder der mobilen App.
- Optionale mobile Serie: 3:4-Porträtpass für Käufer, die zuerst das Telefon kaufen.
- Storefront-Bereitstellung: CDN-verkleinertes WebP/AVIF – keine manuelle Größenänderung pro Frame in Shopify.
Warum 360° vor einer anderen Shopify-App hinzufügen?
Rich Spins reduzieren das Rätselraten zu Textur, Skalierung und Finish – nützlich, wenn Retouren auf „Sah online anders aus“ zurückgehen. In NRF-Umfragen liegen die Rücklaufquoten der Branche oft bei etwa 19 %; Messen Sie Ihre SKUs nach dem Start. Bei Problemen mit der Seitenstärke lesen Sie unseren Leitfaden Shopify 360° ohne Beeinträchtigung der PageSpeed-Anleitung – das Widget lädt bei Interaktion langsam.
| Typische 360 Shopify-Apps | Spinnify 360° Studio | |
|---|---|---|
| Aufnahme | Laden Sie ZIPs hoch oder mieten Sie ein Studio | Workflow mit mobiler App und Plattenspieler |
| Hosting | Händler-CDN oder App-Server | Spinnify CDN + Studio |
| Matching | Manuelle Produktauswahl | SKU / JSON-LD AUTO / URL |
| Abrechnung | Separate App-Rechnung | Shopify App-Preise oder SaaS |
| Seitengewicht | Variiert | Lazy-loaded 3D-Steuerung |
Spinnify mit Shopify verbinden (Übersicht)
Die vollständige Checkliste befindet sich auf unserem öffentlichen Shopify-Integrationsleitfaden. Zusammenfassung: Erstellen Sie ein veröffentlichtes Studio-Produkt, dessen Name mit der Shopify-Variante SKU (oder dem von Ihnen gewählten Übereinstimmungsfeld) übereinstimmt, installieren Sie **Spinnify 360° Studio** aus dem Shopify App Store, verbinden Sie den Shop unter **Dashboard → Einstellungen → Integrationen**, wählen Sie das Übereinstimmungsfeld und legen Sie den **Spinnify 3D Button** App-Block auf der Produktvorlage im Theme-Editor ab.
Step 1 – Veröffentlichen Sie den Spin in Studio
Melden Sie sich bei Spinnify Studio an. Erstellen Sie ein Produkt mit dem Namen, der genau dem Wert entspricht, den Shopify sendet – normalerweise die Variante SKU. Laden Sie die Spin-Sequenz hoch oder erfassen Sie sie, veröffentlichen Sie sie und lassen Sie **Aktiv** aktiviert. Unveröffentlichte oder leere Produkte werden niemals in der Storefront als **3D-Ansicht** angezeigt.
Schritt 2 – Installieren Sie die Shopify-App und verbinden Sie
In Shopify Admin → Apps, installieren Sie **Spinnify 360° Studio**. Öffnen Sie in Spinnify (angemeldet) Einstellungen → Integrationen → Shopify, geben Sie `your-store.myshopify.com` (nicht die benutzerdefinierte Domäne) ein und genehmigen Sie OAuth. Die Abrechnung kann über Shopify App-Preise nach der Verbindung erfolgen – Stripe-Checkout in Studio ist für dieses Konto deaktiviert, um eine doppelte Abrechnung zu vermeiden.
Schritt 3 – Themenblock im PDP
Online Store → Themen → Anpassen → Produktvorlage öffnen → Block hinzufügen → **Spinnify 3D Button**. Speichern Sie und testen Sie dann eine Live-Produkt-URL, deren Übereinstimmungsfeldwert einem veröffentlichten Studio-Produktnamen entspricht. Die Vorschau des Theme-Editors allein reicht nicht aus – bestätigen Sie dies im Storefront.
Fehler, die Händler einmal machen
- Studio-Produktname ≠ Shopify SKU – Schaltfläche erscheint nie.
- Produkt nicht veröffentlicht oder `is_active` in Studio deaktiviert.
- Testen nur in der Theme-Vorschau, nicht auf der Live-PDP-URL.
- Verbinden mit `www.example.com` anstelle von `store.myshopify.com`.
- Hochladen von 360 Frames in Shopify-Dateien anstelle von Spinnify – duplizierter Workflow.
Fazit
Das Hinzufügen einer 360-Grad-Produktansicht zu Shopify ist eher ein Matching-Problem als ein Codierungsproblem: Spins in Studio veröffentlichen, den Store einmal verbinden, SKUs ausrichten, den App-Block hinzufügen. Beginnen Sie mit Ihrem Helden SKU, überprüfen Sie die **3D-Ansicht** auf Mobilgeräten und übertragen Sie dann den gleichen Erfassungsworkflow auf den Rest des Katalogs.
Weiter lautet: warehouse 360°-Workflow, Spinnify vs. Sirv, vollständiger Integrationsleitfaden.
