WooCommerce Mini Sepeti Nasıl Oluşturulur: 3 Yöntem

WooCommerce mini alışveriş sepetini ayarlamanın kolay bir yolunu mu arıyorsunuz? Ödeme deneyiminiz yavaş ve tekrarlayıcıysa, müşterinizin alışveriş deneyimini etkileyebilir. Ödeme sürecinizin akışını iyileştirmek, potansiyel müşteri dönüşümlerinizi iyileştirmenin ayrılmaz bir parçasıdır ve bir mini alışveriş sepeti bunun için harika bir çözüm olabilir.

Web sitenize bir tane eklemenize yardımcı olmak için, bir WooCommerce mini alışveriş sepetinin nasıl oluşturulacağına dair bir kılavuz burada. Ama önce, mini arabanın tam olarak ne olduğuna ve neden bir tane kullanmanız gerekebileceğine bir göz atalım.

WooCommerce mini sepeti nedir?

WooCommerce Mini sepetiniz, gerçek WordPress alışveriş sepeti sayfanızın sadece küçük bir şeklidir. Sepetinize eklenen ürünleri ve bazı detayları içerir. Mini alışveriş sepetinin içeriği, etkin WordPress temanıza bağlıdır, ancak bunlar genellikle şunları içerir:

• Ürün listeniz
• ara toplam
• Ürün küçük resimleri
• Ürün miktarı

WooCommerce mini sepetinizin gösterdiği ayrıntılardan bağımsız olarak, WooCommerce mağazanızda gezinirken müşterinizin kullanıcı deneyiminin çok önemli bir parçasıdır. Bu, müşterilerinizin web sitenizin herhangi bir yerinden doğrudan ödeme sayfasına geçmek için kullanabileceği ve alışveriş sepetindeki ürünleri takip etmesine yardımcı olan erişilebilir bir araçtır.

Mini arabayı QuadLayers'da bile kullanıyoruz. Sepete ürün eklerseniz, başlık menüsündeki sepet simgesinin üzerine gelerek mini sepeti görüntüleyebilirsiniz.

Aşağıdaki ekran görüntüsüne bakarsanız, WooCommerce Checkout Manager ürününü sepete ekledik. Bu, miktar ve ara toplam ile birlikte mini sepette de görüntülenir.

WooCommerce web siteniz için neden bir Mini Sepet oluşturmalısınız?

Varsayılan olarak, WooCommerce temanız kendi WooCommerce mini sepetiyle gelebilir. Olsa bile konumu ve stili tema ayarlarınızdan tamamen özelleştirilemeyebilir. Ayrıca, mini sepetiniz için mükemmel bir yerde olmayabilir.

Okurlarımızdan bazıları yüzen bir mini araba eklemeyi düşünürken, diğerleri onu kenar çubuğuna veya altbilgiye ekleyebilir. Kullanmayı düşünmek isteyebileceğiniz çeşitli olası mini araba yaklaşımları vardır. Ayrıca, mini sepetlerinize nakliye fiyatları, ek sepet ayrıntıları, özel mesajlar ve daha fazlası gibi daha fazla içerik eklemeniz gerekebilir.

Sepetinizi kullanırken rahatlığınız da sizin ve müşterilerinizin gerçek satışlarınızı artırması açısından önemli olabilir. Web sitenizin estetiğine mükemmel şekilde uyan özelleştirilmiş, satışa hazır bir ödeme, WooCommerce web siteniz için ezber bozan bir unsur olabilir. Bu nedenle, özel mini sepetinizi oluşturmak ve web sitenizin farklı sayfalarına eklemek istiyorsanız, başka yere bakmanıza gerek yok!

WordPress'te bir WooCommerce Mini Sepeti nasıl oluşturulur

WooCommerce Mini sepetinizi oluşturmak ve eklemek için 3 farklı yöntem kullanabilirsiniz:

1. Sepet Widget'ı Ekleme
2. WordPress Eklentisi Kullanmak
3. programatik olarak

