Ana içeriğe geç
Storefront widget'ı ve görünümü

Widget'ın ürün sayfasında göründüğü yer

Varsayılan olarak Bundlex widget'ı ürün sayfasında sepete ekle düğmesinin hemen üzerinde görüntülenir. Bu konum temanız için uygun değilse widget'ı taşımanın iki yolu vardır: uygulama yerleştirmesinde özel bir konum seçici veya sayfa oluşturucu bağlantısı. Bu makalede widget'ın nereye yerleştirildiği ve Bundlex'in bu seçenekler arasında nasıl karar verdiği açıklanır.

Varsayılan konum

Hiçbir konum geçersiz kılma seçeneği eşleşmediğinde Bundlex, widget'ı satın alma alanında algılanan ürün formu kapsayıcısının önüne ekler. Temanın varyant ve miktar kontrollerine göre kesin konum değişir. Uygulamada bu, teklif kartlarının sepete ekle düğmesinin üzerinde görüneceği anlamına gelir. Çoğu müşteri miktar veya paket teklifini burada görmeyi bekler.

Bu varsayılan konum, Bundlex'in ürün formunuzu otomatik olarak algılamasına bağlıdır. Çoğu tema otomatik olarak algılanır. Temanız algılanmazsa widget, Sepete ekle düğmesine güvenilir şekilde bağlanamaz. Yalnızca bir konum bağlantısı eklemek, eksik veya yanlış ürün formunu düzeltmez. Form algılamasını da kontrol etmesi için destek ekibine başvurun.

Konum öncelik sırası

Uygulama yerleştirmesiyle sunumda Bundlex, sabit bir sırayla konum hedefi arar ve bulduğu ilk hedefi kullanır. Listedeki üst sıradaki seçenekler alt sıradakilere göre önceliklidir.

  1. Özel konum seçici, en yüksek öncelik. Bundlex uygulama yerleştirmesinde ayarladığınız CSS seçicisidir. Bu ayar yapılmışsa ve bir öğeyle eşleşiyorsa widget doğrudan bu öğenin arkasına eklenir ve listedeki diğer seçenekler kullanılmaz.
  2. Sayfa oluşturucu bağlantısı (data-bundlex-widget). Sayfanıza eklediğiniz ve data-bundlex-widget özniteliğini taşıyan HTML öğesidir. Widget, eşleşen ilk bağlantının içine yerleştirilir. Özel konum hedefi bulunamadığında bu seçenek kullanılır.
  3. Ürün formunun önündeki varsayılan konum, en düşük öncelik. Yukarıda açıklanan otomatik konumlandırmadır. Diğer iki geçersiz kılma seçeneği de eşleşen bir hedef sağlamadığında kullanılır.

Sıra ilk eşleşmede sona erdiği için eşleşen özel konum hedefi hem bağlantıya hem de varsayılan konuma göre önceliklidir, eşleşen bağlantı da varsayılan konuma göre önceliklidir. Tema değişikliğinden sonra bir seçici artık eşleşmezse Bundlex daha alt sıradaki bir konuma geçebilir.

1. seçenek: özel konum seçici, uygulama yerleştirmesi

Uygulama yerleştirmesiyle sunumu koruyarak widget'ı belirli bir sayfa öğesinin arkasına yerleştirmeniz gerektiğinde özel konum seçiciyi kullanın. Seçiciyi bilmiyorsanız uygun bir seçim yapmanıza yardımcı olması için Bundlex destek ekibine başvurun. Önce taslak temada test edin.

Bu ayarı Bundlex uygulama yerleştirmesinde yaparsınız:

  1. Shopify yöneticinizde Online Store bölümüne gidin ve Temayı düzenle seçeneğine tıklayın.
  2. Uygulama yerleştirmeleri bölümünü açın ve Bundlex Bundles seçeneğini bulun.
  3. Gelişmiş ayarları göster seçeneğini etkinleştirin, ardından Özel konum seçici alanına bir CSS seçicisi girin.
  4. Temayı kaydedin.

Widget, seçicinizin eşleştiği öğenin hemen arkasına eklenir. Hangi seçiciyi kullanacağınızdan emin değilseniz Bundlex destek ekibi uygun bir seçici bulmanıza yardımcı olabilir. Gelişmiş ayarlarda ürün formu, sepete ekle düğmesi ve miktar seçicileri için de alanlar bulunur. Bunlar widget'ı konumlandırmak için değil, özel temalarda otomatik algılamayı düzeltmek için kullanılır.

