Daha fazla bilgi

E-ticaret entegrasyonu - tasarımdan siparişe

Alter Product'ı sitenize yerleştirin: WordPress + WooCommerce veya API

Sitenize 3D gösterim, varyant seçimi ve ürün kişiselleştirme ekleyin. Müşteri mağazanızda ürünü inceler, seçenekleri belirler ve tasarımını hazırlar; siz de ürünleri ve siparişleri kendi sisteminizde yönetirsiniz.

Entegrasyon kodu yazmadan kurulum yapmak için WooCommerce yüklü WordPress eklentisini seçin. Kendi sitenizi veya mağazanızı geliştiriyorsanız gömülü araçları Public API ve postMessage olaylarıyla arka ucunuza ve sepetinize bağlayın.

Görseller, kayıtlardaki ve eklenti panelindeki gerçek arayüzü gösterir. Görüntülerdeki düğme adları İngilizcedir; aracın görünümü mağaza ayarlarına bağlıdır.

Ayrıntılı eklenti kurulum talimatlarını mı arıyorsunuz?WordPress + WooCommerce belgelerini açın: gereksinimler, kalıcı bağlantılar, Auto Connect ve sorun giderme.

Kişiselleştirme sunan bir mağaza için iki yol

Aynı ürün tasarımını gösterim, seçenek yapılandırması veya baskı düzenleme için hazırlayabilirsiniz. Mağazaya bağlanma yöntemini sitenize ve geliştirme kapsamınıza göre seçin.

Eklenti mi, özel entegrasyon mu?

Eklenti, WordPress ve WooCommerce için hazır destek sağlar. API ile başka bir platforma, headless uygulamaya veya mevcut sipariş sistemine kendi bağlantınızı geliştirebilirsiniz.

Entegrasyonda hazır sunulanlar ve sizin hazırlayacaklarınız
AlanWordPress + WooCommerceAPI üzerinden kendi sisteminiz
BaşlatmaWordPress panelinde eklenti kurulumu ve bağlantı sihirbazı.Arka uç bağlantısının ve siteye yerleştirmenin geliştirilmesi.
Ürünler ve varyantlarTasarımın WooCommerce ürününe atanması ve varyantların eşitlenmesi.Ürün ve seçenek kimliklerinin mağazanızdaki verilerle ilişkilendirilmesi.
Sepet ve siparişlerWooCommerce içinde yapılandırma, müşteri tasarımı ve önizlemeler için hazır işlevler.Gömülü aracın olaylarının işlenmesi ve siparişlerin kendi sisteminizde eşitlenmesi.
Dosyalar ve varlıklarWordPress sunucusunda yerel kitaplık, tasarımlar ve sipariş dosyaları.Seçilen entegrasyon moduna göre veri saklama ve erişim. Kendi depolama alanınızı kullanıyorsanız desteğini de sizin uygulamanız gerekir.

Müşteriye hangi aracı sunmalısınız?

Aracı, müşterinin sitede yapmasını istediğiniz işleme göre seçin. Tasarımı ve kişiselleştirme kurallarını önceden Designer'da hazırlayın.

Viewer: ürünü inceleyin

3D modelin ve görünümünün sunumu. Baskı düzenlemesini açmadan ürünü farklı açılardan göstermek istediğinizde kullanışlıdır.

Configurator: varyant seçin

Boyut, renk veya malzeme gibi önceden hazırlanmış ürün seçeneklerinin seçimi. Müşteri değişikliği modelde görür ve yapılandırmayı sepete aktarır.

Customizer: kendi baskınızı hazırlayın

Sunulan araçlar, görseller, metinler ve şablonlarla kişiselleştirme. Müşterinin kaydedilen tasarımı sepet veya sipariş kalemiyle ilişkilendirilir.

Designer: ürünlerinizi hazırlayın

Mağaza sahibinin çalışma alanı. Kompozisyonu, varyantları, baskı alanlarını ve müşteri araçlarının ayarlarını burada hazırlarsınız. Yönetim amaçlı düzenleme erişimi, mağaza kullanımından ayrıdır.

WordPress + WooCommerce: kurulumdan hazır ürüne

Alter Product bir WordPress eklentisi sunar. Mağaza entegrasyonu için WooCommerce'in yüklü ve etkin olması gerekir. Standart ayarları kendi API ve sepet işlemlerinizi geliştirmeden panelde yaparsınız.