WordPress Widget'larını kullanmanın varsayılan yönteminden başlayarak, her bir yönteme ve hepsinde yer alan adımlara bir göz atalım.

1. WordPress Widget'larını kullanarak bir WooCommerce Mini Sepeti oluşturun

Varsayılan olarak, WooCommerce sepet widget'ını kullanarak WooCommerce mini arabaları oluşturabilirsiniz. Bir widget kullandığımız için, temanın yalnızca mevcut widget alanlarına yerleştirilebilir. En yaygın alanlar şunları içerir:

• Widget'lar kenar çubuğu
• Başlığın altında
• altbilgiler

Temanıza bağlı olarak daha fazla widget alanı olabilir. Ancak lütfen WooCommerce uyumlu temalardan birini de kullandığınızdan emin olun.

1.1. Widget Alanını Seçin

Sepet widget'ı eklemek için önce bir widget alanı seçmeniz gerekir. Bu yüzden WP Yönetici Kontrol Panelinizi açın ve Appearance > Widgets'a gidin. Ardından, mini sepetiniz için widget alanını seçersiniz.

Demomuz için Kenar Çubuğunu kullanacağız. Ancak sizin için en uygun olan widget alanını kullanabilirsiniz.

1.2. Widget Alanına Sepet Widget'ı Ekle

Mini sepetiniz için widget alanını seçtikten sonra, widget'ı eklemek için + düğmesine tıklayın . Sepet'i aramak için arama çubuğunu kullanın ve widget'ı eklemek için üzerine tıklayın.

Widget'ı göremiyorsanız, lütfen web sitenizde WooCommerce'i doğru şekilde kurduğunuzdan emin olun.

Burada, Sepet boşsa gizle seçeneğini de etkinleştirebilir veya devre dışı bırakabilirsiniz. Müşterinizin sepeti boşsa kenar çubuğu sepetiniz gizleneceği için etkinleştirmenizi öneririz. Bu aynı zamanda web sitenizin daha işlevsel görünmesini sağlayacaktır.

Sepet widget'ını eklemeyi bitirdikten sonra, değişikliklerinizi kaydetmek için widget'larınızı güncelleyin . Şimdi, kenar çubuğu mini sepetiniz ön uçta görünmelidir.

Elbette mini sepetinizi farklı bir widget alanına da ekleyebilirsiniz. Widget sayfasının altındaki konumu seçmeniz yeterlidir; widget'ı başlığınızın altına veya altbilgisine kolayca ekleyebilirsiniz.

Bu, WooCommerce mini sepetinizi oluşturmanın en kolay yolu olsa da, çok sayıda sınırlama ile birlikte gelir. Birincisi, mini sepetiniz için herhangi bir özelleştirme yok . Mini sepetinizin nasıl göründüğü ve müşterileriniz tarafından nasıl erişildiği konusunda çok sınırlısınız.

Mini sepet konumları, temanız tarafından sağlanan widget alanlarıyla sınırlıdır. Ek olarak, açılır mini arabalar veya sepete özel alanlar gibi özellikler de müşteriler veya web sitesi sahibi için mevcut değildir. Bu nedenle, daha özelleştirilebilir bir mini araba istiyorsanız, okumaya devam etmenizi ve bunun yerine aşağıdaki yöntemleri göz önünde bulundurmanızı öneririz.

2. Bir WordPress Eklentisi kullanarak bir WooCommerce Mini Sepeti oluşturun

Bir WordPress eklentisi kullanmak, alışveriş sepeti deneyiminizi iyileştirmenin en kolay yollarından biridir. Eklentiler sayesinde müşterilerinizin diledikleri zaman kolaylıkla ödeme yapabilmelerini sağlayabilirsiniz. Ayrıca, web sitenizin ödeme deneyimini basitleştirmenize olanak tanır.

Mini sepet eklentileri, ürün satışlarınızı teşvik etmek ve olası satış yaratmanızı geliştirmek için şık özellikler sunar. Örneğin:

