Online ödeme sayfanızı yükseltin
Markanızı genişletmek, mesajları değiştirmek, teklifler sunmak ve müşterilerinizin deneyimlerini başka yollardan iyileştirmek için online ödeme sayfanızı özelleştirebilirsiniz. Yaptığınız özelleştirmenin, Shopify tarafından yapılmaya devam eden değişikliklerle uyumlu olduğundan emin olmak için ödeme sayfanızı düzenli olarak güncellemeniz gerekir.
Bu yükseltmeye hazırlanmadan önce aşağıdakileri yapmanız gerekir:
-
Yeni ödeme sayfasının önizlemesini görüntüleyin. Ayrıca ödeme sayfasını müşterilerin gözünden görerek test edin. Ödeme sayfanızda yaptığınız özelleştirmelere bağlı olarak, yükseltme yapmadan önce
checkout.liquid
dosyanızda değişiklik yapmanız gerekebilir. - Yaptığınız değişikliklerden memnun olduğunuzda yeni Shopify ödeme sayfasını kullanmak için mağazanızı yükseltin.
Bu sayfada
Ödeme sayfanızın önizlemesini görüntüleme ve hataları test etme
Mağazanızı yeni ödeme sayfasına yükseltmeden önce değişikliklerin önizlemesini görüntülediğinizden emin olun.
Adımlar:
- Shopify yöneticinizden Ödeme sayfası yükseltmesi sayfasına gidip Ödeme sayfasının önizlemesini görüntüleyin seçeneğine tıklayın.
- Listeden geçerli temanızı seçin ve ardından Önizleme'ye tıklayın.
- Müşteri olarak ödeme işleminden geçerek ödeme testi oluşturun.
Söz konusu testler sırasında hatayla karşılaşırsanız ödeme sayfasında gerçekleştirdiğiniz bazı özelleştirmeler yeni sürümdeki iyileştirmelerle çakışıyor olabilir. Böyle bir durumda, yükseltme işleminden önce checkout.liquid
dosyanızda değişiklikler yapmanız gerekir.
Hataları giderme
Adımlar:
- Shopify yöneticinizde Online Mağaza > Temalar'a gidin.
- ... düğmesine ve ardından Çoğalt'a tıklayın.
- Daha fazla tema bölümünden çoğalttığınız temayı bulun ve ardından ... düğmesi > Kodu düzenle'ye tıklayın. Değişiklerinizi yapın ve temanızın çoğaltılmış ama yayınlanmamış bu sürümünü kullanarak değişiklikleri test edin.
Not: Temalarda değişiklik yapacağınız veya bunları test edeceğiniz zaman bir çoğaltılmış kopya oluşturup söz konusu kopyayla çalışın. Çoğalttığınız kopyayla çalışırken hata yapmanız durumunda, müşterilerinizi etkilemeden kopyayı silebilir ve orijinal tema üzerinden başka bir kopya oluşturabilirsiniz.
checkout.liquid
dosyasını açın.Çoğaltılmış temanızdan yeni Shopify ödeme sayfasını kullanarak
checkout.liquid
dosyasının önizlemesini görüntüleyin:
Ödeme sayfanızın görünümüyle ilgili hata alır veya sorunlar fark ederseniz bu hatayı ya da sorunları çözmek için checkout.liquid
dosyanızı düzenlemeniz gerekir.
Yeni Shopify ödeme sayfasına yükseltme
Ödeme sayfanızı yükseltmek, Shopify ödeme sayfanızı yükseltmenizi ve yayındaki geçerli temanızı, değişiklikleri içeren çoğaltılmış temayla değiştirmenizi gerektiren iki adımlı bir işlemdir.
Dikkat. Bu yükseltmeyi yapmadan önce ödeme sayfanızın önizlemesini görüntülediğinizden emin olun. Bu yükseltmenin, müşterilerinizin ödeme sayfası deneyimini etkilememesini ve yeni ödeme sayfasından ödemelerini yapabilmelerini istersiniz.
Olası aksamaları en aza indirmek için yükseltmeyi günün daha az yoğun bir saatinde (sabah erken saatler, akşam geç saatler veya hafta sonu gibi) gerçekleştirin.
Adımlar:
Ödeme sayfası yükseltmesi sayfasından Ödeme sayfasını yükselt'e (bu düğme sayfanın en altında bulunur) tıklayın.
Temanızın önizlemesini ilk kez görüntülediğinizde hatalarla karşırsanız işleme devam etmeden önce bunları giderdiğinizden emin olun (yukarıdaki Hataları giderme bölümüne bakın). Ardından, çoğaltılan temanızın güncel sürümünü yayınlayın.
Ödeme sayfanız yükseltildi ve çoğaltılmış temanız artık geçerli temanız oldu.
Shopify ödeme sayfasındaki yenilikler
Shopify ödeme sayfasının yeni sürümü aşağıdaki değişiklikleri ve yeni özellikleri içerir:
- Abonelikler
- Yukarı satış
- Ödeme sırasında bahşiş verme
- Teslim alım ve yerel teslimat
- Ek uluslararası alanlar
- Shop ile siparişleri takip et düğmesi
- Sipariş durumu sayfası güncellemeleri
- Genel dosya değişiklikleri
- İskeletler/yükleme durumları
- Hata iletisi
- Veri özelliği değişiklikleri
- Erişilebilirlik ile ilgili iyileştirmeler
Abonelikler
Ödeme özelleştirmelerinizi korurken abonelik ürünleri sunabilmeniz için Shopify Ödeme Sayfası'na birden fazla bölüm eklendi. Bu bölümler, doğrudan Shopify Ödeme Sayfası içinde abonelik ürünleri satmanıza ve yinelenen ödemeleri işlemenize olanak tanır.
Ödeme sayfası yükseltmesini tamamladıktan sonra Shopify App Store'dan bir abonelik uygulaması ekleyerek abonelikler sunabilir veya yeni abonelik API'leri ile özel bir uygulama oluşturabilirsiniz.
Shopify Yardım Merkezi'nde abonelikler hakkında daha fazla bilgi edinin.
- Abonelikler etkinleştirildiğinde, abonelikler için kullanılan kargo yöntemleri tek seferlik satın alımların kargo yöntemlerinden ayrı olarak gösterilir.
-
.product_description_variant Span.product_description_selling_plan
ürünle ilişkili bir abonelik varsa ek satır öğesi özelliği olarak görünür. - Sipariş özetindeki toplamın altında, bir araç ipucu ile birlikte, yinelenen toplam görünür.
- Siparişe bir abonelik ürünü dahil edildiğinde abonelik kargo seçenekleri görüntülenir.
Yukarı satış
Yeni satın alım sonrası uygulamaları Shopify App Store'da kullanıma sunuldu. Bu uygulamalar, müşterilerinize doğrudan satın alım sonrası teklifleri sunar ve fatura veya kargo bilgilerini yeniden girmeden yukarı satılan ürünü içerecek şekilde, tamamlanan siparişlerini değiştirme imkanı verir.
Bu ödeme sayfası yükseltmesi, ödeme dosyalarınızda, satın alım sonrası yukarı satışların özelleştirilmiş ödeme sayfanızla çalışmaya izin veren değişiklikler içerir.
Satın alım sonrası yukarı satış hakkında daha fazla bilgi edinin.
Shopify yöneticisinde geçerli bir satın alım sonrası uygulaması yüklendiğinde, müşteriler satın alım sonrası teklifleri alır.
Not: Satın alım sonrası sayfasının özelleştirilmesi, üçüncü taraf yukarı satış uygulaması içinde yapılır. checkout.liquid kullanılarak özelleştirilemez.
Ödeme sırasında bahşiş verme
Bahşiş seçenekleri, müşterilerin online siparişleriyle ilgili bir bahşiş eklemelerini sağlamak veya bahşiş yerine bağış toplamak için kullanılabilir. Bahşiş seçeneği etkinleştirildiğinde, ödeme sayfasının ödeme yöntemi adımında bir Bahşiş ekle bölümü görünür. Bahşiş ekle bölümünde, özel bahşiş tutarı girilebilen bir alanı ile birlikte önceden seçilen üç bahşiş seçeneği bulunur.
Bahşiş seçenekleri sunma hakkında daha fazla bilgi edinin.
- Bahşiş seçeneği etkinleştirildiğinde, ödeme sayfasının ödeme yöntemi adımında bir Bahşiş ekle bölümü görünür.
Teslim alım ve yerel teslimat
Mağazadan teslim alım ve yerel teslimat, müşterilerin siparişlerini yerel olarak almasına olanak sağlayan yeni teslimat yöntemleridir. Bu teslimat yöntemleri etkinleştirildiğinde müşteriler, ödeme işleminin kargo adımında mağazadan teslim alım veya yerel teslimat seçeneğini belirleyebilir.
Mağazadan teslim alım ve Yerel teslimat seçeneklerini nasıl etkinleştireceğinizi öğrenin.
- Yerel teslimat etkinleştirildiğinde ve müşteri tarafından seçildiğinde, yerel teslimata yönelik ek alanlar görünür.
- Mağazadan teslim alım etkinleştirildiyse ödeme sayfasındaki Bilgiler sayfasında, müşteriye bir teslimat yöntemi bölümü gösterilir. Kargo kullanılamıyorsa yalnızca teslim alım bilgileri görüntülenir.
-
Teslimat yöntemleri, farklı sekmeler olarak gösterilir.
- Kargo seçildiğinde, müşterilerden gönderi bilgilerini girmeleri istenir ve Kargoya devam et seçeneğine tıklandığında kullanılabilir gönderi yöntemlerini görüntülenir.
- Teslim alım seçeneğinin belirlendiğinde, teslim alım konumlarının bir listesini gösterilir. Müşteriler, istenilen teslim alım konumunun radyo düğmesine, ardından Ödemeye devam et'e tıklar.
Müşteriler ödeme işleminin kargo adımında Teslim alım seçeneğini belirlerse kargo bilgileri toplanmaz. Müşterilerin, ödeme işleminin ödeme adımında fatura bilgilerini girmesi gerekir.
Yerel teslimat yönergeleri, sipariş durumu sayfasında görünür. Bunlar, Shopify yöneticinizdeki Ayarlar > Kargo ve teslimat bölümüne giderek düzenlenebilir. Mağazadan teslim alım bölümünde, düzenlemek istediğiniz konumu bulun ve Yönet'e tıklayın.
-
Sipariş durumu sayfası, teslimat ve teslim alımlara ilişkin ilerlemeyi göstermek üzere güncellendi. İletiler, şu zamanlarda görüntülenir:
- Bir sipariş hazırlandığında ve teslimata hazır olduğunda.
- Bir teslimat tamamlandığında. Bu ileti, aynı ürünleri yeniden sıralamak için de bir bağlantı sağlar.
- Bir teslim alım siparişi onaylandığında. Teslim alıma hazır olduğunda müşterinin e-posta alacağını belirtir.
- Bir teslim alım siparişi teslim alınmaya hazır olduğunda.
- Bir teslim alım siparişi teslim alındığında.
Ek uluslararası alanlar
Bazı ülkelerde, kargolarınızın müşterilerinize ulaşması için karşılamanız gereken benzersiz kargo yönetmelikleri bulunur. Benzersiz kargo yönetmeliklerine sahip ülkelerde ek alanlar artık kullanılabilir. Bu yeni alanlar, ödeme işleminin ödeme yöntemi adımında görünür.
Ek uluslararası alanlar hakkında daha fazla bilgi edinin.
- Ek ödeme alanları yalnızca Brezilya, Güney Kore, İtalya ve Çin'deki müşterilere görünür.
Shop ile siparişleri takip et düğmesi
Sipariş durumu ve teşekkür sayfalarındaki Shop ile siparişleri takip et düğmesi, yeni bir tasarım ile güncellendi.
Shop uygulaması hakkında daha fazla bilgi edinin.
- Müşterilerin, Shop'taki satın alımlarını takip etmelerini isteyen bir metin düğmesi eklendi.
- Shop Pay takibini göstermek üzere parametreler eklendi.
- Aşağıdaki durumlar için Shop ile siparişleri takip et düğmesine yönelik işleme:
- teslimat girişiminde bulunuldu
- onay
- teslim edildi
- başarısız
- taşınıyor
- kargolanamaz
- teslimata çıktı
Sipariş durumu sayfası güncellemeleri
Sipariş durumu sayfasında birkaç güncelleme yapıldı.
- Hediye kartı bilgileri için, hediye kartı satın alındığında görüntülenen özel bir bölüm oluşturuldu.
- Abonelik bilgileri eklendi.
-
icon-svg--align-text-bottom
sınıfı kaldırıldı. -
data-step="thank-you"
data-step="thank_you"
olarak değiştirildi. Müşterinin hangi ödeme sayfasında bulunduğunu tanımlamak için bu özelliği kullanıyorsanız, bunun yerine Shopify.Checkout.page JavaScript nesnesini kullanın. - Sipariş durumu kartı eklendi.
Genel dosya değişiklikleri
-
div.content-box__row
artıkrole="table"
içeriyor. - Müşteri, teşekkür adımındaysa ve QR paketine sahipse
show_qr.js
eklenir. - Müşterinin ödeme sayfasına erişimi olduğundan emin olmak üzere bir kontrol eklendi.
- Hediye kartları artık
checkouts/order_status/gift_cards
ile gösteriliyor. - İletişim bilgileri yönü,
enforce_content_directionality
ile düzeltildi. - Kargo bilgileri,
checkouts/web/checkouts/contact_information/pickup
bölümüne taşındı. - Sipariş özeti kenar çubuğunda birden fazla kargo satırının görüntülenmesi artık destekleniyor.
-
tr.total-line
yalnızca güncellenen toplamlar varsa görüntülenir. - Genel ödeme satırları artık destekleniyor.
- Ödeme sırasında para birimi değiştirme artık destekleniyor.
-
#payment-gateway-subfields
artık sınıflar içeriyor:-
.radio-wrapper content-box__row .content-box__row--secondary
-
.card-fields-container
-
Kredi kartı ipucu ayarlandı ve artık
div.field__icon
bölümünde.Aria etiketi, kargo ücretlerinin tam açıklamasından kaldırıldı.
Kargo ücretleri form alanları,
checkouts/web/checkouts/shipping_method/shipping_rate_additional_fields
bölümüne taşındı.
İskeletler/yükleme durumları
Sayfa yüklenirken görünür olan iskeletler eklenerek veya yükleme tamamlanıncaya kadar bazı öğeleri seçmeli olarak gizlenerek, ödeme sayfaları için yükleme durumları güncellendi. Bu değişiklikler yükleme sürelerini optimize eder.
-
Yükleme sırasında gizlenen nesneler:
-
del.total-recap__original-price
-
.total-line__price span.payment-due__currency
-
span.order-summary__emphasis
-
-
Yüklenirken iskelet gösteren nesneler:
-
Span.total-recap__final-price
-
.product__price del.order-summary__small-text
-
.product__price del.order-summary__emphasis
-
.total-line__price span.payment-due__price
-
.total-line__price span.order-summary__emphasis
-
.total-line__price span.visually-hidden
-
.total-line__price.total-line--subtotal span.order-summary__emphasis
-
Hata iletisi
Ödeme sayfasına yeni hata iletileri eklendi.
- Adres alanına vatandaşlık numarası uyarısı eklendi.
- Sepet, varış yeri veya ülke için kullanılabilen kargo ücretlerinin iki ayrı uyarı iletisine ayrılmış olduğunu belirten bir uyarı: Sepet veya varış yeri için ücret bulunmadığını belirten bir uyarı mesajı ve bir ülkeye yönelik ücretlerin mevcut olmadığını belirten ayrı bir uyarı.
- Bir geliştirme mağazasında satın alım tamamlandığında ödeme sayfasında görünen bir uyarı başlığı eklendi.
- Müşteriden ödeme sırasında ücret alınmayacağında görünen bir bildirim eklendi.
- Kimlik doğrulama değişikliği hatasını belirten bir uyarı başlığı eklendi.
- Ödeme işleminin kargo adımında kargo yöntemlerinin kullanılamadığını belirtmek üzere bir hata iletisi eklendi.
Veri özelliği değişiklikleri
Trekkie, aşağıdaki nesnelerden kaldırıldı:
-
Continue_shipping_button
-
Get_shipping_updates_button
-
Shipping_updates_handle_field
-
Shipping_updates_submit_button
-
Change_shipping_address_link
-
breadcrumb_cart_link
-
apply_discount_button
-
Have_an_account_login_link
-
Email_or_phone_field
-
Email_field
-
buyer_accepts_marketing_field
-
Change_billing_address_link
-
Change_contact_method_link
-
Change_payment_method_link
-
Change_pickup_method_link
-
Change_shipping_address_link
- Ödeme sayfası giriş alanları:
-
{type}_address_field
-
{type}_firstname_field
-
{type}_lastname_field
-
{type}_company_field
-
{type}_address1_google_autocomplete_field
-
{type}_address1_field
-
{type}_address2_field
-
{type}_city_field
-
{type}_country_field
-
{type}_province_field
-
{type}_zip_google_autocomplete_field
-
{type}_phone_field
-
Erişilebilirlik ile ilgili iyileştirmeler
Web erişilebilirlik standartlarına uygunluğu sağlamak amacıyla, ödeme sayfasında bazı değişiklikler yapılmıştır. Bu değişiklikler, ekran okuyucu gibi erişilebilirlik teknolojilerinden yararlanan müşterilerin ödeme işleminde gezinmesini kolaylaştırır.
-
Aşağıdakiler için
ul
üzerinerole="list"
eklendi:-
u.breadcrumb
-
ul.payment-method-list
-
ul.os-timeline
-
ul.policy-list
-
İpucu,
telephone_field
üzerindearia-labelledby
öğesinden kaldırıldı.Shop'ta, giriş etiketi, telefona yönlendirme olarak değiştirildi.
Vergiler beklenirken
h3
başlıkları eklendi.Yönlendirme yapılırken
h3
başlıkları eklendi.Kargo yöntemleri yüklenirken
p
etiketi,h3
etiketi olarak değiştirildi.Otomatik tamamlama artık
phone
yerinemobile tel
öğesine yönlendiriyor.role="region"
eklenerekdiv[data-processing-order]
öğesi güncellendi.-
div[data-announce-change]
öğesi, aşağıdakilerle güncellendi:- Ekli
role="region"
-
aria-labelledby
öğesini, üstbilgi öğesinin kimliğiyle eşleşecek ayarla -
aria-describedby
öğesini, içerik kapsayıcısı öğesinin kimliğiyle eşleşecek ayarla
- Ekli
-
div.content-box blank-slate
öğesi, aşağıdakilerle güncellendi:- Ekli
role="region"
-
aria-labelledby
öğesini, üstbilgi öğesinin kimliğiyle eşleşecek ayarla
- Ekli
Hızlı ödeme ızgarası,
div
yerineul
veli
öğeleri kullanılacak şekilde geliştirildi.-
Sipariş özeti aşağıdakilerle güncelledi:
- Satış fiyatı ve normal fiyata ilişkin iyileştirilmiş netlik
- Span öğesi,
dl
etiketi şeklinde değiştirildi -
del
etiketi,dt
vedd
etiketleri olarak değiştirdi.
-
Ödeme ayrıntısı yöntemleri aşağıdakilerle güncelledi:
-
span.radio__label__accessory
öğesi şu olarak değiştirildi:div.radio__label__accessory
-
span.visually-hidden
öğesi şu olarak değiştirildi:h3.visually-hidden
-
span.payment-icon-list__more
öğesi şu olarak değiştirildi:li.payment-icon-list__more
-
span.content-box__small-text
öğesi şu olarak değiştirildi:small.content-box__small-text
-