Gereksinimler: WordPress, WooCommerce, HTTPS ve Business planı

Alter Product'ı kendi sitenize yerleştirmek için etkin bir Business aboneliği veya bu özelliği içeren daha üst bir plan gerekir. Bu gereksinim hem WordPress + WooCommerce eklentisi hem de özel API entegrasyonu için geçerlidir. Personal FREE ve Personal planları mağazanıza yerleştirme özelliğini içermez.

Eklenti yolunda, WooCommerce yüklü ve etkin bir WordPress kurulumu ile Alter Product hesabı hazırlayın. Dosyaları kendi barındırma alanınızda saklamak gerekli aboneliğin yerine geçmez: uygulamayı sunan ve başlatılmasını yetkilendiren yine Alter Product'tır.

  • Mağazanızı alan adına uygun, geçerli bir SSL/TLS sertifikasıyla HTTPS üzerinden çalıştırın. Gömülü araçların herkese açık sitede düzgün çalışması için bu gereklidir.
  • Kurulum talimatlarına göre WordPress'in okunabilir kalıcı bağlantılarını etkinleştirin.
  • Modeller, görseller, tasarımlar ve sipariş dosyaları için barındırma alanında yer ayırın. Mağaza kitaplığı sunucunuzun kaynaklarını kullanır.

HTTPS ve SSL/TLS sertifikası neden gerekli?

Alter Product, mağaza sayfasındaki bir iframe içinde çalışır. Sayfa güvenli bir bağlam sağlamıyorsa tarayıcılar uygulamanın kullandığı bazı işlevleri kısıtlar. HTTPS bağlantıyı şifreler, geçerli sertifika ise tarayıcının alan adını doğrulamasını sağlar.

Tarayıcı, iframe'i içeren sayfayı da kontrol eder. Bu nedenle mağaza HTTP üzerinden çalışıyorsa Alter Product uygulamasının HTTPS adresi tek başına yeterli değildir. Aracı yerleştirdiğiniz kendi sayfanız da HTTPS kullanmalıdır. Bu, tarayıcıların gömülü uygulamalar için güvenlik kurallarından kaynaklanır.

  1. Barındırma sağlayıcınızda SSL/TLS sertifikasını etkinleştirin ve mağaza alan adı için geçerli olduğunu doğrulayın.
  2. WordPress site adreslerini ve entegrasyon alan adını HTTPS olarak ayarlayın. HTTP'den HTTPS'ye yönlendirmeyi etkinleştirin.
  3. Ürün sayfasını HTTPS üzerinden açın; tarayıcının sertifika veya HTTP üzerinden yüklenen kaynaklar hakkında sorun bildirmediğini kontrol edin.

Mağazayı Auto Connect ile bağlayın

Otomatik bağlantı, Alter Product hesabının yetkilendirilmesi ve mağaza kurulumu boyunca size yol gösterir. Bu yöntemde API anahtarlarını elle taşımanız gerekmez.

  1. WordPress'te Eklentiler → Yeni Eklenti Ekle bölümüne gidin, Alter Product'ı bulun, yükleyin ve etkinleştirin.
  2. Alter Product panelini açıp Auto Connect'i seçin. Doğru Alter Product hesabına giriş yapın, mağazayı kontrol edin ve bağlantıyı onaylayın.
  3. WordPress'e dönün. Başlangıç modelini seçin ve gerekli varlıkları indirin. İndirme ile hazır olma kontrollerinin bitmesini bekleyin.
  4. Oluşturulan araç sayfalarını ve görüntüleme ayarlarını kontrol ettikten sonra ürünü hazırlamaya geçin.
WordPress panelinde Auto connect düğmeli Connect Alter Product ekranı
Hesap bağlantısını WordPress panelinden başlatırsınız. Entegrasyon tanıtımından alınan görüntü otomatik bağlantı seçeneğini gösterir.

Tasarımı atayın ve varyantları eşitleyin