• Mini sepet için gezinen sepet simgelerini ve açılır pencereleri etkinleştirebilirsiniz. Böylece müşterileriniz, mağaza içeriğinin geri kalanını temiz ve dikkati dağılmamış halde tutarken onlara istedikleri zaman erişebilir.
• Mini sepete çok sayıda sepet ve ürün öğesi eklenebilir. Örneğin, ek ürün bilgileri, miktarın değiştirilmesi, alışveriş sepeti ara toplamını ve toplam görüntüsünü düzenleme ve çok daha fazlası.
• Eklentilerle, doğrudan mini sepetten kupon ekleme, özel özellikli ürünler ve önerilen ürün önerileri gibi bazı akıllı özellikler ekleyebilirsiniz.

Bu nedenle, WooCommerce mini sepetinizi eklemeye ve özelleştirmeye adanmış bir WordPress eklentisi kullanmanızı şiddetle tavsiye ederiz.

Demomuz için WooCommerce Cart All in One eklentisini kullanacağız . Web sitenizde mini bir sepet oluşturmak için en iyi eklentilerden biridir. Eklentinin kullanımı da çok kolaydır ve mini alışveriş sepeti açılır penceresi, kenar çubuğu arabası veya menü sepeti özelleştirme seçenekleri gibi ihtiyacınız olan tüm özelliklere sahiptir.

Ayrıca en iyi WooCommerce mini alışveriş sepeti eklentilerinin bir listesine sahibiz. Başka bir eklenti kullanmak istiyorsanız, ona da bir göz atabilirsiniz.

2.1. Eklentiyi Kurun ve Etkinleştirin

Eklentiyi yükleyerek ve etkinleştirerek başlayalım.

WP Yönetici Kontrol Panelinizi açın ve ardından kenar çubuğunuzdan Eklentiler > Yeni Ekle'ye gidin.

Ardından, WooCommerce için Cart All In One'ı aramak için sağ üstteki arama çubuğunu kullanın.

Eklentiyi bulduktan sonra, eklentiyi kurmak için Şimdi Kur'a tıklayın. Son olarak, eklentiyi kurduktan sonra etkinleştirin .

Premium bir eklenti kullanmak istiyorsanız, manuel olarak yüklemeniz ve yüklemeniz gerekir. Daha fazla bilgi için manuel olarak bir WordPress eklentisi yüklemek için ayrıntılı kılavuzumuza bakın.

Şimdi, WooCommerce mini sepetinizi etkinleştirmek için eklentiyi yapılandırmamız gerekiyor.

2.2. WooCommerce Eklentisi İçin Sepeti Hepsi Bir Arada Yapılandırın

Eklentinin WooCommerce mini sepetini yapılandırmak için, WP Yönetici Panonuzdaki Sepet Hepsi Bir Arada sekmesine tıklayın . Bu, eklentinin Kontrol Paneli sayfasını açacaktır.

Eklentinin ücretsiz sürümünde, Kenar Çubuğu Mini sepetini veya Menü mini sepetini etkinleştirebilirsiniz. Ayrıca bir AJAX Sepete Ekle düğmesi ekleyebilir ve yapılandırabilirsiniz, ancak şimdilik yalnızca mini sepet seçeneklerine odaklanalım.

Web sitenizdeki mini alışveriş sepeti açılır penceresini etkinleştirmek için Kenar Çubuğu Sepetini açın ve Etkinleştir'e tıklayın. Mobil cihazlarda mini alışveriş sepeti açılır penceresini etkinleştirmek/devre dışı bırakmak için Mobil Etkinleştirme seçeneğini de kullanabilirsiniz. Son olarak, değişikliklerinizi kaydedin .

Şimdi gidin ve web sitenizin ön ucunu yeniden yükleyin. Web sayfanızda yeni mini sepet simgenizi görmelisiniz. Mini sepetinizi açmak için üzerine tıklamanız yeterlidir.

