WooCommerce'de Hızlı Satın Al Düğmesi Nasıl Eklenir? Eklentili ve Eklentisiz
Yayınlanan: 2020-06-01Çevrimiçi bir işletme yönetiyorsanız, satışları, dönüşümleri ve geliri artırmanın yollarını arıyor olabilirsiniz. Ziyaretçilerin e-posta adreslerini yakalayabilir, çıkış amaçlı açılır pencereleri etkinleştirebilir veya haber bültenleri gönderebilirsiniz, ancak çok daha güçlü bir şey var. Bu yazıda, WooCommerce'de nasıl hızlı satın alma düğmesinin ekleneceğini göstereceğiz !
Hızlı Satın Al düğmesi nedir?
Şimdi satın al düğmesi olarak da bilinen hızlı satın al düğmesi, alışveriş yapanların istedikleri ürünleri daha hızlı satın almalarını ve ödeme sürecindeki ek adımlardan kaçınmasını sağlar. Böylece, sepete ürün eklemek, alışveriş sepeti sayfasına ve ardından ödeme sayfasına gitmek yerine, tek bir tıklamayla ürün sayfasından ödeme sayfasına gidebilirler. Bu şekilde, bırakmaları ve alışveriş sepetini terk etmeyi azaltırsınız.
Amazon gibi çoğu büyük e-ticaret şirketinin ürün sayfalarında tek tıklamayla satın almanıza olanak tanıyan hızlı satın alma düğmesi bulunur. Böylece, bir müşteri şimdi satın al düğmesini tıkladığında, otomatik olarak ödeme sayfasına yönlendirilir. Tahmin edebileceğiniz gibi, bu satışları artırmanın harika bir yoludur.
Neden bir WooCommerce Hızlı Satın Alma düğmesini kullanmalısınız?
Alışveriş yapanların %75'inden fazlası, alışveriş sepetlerinde ürünlerle çevrimiçi mağazalardan ayrılıyor. Bunun ana nedenlerinden biri, satın alma sürecinin uzun ve kafa karıştırıcı olmasıdır. Bu süreç ne kadar uzun olursa, kullanıcıların bırakma şansı o kadar artar, bu nedenle en iyi çözümlerden biri WooCommerce mağazanıza hızlı satın alma düğmesi eklemektir. Bu, Sepete ekle düğmesinden kurtulmanız gerektiği anlamına gelmez. Tüm ziyaretçileriniz sitenizi ziyaret ettikleri anda satın almaya hazır değildir.
Ancak, hemen satın almaya hazır olan kullanıcılara bunu tek tıklamayla yapma seçeneği sunmak, dönüşümlerinizi artırmanıza yardımcı olacaktır. Ek olarak, hızlı satın alma düğmeleri, abonelik veya üyelik web siteleri için iyi bir fikirdir. Bir kullanıcı bir abonelik için kaydolduğunda, tek yapmanız gereken onları alışveriş sepeti sayfasına ve ardından ödeme sayfasına götürmek yerine ödeme sayfasına yönlendirmektir.
WooCoommerce'da Hızlı Satın Al Düğmesi Nasıl Eklenir?
WooCommerce'de hızlı satın alma düğmesi eklemenin üç ana yöntemi vardır:
- Eklenti
- Programlı (kodlama)
- Kısa kodlar
Tüm bu yöntemler %100 yeni başlayanlar için uygundur, böylece size en uygun olanı seçebilirsiniz.
1) Eklenti
Sitenize hızlı satın al düğmesi eklemek için birçok WordPress eklentisi bulunmaktadır. Ancak, ödeme sürecini basitleştirmek için en iyi ve hafif eklentilerden biri olan QuadLayers tarafından WooCommerce Direct Checkout'u öneririz.
WooCommerce için Doğrudan Satın Alma, ücretsiz bir sürümü ve 20 USD'den başlayan (tek seferlik ödeme) üç premium planı olan ücretsiz bir araçtır. Ücretsiz sürüm 70.000'den fazla aktif kuruluma sahiptir ve birçok harika özelliğe sahiptir. Ancak daha gelişmiş işlevler istiyorsanız, profesyonel sürüm en iyi seçiminizdir.
Eklenti Kurulumu ve Aktivasyonu
1) Eklentiyi sitenize yükleyin.
2) Ardından, etkinleştirin.
Aynı sayfadan bazı premium planlar kullanıyorsanız, indirilen eklenti dosyalarını yükleyebilirsiniz. Ardından, Şimdi Kur'a tıklayın.
Kurulumdan sonra eklentiyi etkinleştirin.
Artık WooCommerce için Doğrudan Ödeme etkinleştirildiğine göre, yapılandırmaya bir göz atalım.
Lisansı Etkinleştir
WooCommerce > Ayarlar > Doğrudan Ödeme altında, ödeme işlemini basitleştirmek için yapılandırma seçeneklerini görebileceksiniz.
Yapmanız gereken bir sonraki şey, eklentinin premium kopyasını geçerli bir lisans anahtarıyla etkinleştirmektir.
Lisans anahtarı, QuadLayers hesabınızda bulunabilir. Lisans anahtarını kopyalayın ve onunla ilişkili e-posta adresiyle eklentilerinizin ayarlarına yapıştırın. Anahtarınızı doğrulamak önemlidir çünkü otomatik güncellemeler almanıza olanak tanır. Eklentinin yeni bir sürümü olduğunda, onu doğrudan WordPress kontrol panelinizden güncelleyebilirsiniz.
Yapılandırma
WooCommerce'e şimdi satın al düğmesi eklemeden önce, ödeme seçeneklerinizi yapılandırmanız ve özelleştirmeniz gerekir. Her şeyden önce, özelleştirmeyi test edebilmeniz için mağazanızda bazı ürünlerin bulunduğundan emin olun. Bizim durumumuzda bir test ürünümüz var ve gördüğünüz gibi ürün sayfasında sadece Sepete ekle düğmesi var.
Bir ziyaretçi bu düğmeye her tıkladığında, ürün sepetlerine eklenecektir. Müşterinin sepet sayfasına ve ardından ödeme sayfasına gitmesi gerekir. Böylece Direct Checkout ile alışveriş yapan kişiyi sepet sayfasını atlayarak ürün sayfasından ödeme sayfasına yönlendirebilirsiniz. Bu şekilde dönüşümleri artırabilirsiniz.
Bu eklentiyi kullanmak çok kolaydır. Doğrudan Ödeme ayarları bölümünde, sepet sayfasını devre dışı bırakma seçeneğini göreceksiniz. Tek yapmanız gereken yeniden yönlendirmeyi açmak ve ödeme sayfasını hedef olarak eklemek.
Bundan sonra, değişiklikleri kaydettiğinizden emin olun.
Şimdi, gitmeye hazırsın. Alışveriş yapanlar satın al düğmesine tıkladığında, otomatik olarak ödeme sayfasına yönlendirilecekler. Müşteri buradan fatura bilgilerini, teslimat adreslerini ekleyebilir ve ödemeyi yapabilir.
WooCommerce Direct Checkout eklentisi ayrıca ödeme alanlarını, fatura adreslerini, teslimat adreslerini ve daha fazlasını kaldırmanıza olanak tanır.
WooCommerce Doğrudan Ödeme Fiyatlandırması
WooCommerce için Doğrudan Ödeme, temel özelliklere ve üç premium plana sahip ücretsiz bir sürüme sahiptir.
- Kişisel – 20 USD tek seferlik ödeme – Tek Lisans anahtarı
- Acente – 40 USD tek seferlik ödeme – 5 Lisans anahtarı
- Geliştirici – 80 USD tek seferlik ödeme – Sınırsız Lisans anahtarı
Ücretsiz sürüm mükemmel ve başlangıç için ihtiyacınız olan her şeye sahip. Ancak daha gelişmiş özellikler istiyorsanız Kişisel veya Acente planını denemenizi öneririz.
WooCommerce Doğrudan Ödemeyi Kontrol Edin
Diğer araçlara göz atmak isterseniz, en iyi hızlı satın alma eklentileri listemize göz atın. Öte yandan, ödeme alanları ekleyerek ve düzenleyerek ödeme sayfanızı daha da özelleştirmek istiyorsanız, WooCommerce Checkout Manager'a göz atabilirsiniz.
2) Programlı (kodlama)
Herhangi bir eklenti yüklemek istemiyorsanız, WooCommerce'e programlı olarak bir hızlı satın alma düğmesi ekleyebilirsiniz. Bu yöntem biraz teknik bilgi ve sabır gerektirir. Ancak, bu adımları izlerseniz, yeni başlamış olsanız bile bunu yapabilirsiniz. Sepete ekle düğmesinin nasıl oluşturulacağını, URL'sini nasıl değiştireceğinizi ve basit, değişken ve gruplandırılmış ürünler için nasıl ekleyeceğinizi göstereceğiz.
1- Bir ödeme URL'si oluşturun
İlk olarak, bağlantıyı sepete ekle düğmesine eklemeniz gerekir. Sepete eklemek istediğiniz ürünün kodu için PRODUCT_ID'yi değiştirmeniz gerekiyor.
https://alanadiniz.com/cart/?add-to-cart=PRODUCT_ID
Kullanıcıların sepet sayfasını atlayıp ödeme sayfasına yönlendirmesini istediğimiz için URL'yi aşağıdaki gibi değiştirmeliyiz:
https://alanadiniz.com/checkout/?add-to-cart=PRODUCT_ID
2- Bir ürün bağlantısı oluşturun
Bundan sonra, ürün türüne göre URL'yi değiştirmeniz gerekir: tek, değişken ve gruplandırılmış. A) Tek ürün Tek ürünlerin URL'si:
https://alanadiniz.com/checkout/?add-to-cart=PRODUCT_ID
PRODUCT_ID'yi ürün kimliğinizle değiştirmelisiniz. Örneğin, ID = 10 olan tek bir ürün için bağlantı şöyle olacaktır:
https://alanadiniz.com/checkout/?add-to-cart=10
B) Değişken ürün Değişken ürünler için Ürünler > Varyasyonlar bölümünden varyasyon kimliğini almanız gerekir. ve bu Varyasyon Kimliğini URL'de aşağıdaki gibi kullanın:
https://yourdomain.com/checkout/?add-to-cart=VARIATION_ID
Dolayısıyla, varyasyon kimliğiniz = 29 ise bağlantı şu şekilde olacaktır:
https://alanadiniz.com/checkout/?checkout=29
Bağlantıyı Ürün Kimliği ve Varyasyon Kimliği'ni kullanarak da oluşturabilirsiniz:
https://yourdomain.com/checkout/?checkout=PRODUCT_ID&variation_id=VARIATION_ID
Ancak, daha basit olduğu için yalnızca varyasyon kimliğini kullanmanızı öneririz.
NOT : Bu, yalnızca oluşturulan tüm özniteliklere sahip varyasyonlar için işe yarar. Diğer varyasyonlar için, bağlantıya eksik olan özniteliğin tanımını eklemeniz gerekir. Örneğin, Varyasyon Kimliği = 30 için URL oluşturmak istediğinizi varsayalım. Renk özniteliği tanımlanır (yeşil), ancak boyut değil. Yani size = orta eklemek istersek, URL şöyle olacaktır:
https://alanadiniz.com/checkout/?checkout=30&pa_size=medium
C) Gruplandırılmış ürün Gruplandırılmış ürünler için, varyasyon ID'si eklemek yerine, gruplanmış ürün ID'sini, alt ürünlerin ürün ID'si ve her birinin miktarları ile birlikte eklemeniz gerekir.
https://yourdomain.com/checkout/?add-to-cart=GROUPED_PRODUCT_ID&quantity[PRODUCT_ID1]=1&quantity[PRODUCT_ID2]=1
Örneğin, burada gruplandırılmış ürün kimliği = 1900 ve alt ürün kimliği = 10 ve 15'i ekleyeceğiz.
https://yourdomain.com/checkout/?add-to-cart=1900&quantity[10]=1&quantity[15]=1
3- Miktarı tanımlayın
Ek olarak, dahil etmek istediğiniz ürün sayısını da tanımlayabilirsiniz. Bunun için miktar parametresini kullanmanız gerekir. Ürün sayısını belirtmezseniz, varsayılan olarak 1 olacaktır.
Şimdi tek, değişken ve gruplandırılmış ürünlerde miktar parametresinin nasıl dahil edileceğine bir göz atalım.
A) Tek ürün parametre miktarını product_id öğesinden sonra eklersiniz:
https://yourdomain.com/checkout/?add-to-cart=PRODUCT_ID&quantity=1
Yani ürün kimliği = 10 x2 eklemek isterseniz, bağlantı şu şekilde olacaktır:
https://yourdomain.com/checkout/?add-to-cart=10&quantity=2
B) Değişken ürün Değişken ürünler için mantık aynıdır:
https://yourdomain.com/checkout/?add-to-cart=VARIATION_ID&quantity=1
Varyasyon kimliği = 29 ve miktar = 3 için bağlantı şu şekilde olacaktır:
https://yourdomain.com/checkout/?add-to-cart=29&quantity=3
C) Gruplandırılmış ürünler Son olarak, gruplandırılmış ürünler için standart URL şudur:
https://yourdomain.com/checkout/?add-to-cart=GROUPED_PRODUCT_ID&quantity[PRODUCT_ID1]=1&quantity[PRODUCT_ID2]=1
Dolayısıyla, gruplandırılmış ürün kimliği = 1900 için, ürün kimliği = 10 x3 ve ürün kimliği = 15 x2 olan bağlantı şöyle olacaktır:
https://yourdomain.com/checkout/?add-to-cart=1900&quantity[10]=3&quantity[15]=2
URL'yi özelleştirmeyi bitirdikten sonra, sayfayı ön uçtan kontrol ederseniz, kullanıcıları doğrudan ödeme sayfasına yönlendirecek bir Sepete Ekle URL'si görebileceksiniz. Bu işlevsel olarak çalışıyor ancak harika görünmüyor. Şimdi, biraz CSS ile biraz stil ekleyerek bu bağlantıyı güzel bir düğmeye dönüştürmeniz gerekiyor.
4- Düğme stilini tanımlayın
Tüm URL'leri değiştirdikten sonra, şimdi satın al düğmesini oluşturmanız gerekir. Müşterileri doğrudan ödeme sayfasına yönlendireceğimiz için, Sepete ekle yerine Şimdi Satın Al düğmesini arayacağız.
WooCommerce'de iki düğme stili vardır:
1. Varsayılan düğme stili
<a class="button" href="#">Şimdi Satın Alın</a>
2. Alternatif düğme stili
<a class="button alt" href="#">Şimdi Satın Alın</a>
Ek olarak, özel düğme stilinizi de oluşturabilirsiniz:
<a class="button my-button" href="#">Şimdi Satın Alın</a>
Aşağıdaki kod, beyaz harflerle kırmızı bir düğme ve ince bir mavi kenarlık gösterecektir.
.my-button { Beyaz renk; arka plan rengi: kırmızı; kenarlık: 1 piksel düz mavi; sınır yarıçapı: 3 piksel; kutu gölgesi: 0px 0px 22px 0px rgba(0,0,0,0.75); }
Kodu WordPress panosu > Görünüm > Özelleştir > Özel CSS'ye kopyalayıp yapıştırmanız yeterlidir.
Ardından, renkleri, kenarlıkları, boyutu vb. değiştirerek sitenizin görünümünü ve hissini verecek şekilde özelleştirin. Mağazanızı biraz kodlama ile özelleştirmek istiyorsanız, aşağıdaki kılavuzlardan bazılarına göz atmanızı öneririz:
- Sepete Ekle düğmesi nasıl özelleştirilir
- Mağaza sayfası nasıl düzenlenir
- Ödeme sayfasını adım adım özelleştirin
3) Kısa kodlar
Şimdi satın al düğmesi eklemek için göreceğimiz son yöntem kısa kodlardır. WooCommerce'de hızlı satın alma düğmesi için bir kısa kod olmamasına rağmen, benzer bir şey yapmak için geçici çözümler vardır. Bu yöntem, örneğin ürünlerinizden birini bir blog gönderisinde tanıtmak istiyorsanız, ürüne bağlamak zorunda kalmadan hızlı satın alma seçeneği makalesi ekleyebilirsiniz.
WooCommerce, sitenizin herhangi bir yerinde kullanabileceğiniz birçok kısa kodla birlikte gelir. Kısa kodları kullanmanın en güzel yanı, çekirdek dosyaları veya herhangi bir şeyi değiştirmenize gerek olmamasıdır. Kısa kodu, görüntülemek istediğiniz yere kopyalayıp yapıştırmanız yeterlidir, hepsi bu.
Sepete kısa kod ekle
Hızlı satın alma düğmesi için bir kısa kod olmadığından, bir Sepete ekle düğmesi ekleyeceğiz ve ardından kullanıcıyı ödeme sayfasına yönlendirmek için URL'yi değiştireceğiz. İlk olarak, WordPress sitenize giriş yapın ve sepete ekle düğmesini görüntülemek istediğiniz içerik düzenleyiciye gidin. Burada, örneğin ürün inceleme gönderilerinizden birine düğmeyi ekleyeceksiniz.
Gutenberg editörü kısa kod bloğuyla birlikte gelir, bu nedenle bloğu içerik alanınıza ekleyin. Buton için kullanacağımız kısa kod:
[ add_to_cart
]
Kimliği ürün kimliğinizle değiştirmeniz gerekir. Benzersiz ürün kimliğinizi WooCommerce Ürünleri bölümünden alabilirsiniz.
Bizim durumumuzda, ürün kimliği 10'dur, bu nedenle kısa kodu aşağıdaki gibi değiştireceğiz:
[ add_to_cart
]
Bu örneği izleyerek, kısa kodu içerik alanınıza yapıştırın ve gönderiyi yayınlayın veya güncelleyin.
Böylece makalenizi ön uçtan kontrol ettiğinizde, müşterilerinizin ID=10 olan ürünü sepetlerine eklemelerini sağlayacak şık bir buton göreceksiniz.
Kısa kodu bazı özelliklerle de özelleştirebilirsiniz. Kimlikle birlikte kısa kod, sınıf, miktar, SKU, stil gibi diğer özellikleri destekler ve fiyatı gösterir. Örneğin, sepete ekle düğmesini aşağıdaki gibi bir kısa kodla değiştirebilirsiniz:
[add_to_cart id=”XXXX” class=”alt” quantity=”2” sku=”XXXX” style=”border:4px solid #ccc; padding: 12px;” show_price=”true”
add_to_cart id=”XXXX” class=”alt” quantity=”2” sku=”XXXX” style=”border:4px solid #ccc; padding: 12px;” show_price=”true”
add_to_cart id=”XXXX” class=”alt” quantity=”2” sku=”XXXX” style=”border:4px solid #ccc; padding: 12px;” show_price=”true”
]
Her bir özelliğe ürününüz için doğru değerleri yazmanız yeterlidir. Ek olarak, düğmenin stilini özelleştirebilirsiniz. Bu yöntemin bir avantajı, widget alanlarından birine sepete ekle düğmesi de ekleyebilmenizdir.
Kullanıcıları ödeme sayfasına yönlendirmek için URL'yi değiştirin
Kısa kodu yerleştirdikten sonra, kullanıcıyı ödeme sayfasına yönlendirmek için alışveriş sepetinin URL'sini değiştirmeyi unutmayın.
href=”http://alanadiniz.com/checkout/?add-to-cart=10″
Bunu yapmak için iki seçenek vardır:
- WP kontrol panelinizde WooCommerce > Ayarlar > Ürünler > Genel seçeneğine gidin. Burada, “ Arşivlerdeki sepete AJAX ekleme düğmelerini etkinleştir ” seçeneğini işaretleyin ve “Başarılı eklemeden sonra sepet sayfasına yönlendir” seçeneğini devre dışı bırakın.
- Sepet sayfasını atlamak ve alışveriş yapanları ürün sayfasından ödeme sayfasına yönlendirmek için WooCommerce için Doğrudan Satın Alma'yı yükleyin.
Sorun giderme
CSS düğmesini değiştirdiyseniz ve değişiklik ön ucunuza yansımıyorsa, bu muhtemelen önbellekle ilgili bir sorundur. Bunu düzeltmek için tarayıcı önbelleğinizi ve WordPress önbelleğinizi temizlemeniz yeterlidir. Düğme hala görünmüyorsa, kodu iki kez kontrol edin.
Çözüm
Sonuç olarak, WooCommerce mağazanıza hızlı bir satın alma düğmesi eklemek, dönüşümleri artırmanıza yardımcı olabilir. Bunu başarmanın 3 farklı yolunu öğrendiniz:
- bir eklenti ile
- Programlı (kodlama)
- Kısa kodlarla
En basit yol, Direct Checkout eklentisini kullanmaktır. Birkaç tıklama ile kullanıcılarınızı ürün sayfasından ödeme sayfasına yönlendirebileceksiniz. Herhangi bir eklenti kullanmak istemiyorsanız, kodlama yöntemi mükemmel bir seçimdir ancak bazı teknik beceriler gerektirir.
Son olarak, ödeme sürecini kısaltmak ve dönüşümü artırmak için başka bir ilginç seçenek, mağazanızda doğrudan ödeme bağlantıları oluşturmaktır. Bununla ilgili daha fazla bilgi için adım adım kılavuzumuza göz atabilirsiniz.
Umarız bu kılavuzu faydalı bulmuşsunuzdur ve WooCommerce'de hızlı satın alma düğmesinin nasıl ekleneceğini öğrenmişsinizdir. Eğer yaptıysanız, lütfen bu gönderiyi sosyal medyada paylaşmayı düşünün.
Sitenizde hangi yöntemi deneyeceksiniz? Dönüşüm oranlarını artırmak için mağazanızda başka neler yapıyorsunuz? Aşağıdaki yorumlarda bize bildirin!