WooCommerce ürün düzenleyicisinde Alter Product sekmesini açın. Yeni bir tasarım oluşturun veya mevcut olanı seçin, ardından Designer'ı açın. Bu ürün için baskıyı, kullanılabilir seçenekleri ve baskı alanlarını ayarlayın.

  1. Varyasyonlu ürünlerde boyut gibi nitelikleri ve bunlara karşılık gelen WooCommerce varyantlarını hazırlayın.
  2. Designer'da Sync variants kullanarak tasarım seçeneklerini ürün varyantlarına bağlayın. WooCommerce'de varyant niteliği olmayan varsayılan seçimleri de kontrol edin.
  3. Tasarımı ve ürünü kaydedin. Sayfada gösterilecek aracı ve açılma biçimini seçin.
  4. Sonucu ürün sayfasında kontrol edin: birkaç varyant seçin, bir tasarım hazırlayın ve sepete geçin.
WooCommerce ürününden açılan Designer ve malzeme ile baskı yöntemi ayarlarını içeren Sync variants penceresi
Eşitleme, WooCommerce ürün varyantlarını tasarım seçenekleriyle ilişkilendirir. Görüntüde Sync onayından önce varsayılan ayarlar seçilmektedir.

WordPress sunucunuzdaki kitaplığınız

Modelleri, tasarımları, görselleri ve sipariş dosyalarını WordPress'in çalıştığı barındırma alanında saklarsınız. Yerel olarak eklenen varlıklar mağazanız içindir; bu işlem onları diğer mağazaların kullanacağı herkese açık Alter Product kitaplığına eklemez.

Yerel olarak neler saklanır?

Eklenti; model, kitaplık, tasarım, mockup ve sipariş dosyalarını WordPress alanına kaydeder. Model oluşturucu projelerinin ve revizyonlarının verileri de bu kurulumun veritabanında saklanır.

Kendi malzemelerinizi ekleyebilir ve Alter Product'tan seçtiğiniz varlıkları içe aktarabilirsiniz. İndirdikten sonra yerel kopyayı kullanırsınız. İçe aktarma, güncelleme kontrolü ve yeni sürüm indirme ayrı işlemlerdir.

Mağazanız için gereken malzemeleri nerede hazırlarsınız?
Paneldeki bölümYapılan işlemler
VarlıklarModelleri, görselleri, şablonları, arka planları, logoları, dokuları ve ortamları yönetirsiniz. Kullanılabilir ekleme yöntemleri varlık türüne göre değişir.
Model oluşturucuŞablonlardan yerel projeler oluşturur ve oluşturucuyla ilişkili modeller üzerinde çalışırsınız.
Ürün tasarımları / DesignerTasarımı hazırlar veya içe aktarır, düzenler ve mağaza ürününe atarsınız.
WooCommerce siparişleriKaydedilen müşteri tasarımlarını, önizlemeleri ve siparişi tamamlamak için gereken dosyaları kullanırsınız.
WordPress'te model kitaplığı ve içe aktarma seçenekleri bulunan Alter Product Varlıklar paneli
Mağaza kitaplığını WordPress panelinden yönetirsiniz. İçe aktarılan varlıkları ve kendi malzemelerinizi yerel tasarımlarda kullanırsınız.

Ürünlere ve müşteri araçlarına nelerin ekleneceğini siz seçersiniz

Kitaplığı ve tasarımları uygun yetkilerle WordPress panelinde yönetirsiniz. Müşteriler, kitaplığın yönetim amaçlı düzenlemesine erişmeden mağazada sunulan araçları ve malzemeleri kullanır.

Hangi tasarımın ürüne atanacağına, gömülü aracın nerede gösterileceğine ve hangi kişiselleştirme olanaklarının sunulacağına siz karar verirsiniz. Gömülü Customizer kitaplığındaki varlıkları da kontrol edin. Tasarım atandıktan sonra ürün sayfasındaki gömülü gösterim varsayılan olarak etkin olabilir; görüntülemeyi ürün ayarlarından yönetirsiniz.

Yerel dosyalar, gömülü Alter Product uygulaması

Varlıkları kendi tarafınızda saklarsınız; araç arayüzü ise Alter Product'tan iframe içine yüklenir. Alter Product hizmeti hesap erişimini, planı ve oturumları kontrol eder, içe aktarma kataloğunu sağlar. Entegrasyon bu hizmete bağlantı gerektirir.