Ayrıca, menülerinizden herhangi birine bir menü sepeti de ekleyebilirsiniz. Menü Sepeti sekmesini açın ve önceki adımlar gibi etkinleştirin . Gerekirse mobil menülerde de etkinleştirebilirsiniz.

Ardından, menü sepetini web sitenizde görüntülemek istediğiniz WordPress menülerini eklemeniz gerekir. Menüler alanında WooCommerce mini sepetinize eklemek istediğiniz menüleri seçmeniz yeterlidir. Ardından Kaydet'e tıklayın .

Artık menü mini sepetinizi web sitenizde görmelisiniz. Mini sepet için seçmiş olduğunuz menülere eklenecektir.

2.3. Eklentiyi kullanarak WooCommerce Mini Sepetinizi özelleştirin

Özelleştirme, Cart All in One eklentisinin önemli bir özelliğidir. Menü sepetinin yanı sıra kenar çubuğu sepetinizi de özgürce özelleştirebilirsiniz. Buna renkler, mini sepet stilleri, konumlar, özel animasyonlar, mini sepet simgeleri, kenar çubuğu menü stilleri ve çok daha fazlası dahildir.

Özelleştirme seçeneklerine erişmek için WP Yönetici Panonuzdaki Görünüm > Özelleştir'e gidin. Tema özelleştiricinize yönlendirileceksiniz. Burada, WooCommerce için Hepsi Bir Arada Sepete tıklayın ve tüm mini sepet özelleştirme seçeneklerini görmelisiniz.

Bu demo için Kenar Çubuğu Sepetini özelleştireceğiz. Bu yüzden Sepet Sepeti'ne tıklayın ve bunun için tüm seçenekleri görmelisiniz. Şimdilik, Kenar Çubuğu içeriğini görüntüle seçeneğini kullanarak daha küçük bir mini alışveriş sepetini etkinleştireceğiz ve Kenar Çubuğu alışveriş sepeti konumunu değiştireceğiz.

Ancak, web sitenize nasıl uyduğuna bağlı olarak bu seçenekleri kullanarak mini sepetinizi daha da özelleştirebilirsiniz. Sepet simgesinin kendisiyle etkileşim gibi düzenleyecek çok şey var, bu nedenle simgenin üzerine geldiğinizde mini sepet görünür, yükleme simgesini özelleştirin ve daha pek çok şey.

Değişikliklerinizle işiniz bittiğinde, Yayınla'yı tıklayın ve kaydedin. Mini sepetinizin tüm bu özelleştirmelerini web sitenizde görebileceksiniz.

Eklentiyi kullanarak mini sepetinizi özelleştirmenin temel özü budur. Eklenti tarafından sağlanan tüm özelleştirme seçenekleri hakkında daha fazla bilgi edinmek istiyorsanız, belgelerini incelemenizi şiddetle tavsiye ederiz .

3) Programlı Bir WooCommerce Mini Sepeti Oluşturun

Diyelim ki web sitenizin hafif bir çerçevesini korumak için WooComerce Mini sepetinizi eklemek için bir eklenti kullanmak istemiyorsunuz. Ardından, bunun yerine programlı olarak bir tane oluşturmayı da seçebilirsiniz.

Bu, özel bir işlev kullanarak özel bir kısa kod oluşturmanızı ve bunu temanızın functions.php dosyasına yapıştırmanızı gerektirir. Ardından, kısa kodu web sitenizin herhangi bir yerinde kullanabilir veya hatta doğrudan WooCommerce mini sepetini eklemek için WordPress veya WooCommerce şablon dosyalarınızdan herhangi birine ekleyebilirsiniz.

Bazı çekirdek dosyaları değiştireceğimiz için, web sitenizi yedeklemeniz ve ayrıca programlı olarak veya alt tema eklentilerinden birini kullanarak bir alt tema oluşturmanız en iyisidir. Bu, WordPress temasını güncellediğinizde özel kodlarınızı kaybetmemenizi sağlar.

