Shopify ve WooCommerce ürün sayfalarına AR nasıl eklenir
Kısaca: Bir ürün sayfasına AR eklemek için ürünün gerçek boyutunda GLB (Android ve web) ve USDZ (iPhone) olarak 3D modeline ihtiyacınız var. Shopify 3D modelleri ürün medyası olarak destekler; WooCommerce ya da başka bir sitede ücretsiz model-viewer bileşenini iki dosyayla birlikte yerleştirirsiniz.
Adım 1: 3D dosyaları hazırlayın
- Düz ürünler (sanat baskıları, posterler, kanvaslar, halılar, duvar kağıdı numuneleri): ürün fotoğrafını jpgtousdz'ye yükleyin ve gerçek genişlik ya da yüksekliği girin. O boyutta GLB ve USDZ alırsınız.
- Nesneler (vazolar, sandalyeler, ayakkabılar): ürünün etrafında yavaşça bir video çekin ve videodan 3D'yi kullanın, gerçek yüksekliği girin.
- Ürün sayfası hızlı kalsın diye her dosyayı küçük tutun (dokular 2048 piksel veya altında).
Adım 2a: Shopify
- Shopify yönetim panelinde ürünü açın, Medya bölümüne gidin ve GLB dosyasını 3D model olarak yükleyin.
- Shopify onu kendi 3D görüntüleyicisiyle gösterir; destekleyen temalar telefonlarda Alanında Gör düğmesi ekler.
- Ürünü bir iPhone'da ve bir Android telefonda kontrol edin. Güncel dosya boyutu sınırları ve desteklenen temalar Shopify yardım merkezinde listelenir.
Adım 2b: WooCommerce, WordPress veya herhangi bir web sitesi
GLB ve USDZ dosyalarını medya kitaplığınıza yükleyin, ardından ürün açıklamasına model-viewer içeren bir Özel HTML bloğu ekleyin:
<script type="module" src="https://unpkg.com/@google/model-viewer/dist/model-viewer.min.js"></script>
<model-viewer src="/media/print-50x70.glb" ios-src="/media/print-50x70.usdz"
ar ar-modes="quick-look scene-viewer webxr" ar-placement="wall"
camera-controls alt="50 x 70 cm baskı"></model-viewer>Adım 2c: kod gerektirmeyen seçenek
Sayfayı düzenleyemiyorsanız, ürünün jpgtousdz AR görüntüleyici bağlantısına giden bir düğme ya da QR kod ekleyin. iPhone ve Android'de uygulama olmadan AR'da açılır.
Yayına almadan önce kontrol listesi
| Kontrol | Neden |
|---|---|
| Gerçek boyut doğru | Müşteriler boyuta AR'dan karar verir; yanlış ölçek iadelere yol açar. |
| Yerleşim doğru (duvar veya zemin) | Sanat eserleri duvara, mobilya zemine gider. |
| iPhone ve Android'de çalışıyor | Her biri farklı dosya kullanır. |
| Alt metin tanımlı | Erişilebilirlik ve arama. |
Hemen deneyin
Bir fotoğrafı birkaç saniyede gerçek boyutlu USDZ ve GLB'ye, bir videoyu da 3D modele çevirin. İlk fotoğraf dönüştürmeniz ücretsiz.
Ürün Fotoğrafı ARSSS
Shopify için USDZ gerekir mi?
GLB'yi Shopify'a yükleyin; gösterimi o halleder. Temanız ya da başka bir kanal gerektirirse diye bir USDZ'yi de saklayın.
WooCommerce AR'ı kendiliğinden destekler mi?
Hayır. Bir eklenti kullanın ya da yukarıda gösterildiği gibi model-viewer'ı GLB ve USDZ dosyalarıyla yerleştirin.
Maliyeti ne kadar?
model-viewer ücretsizdir. jpgtousdz'de fotoğraftan AR dönüştürme ilk seferde ücretsiz, sonra bir planın parçasıdır. API'nin maliyeti fotoğraf başına $0.15, video 3D modeli başına $1.50.