Yedek alırken veritabanını, dosya dizinini ve eklentinin şifreli verilerini okumak için gereken WordPress anahtarlarını ve salt değerlerini saklayın. Böylece yalnızca görünen görselleri değil, çalışmayı sürdürmek için gereken verileri de geri yükleyebilirsiniz.

Markanızın sitesinde kişiselleştirme

Araç, ürün sayfasının veya ayrı bir WordPress sayfasının parçası olabilir. Müşteri mağazanızın satın alma akışında kalır; sepeti ve siparişi WooCommerce yönetir.

Ürün sayfası, araç sayfası veya blok

Gösterim biçimini mağaza düzenine göre seçin: ürün sayfasında araç, özel sayfaya yönlendiren düğme veya mevcut bloklar ve kısa kodla yerleştirme. Viewer, Configurator ve Customizer farklı görevler üstlenir; hepsini aynı anda sunmanız gerekmez.

  • Müşterinin ürün modelini incelemesini istediğiniz yerde Viewer gösterin.
  • Hazır varyantlar ve seçenekler satıyorsanız Configurator kullanın.
  • Müşterinin yazı veya görsel eklemesi ya da baskı kompozisyonunu değiştirmesi gerekiyorsa Customizer seçin.
Mağaza sayfasına yerleştirilmiş, tişört metni düzenleme ve sepet düğmesi bulunan Customizer
Müşteri ürünü gömülü araçta kişiselleştirir. Görüntü; yazı düzenlemeyi, 3D model görünümünü ve 2D baskı alanını gösterir.

Kendi arka planınız, logonuz ve diliniz

Ürün sunumunu markanıza uyarlayın. Eklentide yerel arka planları, logoları ve gömülü araçların görünüm ayarlarını yönetirsiniz. Tek tek seçeneklerin kullanılabilirliği plana bağlıdır.

  • Sahne arka planı, arayüz renkleri ve hazırlanan tasarım görünümü mağazayla tutarlılığı destekler.
  • Uygulama ve eklenti 22 dili destekler. WordPress panelinin dilini kullanıcı için, sitenin dilini ise site ayarlarından belirlersiniz.
  • Ürün adlarını, baskı metinlerini ve ürün açıklamalarını müşterilerinizin dillerinde hazırlarsınız. Arayüzün bir dili desteklemesi, mağaza içeriğinin otomatik çevrileceği anlamına gelmez.

Müşteri tasarımından sipariş kalemine

Müşteri varyantını seçer ve kişiselleştirmeyi hazırlar. Eklenti, yapılandırmayı ve kaydedilen tasarımı önce sepet, ardından WooCommerce sipariş kalemiyle ilişkilendirir. Mevcut mockup'lar sipariş edilen baskının tanınmasını kolaylaştırır.

  1. Müşteri ürünü veya atanmış aracı açıp seçenekleri belirler.
  2. Kişiselleştirme sırasında tasarımı kaydeder ve ürünü sepete ekler.
  3. Sepette ürünü, yapılandırmayı ve mevcut tasarım önizlemesini kontrol eder; ardından WooCommerce ödeme adımlarını tamamlar.
  4. Mağaza sahibi sipariş panelinden kaydedilen tasarımı açar ve üretime hazırlar.

Sipariş karşılama, POD ve isteğe bağlı AI

Mağazayı 3D araçlara bağlamak sürecin başlangıcıdır. Hazırlanan tasarımdan kendi üretiminiz için dosya indirebilir veya eklentideki talep üzerine baskı sağlayıcısı entegrasyonunu kullanabilirsiniz.

Printify veya Printful bağlayın

Eklenti ayarlarında seçilen sağlayıcıya bağlantıyı yapılandırın. Ardından ürün, varyant ve baskı konumlarını sağlayıcının kataloğuyla eşleyin, dosyaları hazırlayın ve WooCommerce'den üretim talebi gönderin.

PrintifyPrintful
  • Baskı alanlarını ve dosya biçimini belirli ürün ve sağlayıcıya uygun ayarlayın.
  • Üretime göndermeden önce oluşturulan dosyaları ve sipariş varyantını kontrol edin.
  • Eklentiden sipariş durumlarını ve kargo bilgilerini güncelleyin.
  • Kendi üretiminizi yapıyorsanız tasarımın olanaklarına ve dışa aktarma ayarlarına göre PDF, SVG veya PNG dosyalarını indirin.