3.1. Özel Kısa Kodu Tema İşlevlerinize ekleyin

Özel kodları, web sitenizin tema dosyalarına tema dosyası düzenleyicisinden ekleyeceğiz. WooCommmerce'a kod ekleme konusunda tam olarak rahat değilseniz, önce bu makaleyi gözden geçirmenizi öneririz.

Hazır olduğunuzda, WP Yönetici Panonuzdaki Görünüm > Tema Dosyası Düzenleyici'den Tema düzenleyicinizi açın. Sağdaki tema dosyaları kenar çubuğunu kullanın ve function.php 'ye tıklayın. Bu, Tema düzenleyicinizde function.php dosyasını açacaktır.

Şimdi, tema düzenleyicinize aşağıdaki kodu yapıştırın:

 function custom_mini_cart() {
echo '<a href="#" class="dropdown-back" data-toggle="dropdown"> ';
echo '<i class="fa-alışveriş sepeti" aria-hidden="true"></i>';
echo '<div class="basket-item-count">';
echo '<span class="cart-items-count">';
echo WC()->cart->get_cart_contents_count();
yankı '</span>';
yankı '</div>';
yankı '</a>';
echo '<ul class="açılır-menü açılır-menü-mini-cart">';
echo '<li> <div class="widget_shopping_cart_content">';
woocommerce_mini_cart();
yankı '</div></li></ul>';

}
add_shortcode('quadlayers-mini-cart', 'custom_mini_cart'); 

Kodu ekledikten sonra Dosyayı Güncelle seçeneğine tıklayın. Bu, web siteniz için '[quadlayers-mini-cart]' başlıklı özel bir kısa kod oluşturacaktır. Artık, özel WooCommerce Mini Sepetinizi eklemek için bu kısa kodu herhangi bir gönderide, sayfada veya widget'ta kullanabilirsiniz.

3.2. Bir WooCommerce Şablonunda Kısa Kodu Kullanın

Özel mini sepetinizi herhangi bir tema şablonu dosyasına veya WooCommerce şablonlarına eklemek için aşağıdaki kod parçasını da kullanabilirsiniz.

 <?php echo do_shortcode('[quadlayers-mini-cart]'); ?>

Örneğin, bu kodu WooCommerce ürün arşiv şablon dosyanıza ekleyelim. WooCommerce şablon dosyanızı açmak için WordPress panonuzdan Eklentiler > Eklenti Dosyası Düzenleyicisine gidin.

Ardından, sağ üstteki Düzenlemek için Eklenti Seç seçeneğini kullanın ve WooCommerce'i seçin ve Seç'e tıklayın . Eklenti Dosyaları menüsünü kullanarak şablonlar > arşiv-ürün.php'ye tıklayın.

Ardından, şablonun uygun herhangi bir bölümüne aşağıdaki kod satırını ekleyin.

 echo do_shortcode('[quadlayers-mini-cart]');

Demomuz için do_action( 'woocommerce_before_main_content' ) ; astar. Ancak, snippet'i herhangi bir şablon dosyasına ve gereken yere ekleyebilirsiniz.

Son olarak, eklenti düzenleyicide kodları ekledikten sonra dosyayı güncelleyin . Mini sepet, belirlenmiş WooCommerce sayfalarınızda görünecektir. Bizim durumumuzda bu, Mağaza/Ürün Arşivi sayfasıdır.

Bu yaklaşım, mini sepetinizi şablona ekleyecektir. Ancak, mini araba tam olarak istediğiniz gibi görünmeyebilir ve temanızın dosya stil sayfasını kullanarak ek stil gerektirebilir. Bu nedenle, bu yöntem yalnızca kodlamaya alışkınsanız ve WordPress'e PHP ve CSS eklemek için yeterli bilgiye sahipseniz önerilir.

Bonus: WooCommerce'de alışveriş sepeti sayfası nasıl atlanır