Bundlex Bundles genişletilmiş, Gelişmiş ayarları göster seçeneği açık ve Özel konum seçici alanı görünür durumdayken, krem rengi ürün önizlemesinin yanında gösterilen Shopify taslak tema Uygulama yerleştirmeleri paneli.
(1) Uygulama yerleştirmelerini açın ve Bundlex Bundles seçeneğini genişletin. (2) Gelişmiş ayarları göster seçeneği, (3) Özel konum seçici alanını gösterir. Bu taslak önizlemesinde yerleştirme kapalı ve mevcut bir uygulama bloğu var. Boş alan, ayarın konumunu gösterir, özel bir konumun uygulandığını göstermez.

2. seçenek: sayfa oluşturucu bağlantısı

Ürün sayfalarını GemPages, PageFly veya Shogun gibi görsel bir sayfa oluşturucuyla hazırlıyorsanız widget'ı genellikle düzeninizde belirli bir konuma yerleştirmek istersiniz. Bunun için widget'ı istediğiniz yere özel bir HTML veya kod bloğu ekleyin ve içine data-bundlex-widget özniteliğini taşıyan boş bir öğe yerleştirin:

<div data-bundlex-widget></div>

Bunu elle yazmanız gerekmez: Paket düzenleyicisinin Gelişmiş sekmesini açın ve Sayfa oluşturucu mu kullanıyorsunuz? bölümünü genişletin. Kopyala seçeneğini belirleyin, ardından kod parçacığını sayfanıza yapıştırın.

Bundlex, eşleşen ilk bağlantının içine widget'ı yerleştirir. Her paket için farklı bir kod parçacığı kullanmanız gerekmez. Bağlantı yalnızca konumu kontrol eder. Bundlex, gösterilecek yayınlanmış paketi ürüne göre seçmeye devam eder.

Yalnızca eşleşen ilk bağlantı kullanılır

Sayfada birden fazla data-bundlex-widget öğesi varsa Bundlex yalnızca DOM sırasındaki ilk öğeyi kullanır. Bu durum, mağazanız hızlı görüntüleme penceresi veya ürün işaretlemesini tekrarlayan sepet çekmecesi gibi içerikleri çoğalttığında önemlidir. Bağlantıyı yalnızca widget'ı gerçekten göstermek istediğiniz yüzeye yerleştirin. Böylece ilk eşleşme doğru öğe olur.

Bunun yerine uygulama bloğu ne zaman kullanılmalı

Bundlex, ürün sayfası için uygulama yerleştirmesinden ayrı bir widget sunma yöntemi olan bir tema uygulama bloğu da sağlar. CSS seçicisi yazmadan veya sayfa işaretlemesini düzenlemeden, tema düzenleyicisindeki sürükleyip bırakma özelliğiyle widget'ı belirli bir konuma yerleştirmek istediğinizde uygulama bloğunu kullanın:

  1. Tema düzenleyicisinde bir ürün şablonu açın.
  2. Widget'ı istediğiniz bölümde Blok ekle seçeneğine tıklayın.
  3. Uygulamalar sekmesini açın, Bundlex Bundles seçeneğini belirleyin ve bloğu istediğiniz kesin konuma sürükleyin.
  4. Temayı kaydedin.
Shopify taslak tema düzenleyicisinde Varsayılan ürün, Ürün bilgileri bölüm ağacı ve Fiyat ile Varyant seçici arasında Bundlex Bundles gösteriliyor; yanında USD cinsinden tam ürün ve teklif önizlemesi bulunuyor.
1. Ürün şablonunda Bundlex Bundles'ı Ürün bilgileri içine yerleştirin. Bu örnekte Fiyat'tan sonra ve Varyant seçiciden önce bulunuyor. Taslak tema önizlemesinde teklifler bu konumda gösteriliyor.

Blok, widget'ı bölüm içinde bıraktığınız konuma yerleştirir. Bu nedenle otomatik varsayılan konum ile elle yazılmış bir seçici arasında iyi bir orta yoldur. Blok, yerleştirmenin özel konum seçicisini ve sayfa oluşturucu bağlantısını yok sayar. Ürün sayfasında tek bir sunum yöntemi kullanın: hem yerleştirmeyi hem de bloğu çalıştırmak, konumlandırma ve ayarların hangisinin önce başlatıldığına bağlı olmasına neden olabilir.