Mağaza sahibi panelinde görsel hazırlamak için AI

Kendi AI sağlayıcı bağlantınızı yapılandırarak tasarım üzerinde çalışırken mevcut görsel oluşturma veya iyileştirme özelliklerini kullanabilirsiniz. Eklenti istekleri WordPress'ten seçilen sağlayıcıya gider ve o sağlayıcıdaki hesabınız üzerinden ücretlendirilir.

Yerleştirme oturumları: geçerlilik süresi ve limit kullanımı

Oturum, mağazanızda belirli bir aracı açmak için verilen geçici yetkidir. Ürünleri müşterilere güvenli biçimde sunmaya yardımcı olur ve aylık yerleştirme oturumu limitinde sayılan birimdir. Tek bir tıklama, benzersiz ziyaretçi veya siparişle aynı şey değildir.

Oturum anahtarı ne kadar süre geçerlidir?

Gömülü araç açılırken entegrasyon kısa ömürlü bir belirteç, yani oturum anahtarı alır. Kalıcı hesap erişim bilgileri sunucuda kalır. Müşterinin anahtar kopyalaması veya mağaza sahibinin Alter Product hesabına giriş yapması gerekmez.

Mevcut uygulamada belirtecin varsayılan geçerlilik süresi 15 dakikadır. Sunucu farklı bir süre belirleyebilir; bu nedenle entegrasyon alınan oturumun son kullanma zamanını esas alır. Belirteci yeniden kullanmak süreyi uzatmaz. Süre dolduktan sonraki yetkilendirme için yeni oturum gerekir.

Sayfayı yenilemek başka bir oturum tüketir mi?

Araca ve hâlâ uygun, geçerli bir oturum bulunup bulunmadığına bağlıdır. Eklenti tüm ziyaretçiler ve ürünler için tek bir ortak oturum kullanmaz. Aşağıdaki kurallar mevcut davranışı açıklar.

Yaygın müşteri işlemleri ve verilen oturum sayısı
DurumOturuma ne olur?Limite etkisi
Eşleşen oturum olmadan aracın ilk açılışıEntegrasyon, bu araç ve ürün bağlamı için yeni belirteç ister.Yeni belirtecin başarıyla verilmesi bir oturum tüketir.
Açık araçta modeli döndürme, rengi değiştirme veya metni düzenlemeİşlemler başlatılmış oturum içinde gerçekleşir.Bu işlemler tek başına yeni belirteç verilmesi anlamına gelmez.
Viewer veya Configurator bulunan sayfanın tamamen yenilenmesiEklenti, sayfa yeniden yüklendiğinde genellikle yeni bir belirteç alır. Bu araçların oturum belleği tam sayfa yenilemeleri arasında korunmaz.Sonraki başarılı belirteç verme işlemi başka bir oturum tüketir.
Customizer'ın aynı sekmede yenilenmesiCustomizer; mağaza, ürün, sipariş ve çalışma moduyla eşleşen, süresi dolmak üzere olmayan kayıtlı oturumu yeniden kullanabilir.Yeniden kullanım sayacı artırmaz. Koşullar sağlanmazsa yeni oturum gerekir.
Belirtecin süresinin dolması, başka ürün veya çalışma bağlamının değişmesiYeni yetkilendirme ve belirteç gerekebilir. Tarayıcı depolamasının kullanılabilirliği de yeniden kullanım olanağını etkiler.Yeni verilen belirteç limit kullanımını artırır.

Oturumları mağaza maliyetine ve planına nasıl dahil etmelisiniz?

API başarıyla yeni belirteç verdiğinde sayaç artar. Önceden verilmiş geçerli belirteci kullanmak yeni bir belirteç verme işlemi değildir. Bu nedenle plan seçerken yalnızca sipariş veya ziyaretçi sayısını değil, araç başlatmalarını, yenilemeleri ve yeniden açmaları da hesaba katın.

Aynı mağazadaki gömülü araçlar ortak aylık oturum limitini kullanır. Sayaç mağaza bazında, UTC takvim aylarına göre ayrı tutulur. WordPress panelindeki gömülü Designer ve Model oluşturucunun yeni oturumları da sayacı artırır. İçe aktarma API'sinden mevcut bir modeli indirmek tek başına düzenleyici oturumu açmak değildir.