Müşterilerinizin daha hızlı bir ödeme süreci geçirmesini istiyorsanız , sepet sayfasını tamamen atlamayı da seçebilirsiniz. Mini sepet, müşterilerinize zaten sağlandığından, sepet sayfasına çok fazla ihtiyaç yoktur. Böylece müşterilerinizi satın almak istediklerinde doğrudan ödeme sayfasına yönlendirebilirsiniz.

Bunu, özel bir eklenti kullanarak veya özel bir işlev kullanarak yapabilirsiniz. Şimdilik, sepet sayfasını programlı olarak nasıl atlayabileceğinizi ele alacağız.

Ancak devam etmeden önce, WP panonuzdan WooCommerce > Ayarlar'a gitmeniz ve Ürünler sekmesini açmanız gerekir. Genel seçenekler altında, her iki Sepete Ekle Davranışı seçeneğini de devre dışı bırakın. Bu, özel işlevimize herhangi bir müdahale olmamasını sağlar.

Şimdi, Child Theme'nizin function.php dosyasını yukarıdakiyle aynı adımı kullanarak bir kez daha açın. Basitçe Görünüm > Tema Dosyası Düzenleyici'den tema düzenleyiciye gidin ve function.php dosyasına tıklayın.

Ardından aşağıdaki kod parçasını buraya yapıştırın.

 add_filter('add_to_cart_redirect', 'ql_skip_cart_page');
işlev ql_skip_cart_page () {
küresel $woocommerce;
$redirect_checkout = $woocommerce->cart->get_checkout_url();
$redirect_checkout döndür;
} 

Artık müşterileriniz sepetinize her ürün eklediğinde, sepet sayfası yerine doğrudan ödeme sayfasına yönlendirilecekler.

Bu işlemi basitleştirmek için WooCommerce için Doğrudan Ödeme gibi bir eklenti de kullanabilirsiniz. Bunu ve neden kullanmayı düşünmeniz gerektiğini öğrenmek istiyorsanız, buradan özel kılavuzumuza göz atabilirsiniz.

Çözüm

Ve bu, bir WooCommerce mini alışveriş sepetinin nasıl oluşturulacağına ilişkin kılavuzumuzu sonlandırıyor. WooCommerce Mini Cart'ı kurmak ve özelleştirmek sıkıcı bir süreç değildir ve bunu yapmak için farklı yöntemler kullanmayı seçebilirsiniz. WooCommerce Mini Sepetimizi eklemek ve özelleştirmek için bugünün kılavuzunda kullandığımız yöntemleri özetleyelim:

• Sepet widget'larını kullanma
• Özel bir WordPress eklentisi ile
• Özel bir kısa kod ve şablon dosyaları kullanarak programlı olarak

Hangi işlemi kullanacağınızdan emin değilseniz, WooCommerce mini sepetinizi oluşturmak için bir eklenti kullanmanızı şiddetle tavsiye ederiz. Bu yöntem yalnızca daha güvenli ve kolay olmakla kalmaz, aynı zamanda mini sepetiniz için tonlarca özel özelleştirme ve kişiselleştirme seçeneği de elde edersiniz. WordPress'e yeni başlayan biriyseniz ve minimum sınırlamalarla bir WooCommerce mini sepeti eklemek istiyorsanız, özel bir eklenti kullanmanızı şiddetle tavsiye ederiz.

Ayrıca, ödeme sürecinizi kısaltmak ve satışlarınızı artırmak için ek yollar arıyorsanız, neden diğer makalelerimizden bazılarına göz atmıyorsunuz:

• WooCommerce Sepet Sayfasını Özelleştirmek için En İyi Eklentiler
• WooCommerce tek sayfalık ödeme nasıl oluşturulur
• WooCommerce doğrudan ödeme bağlantısı nasıl oluşturulur

Peki şimdi web sitenize bir mini sepet ekleyebilir misiniz? Yoksa zaten eklediniz mi? Yorumlarda bunu öğrenmekten mutluluk duyacağız.