Değişikliği önce taslak temada test edin. Bu taslakta çalışan bir yerleştirmeyi kapatmadan önce bloğun ürünün gerçek şablonunda görüntülenen bir bölümün içinde olduğunu kontrol edin. Değişiklikten hemen sonra ürün sayfasını yeniden yükleyin. Widget kaybolursa yerleştirmeyi yeniden açın. Hediyeli indirimlerde, yerleştirmeyi ve sepetteki hediye temizleme işlemini koruyan bir konumu tercih edin. Yerleştirme ve blok karşılaştırması bölümüne bakın.

Hangi konumu seçerseniz seçin widget yalnızca uygulama yerleştirmesi veya blok açık olduğunda ve yayınlanmış bir paket ürünle eşleştiğinde görüntülenir. Widget hiç görünmüyorsa konumu değiştirmeden önce bu iki koşulu doğrulayın.

Açılış sayfaları: "Bundlex Bundles featured" bloğu

Yukarıdaki yöntemler ürün sayfaları için geçerlidir. Kampanya için oluşturduğunuz açılış sayfası gibi normal bir Shopify sayfasında, yani herhangi bir /pages/ URL'sinde, widget kendi kendine bağlanamaz ve özel HTML de widget'ı yüklemez.

Bunun yerine temanızın kendi Öne çıkan ürün bölümünü ekleyin ve Bundlex Bundles featured bloğunu bunun içine yerleştirin. Tema bölümü sepete ekle düğmesini sağlar, blok da ana sayfada olduğu gibi widget'ı ekler:

  1. Shopify yöneticinizde Online Store bölümüne gidin ve Temayı düzenle seçeneğine tıklayın.
  2. Üstteki şablon açılır menüsünde Sayfalar seçeneğini belirleyin ve açılış sayfanızın kullandığı şablonu seçin.
  3. Bölüm ekle seçeneğine tıklayın ve temanızın kendi Öne çıkan ürün bölümünü seçin. Ardından paketini göstermek istediğiniz ürünü seçin.
  4. Bu bölümün içinde Blok ekle seçeneğine tıklayın, Uygulamalar sekmesini açın ve Bundlex Bundles featured seçeneğini belirleyin.
  5. Öne çıkan blok ayarlarında Ürün seçeneğini bölümdeki ürünle aynı ürüne ayarlayın veya Bölüm ürünü bağlantısını koruyun.
  6. Temayı kaydedin.
Shopify ana sayfa taslak tema düzenleyicisinde Öne çıkan ürün bölümü genişletilmiş ve içinde Bundlex Bundles featured listeleniyor; yanında Revitalize Face Cream ve USD cinsinden teklif widget'ı bulunuyor.
(1) Temanızın Öne çıkan ürün bölümünü ekleyin. (2) Bundlex Bundles featured bloğunu bunun içine yerleştirin. Bu ana sayfa örneği, sayfa şablonundaki bölüm ve blok kurulumunun aynısını kullanır.

Öne çıkan ürün bölümünün dışında tek başına kullanılan blok, sepete ekle formu bulamaz ve hiçbir şey göstermez. Bölümün içine yerleştirildiğinde ürünü yayınlanmış paket teklifleriyle birlikte gösterir ve müşteriler açılış sayfasından doğrudan sepete ekleme yapabilir. Aynı kurulum ana sayfanızda da çalışır.

Hızlı başvuru

Konumlandırma yöntemiNerede ayarlanırÖncelik
Özel konum seçiciUygulama yerleştirmeleri > Bundlex Bundles > Gelişmiş ayarları gösterEn yüksek
data-bundlex-widget bağlantısıSayfa işaretlemesi veya sayfa oluşturucuÖzel hedef eşleşmediğinde kullanılır
Varsayılan (ürün formundan önce)OtomatikHiçbir geçersiz kılma eşleşmediğinde kullanılır

Bu makale faydalı oldu mu?

Geri bildiriminiz belgelerimizi geliştirmemize yardımcı olur.

Teşekkürler, bu makaleyi geliştirmeye devam edeceğiz.

Ekibimizle sohbet etmek ister misiniz? Hâlâ bir sorunuz mu var?

Hâlâ yardıma mı ihtiyacınız var?

Ekibimiz yalnızca bir tık uzağınızda. Bize mesaj gönderin, size geri dönelim.

Bu sitenin çalışmasını sürdürmek, nasıl kullanıldığını ölçmek ve sohbet widget'ımızı açtığınızda çalıştırmak için birkaç çerez kullanıyoruz. çerez politikası sayfamıza göz atın.