Limite ulaşıldığında sistem yeni oturum vermeyi reddeder. Bu, abonelik kapsamında bir kullanım limitidir; güncel paket büyüklüğünü planınızdan kontrol edin.

  • Aracı müşterinin gerçekten kullandığı yerde başlatın. Ürün listesinde normal fotoğraflar ve hazır mockup'lar kullanabilirsiniz.
  • Özel API entegrasyonunda bileşenin her yeniden render edilmesinde veya seçenek değiştiğinde yeni oturum açmaktan kaçının. Geçerli oturumu yalnızca kendi doğru bağlamında kullanın.
  • Limit planlamasını dış hizmetlerin kullanımından doğan POD üretim ve AI oluşturma maliyetlerinden ayrı değerlendirin.

API ile özel entegrasyon

Kendi mağazanız, headless uygulamanız veya sipariş sisteminiz mi var? Alter Product Public API ile kendi entegrasyon katmanınızı oluşturabilir ve gereken araçları sitenize yerleştirebilirsiniz. Bu yol yazılım geliştirme gerektirir.

Alter Product'ı kendi teknolojinizle bağlayın

Public API, HTTP istekleri ve JSON verileri kullanır. Dolayısıyla entegrasyonu arka ucunuzun dilinde ve ortamında yazabilirsiniz. Alter Product araçlarını yerleştirmek için mağazanızı WordPress'e dönüştürmeniz gerekmez.

Aşağıda sunucu bağlantısı geliştirmek için örnek teknolojiler yer alır. Her birinde aynı adımları uygularsınız: API yetkilendirmesi, araç oturumu oluşturma ve ürünleri, sepeti, siparişleri kendi sisteminizle ilişkilendirme.

JavaScript ve TypeScript / Node.js

Örneğin Express veya NestJS kullanan Node.js arka ucunuza entegrasyon ekleyin. API'yi sunucudan çağırın, ön uca ise aracı yerleştirmek için gereken verileri sağlayın.

Python

Django veya FastAPI gibi mevcut Python uygulamanızı HTTP istekleriyle Alter Product ürünlerine, oturumlarına ve siparişlerine bağlayın.

PHP

Kendi mağazanızda veya uygulamanızda Laravel ya da Symfony gibi PHP çözümleri kullanın. Hazır WordPress eklentisinden bağımsız bir API entegrasyonu geliştirebilirsiniz.

Java

Araçları Spring gibi bir Java arka ucuna bağlayın; tasarım verilerini kendi ürün kataloğunuz ve sipariş süreçlerinizle ilişkilendirin.

C# / .NET

Yetkilendirme, oturum oluşturma ve mevcut mağaza süreçlerine veri aktarmak için ASP.NET Core gibi bir .NET arka ucu kullanın.

Go

Go ile yazılmış bir serviste bağlantıyı hazırlayın. Standart HTTP istemcisi API isteklerini ve JSON yanıtlarını işleyebilir.

Ruby

Ruby on Rails gibi bir Ruby uygulamasına entegrasyon ekleyin; kendi ürün, sepet ve sipariş karşılama modelinizi kullanın.

Rust

Rust arka ucunu bir HTTP istemcisi ve JSON işleme ile bağlayın. Oturumları ve satın alma olaylarını hizmet mimarinize dahil edebilirsiniz.

Sitenize uygun ön uç

Tarayıcı tarafında React, Vue, Angular veya sade HTML ve JavaScript kullanabilirsiniz. TypeScript de iletişimi uygulamak için uygundur. Sayfa iframe'i yerleştirir, postMessage olaylarını işler ve kendi arka ucunuza bağlanır.

Ön uç sayfanın görünümü ve sepet tepkilerinden, arka uç ise kimliği doğrulanmış Public API çağrılarından sorumludur. Next.js gibi iki katmanı birleştiren yapılarda kalıcı anahtarları ve oturum oluşturmayı yalnızca sunucu tarafına yerleştirin.

Kendi ödeme adımlarınızı, ödeme sisteminizi, CMS'inizi ve sipariş karşılama sürecinizi koruyabilirsiniz. Uygulama sırasında bunları tasarım verileri ve seçilen Alter Product aracının olaylarıyla bağlarsınız.

ReactVue.jsAngularJavaScriptTypeScript

API ne sağlar, sisteminiz neyi hazırlar?

Alter Product 3D araçları, tasarım verilerini ve oturum mekanizmalarını sağlar. Arka ucunuz bunları ürünler, müşteri hesapları, sepet ve sipariş yönetimiyle bağlar. Alter Product erişim bilgilerini tarayıcıda açığa çıkarmadan ön ucunuz için aracı uç noktalar oluşturabilirsiniz.

Özel entegrasyonda sorumluluk dağılımı
KatmanGörev
Sitenizin ön ucuiframe'i gösterir, araç iletişimine yanıt verir ve mağaza arayüzünü günceller.
Arka ucunuzPublic API isteklerinin kimliğini doğrular, oturum oluşturur, müşteri erişimini denetler ve kendi sepetiniz ya da siparişlerinizle bağlantıları kaydeder.
Alter Product Public APIBağlantı, ürün, araç eşleştirmesi, sipariş ve dosya ile varlıklara erişim işlevlerini sağlar.
Gömülü araçModeli gösterir; seçilen moda ve hazırlanmış tasarıma göre yapılandırma veya kişiselleştirme sunar.
Özel entegrasyon örneği: kod düzenleyici ve sitede ambalaj Customizer'ı
Özel entegrasyon kullanan uygulama örneği. Güncel oturum ve iletişim parametrelerini bağlantılı API ve postMessage belgelerinde kontrol edin.

Yetkilendirmeden kendi sepetinize

Önce tek bir ürün için bağlantıyı ve yerleştirme oturumunu çalıştırın. Ardından seçilen araca göre yapılandırma, tasarım kaydetme ve sipariş işlemlerini ekleyin.

  1. API erişim bilgilerini ve mağaza alan adını ayarlayın. Bağlantıyı arka uçtan yapılan istekle kontrol edin.
  2. Mağaza ürününüzü tasarımla ve uygun Alter Product aracıyla ilişkilendirin.
  3. iframe'i yerleştirin ve iletişim başlangıcını işleyin. Sunucuda kısa ömürlü oturum oluşturup belgelere göre araca aktarın.
  4. Yapılandırma veya kişiselleştirme olayını işleyin ve gerekli verileri kendi sepetinize kaydedin.
  5. Satın alma sonrasında siparişi, gerekli verileri ve dosyaları kendi sipariş karşılama sisteminizle eşitleyin.

Aracınıza uygun talimatlara geçin

Yerleştirme talimatlarında parametreleri ve örnekleri bulabilirsiniz. postMessage bölümleri sayfayla iletişimi, API belgeleri ise arka uç işlemlerini açıklar.

Satışa başlamadan önce tüm süreci kontrol edin

Ürünü müşterinin kullandığı gibi test edin: sayfanın açılmasından siparişte tasarımın görünmesine kadar. Bilgisayarda ve telefonda, yönetim paneline giriş yapmadan da deneme yapın.

Kısa kontrol listesi

Bir ürünü hazırladıktan sonra tüm süreci tamamlayın. Ancak bundan sonra doğruladığınız ayarları diğer katalog ürünlerine uygulayın.

  • Business veya daha üst planın etkinliğini ve alan adının geçerli SSL/TLS sertifikasıyla HTTPS üzerinden çalıştığını kontrol edin.
  • Araç sayfalarının görünürlüğünü, tasarım atamasını ve seçilen yerleştirme biçimini kontrol edin.
  • Farklı boyutlar ve renkler seçin. Tasarım seçeneklerini mağazadaki varyantlar ve fiyatlarla karşılaştırın.
  • Customizer'da metin veya görsel ekleyin, tasarımı kaydedin ve sepete koyun. Önceden eklenmiş kişiselleştirmeyi düzenlemeyi de kontrol edin.
  • Sepette ve test siparişinden sonra önizlemeyi, adedi ve yapılandırmayı doğrulayın.
  • Siparişteki tasarımı açıp oluşturulan baskı dosyalarını kontrol edin. POD kullanıyorsanız sağlayıcı eşleştirmesini ve kontrollü üretim talebi gönderme sürecini de test edin.
  • Müşteriye sunulan kitaplığı, dili, markalamayı ve sitenin telefondaki davranışını kontrol edin.