WooCommerce Ödeme Hata Mesajları Nasıl Değiştirilir
Yayınlanan: 2021-12-21Ödeme sırasında hata bildirimlerini güncellemenin yollarını mı arıyorsunuz? Seni koruduk. Bu kılavuzda, WooCommerce ödeme hata mesajlarını değiştirmek için size farklı yöntemler göstereceğiz.
Bir çevrimiçi mağaza çalıştırırken, bir noktada çatışmalar ve hatalarla karşılaşacaksınız. Ödeme sırasındaki genel sorunların nasıl çözüleceğini, Sepete Ekle düğmesi çalışmadığında ne yapılacağını ve Mağaza Sayfası boş olduğunda bazı çözümleri daha önce görmüştük. Bu eğitimde, WooCommerce ödeme hata mesajlarını değiştirmenin ve özel mesajlar oluşturmanın farklı yollarını göstereceğiz.
Bunu yapmanın farklı yollarına bakmadan önce, ödeme sayfasındaki hata mesajlarını özelleştirmenin faydalarını daha iyi anlayalım.
Ödeme Hata Mesajlarını Neden Değiştirmelisiniz?
Varsayılan olarak WooCommerce, temel ve oldukça genel ödeme hata mesajlarıyla birlikte gelir. Çoğu mağaza sahibi onları olduğu gibi bırakır, bu nedenle bu mesajları değiştirerek kalabalığın arasından kolayca sıyrılabilirsiniz.
Ödeme bildirimlerini değiştirmeden bırakmak, kaçırılmış büyük bir fırsattır. Ödeme, satışı kapatıp kapatmayacağınızı tanımladığı için en önemli andır. Ödeme sırasında bir hata olursa, alışveriş yapanlar geri adım atabilir ve sonunda satışı kaybedebilirsiniz. Ödeme sırasında bu hata mesajlarını özelleştirerek, bunlardan en iyi şekilde yararlanabilir ve müşterilere güvenliği sağlamak için neler olduğunu açıklayabilirsiniz.
Varsayılan olarak, WooCommerce, gerekli alanlar eksik olduğunda veya müşterinin tanıttığı ödeme yöntemi geçerli olmadığında hata mesajları görüntüler. Ödeme sırasında gördüğünüz tipik hata mesajları şunlardır:
Gördüğünüz gibi, netler ama onlarla yapabileceğiniz daha çok şey var. Örneğin, markanızı yansıtan öğeler ekleyebilir, daha fazla metin ekleyebilir vb.
Artık WooCommerce'deki ödeme hata mesajlarını neden değiştirmeniz gerektiğini bildiğinize göre, görevi nasıl tamamlayabileceğinizi görelim.
WooCommerce Ödeme Hata Mesajları Nasıl Değiştirilir
WooCommerce ödeme hata mesajlarını düzenlemenin iki yolu vardır:
- Eklentiler ile
- programatik olarak
Her iki yönteme de bir göz atalım, böylece becerilerinize ve ihtiyaçlarınıza göre doğru olanı seçebilirsiniz.
1) Ödeme hata mesajlarını eklentilerle özelleştirin
Kodlama becerileriniz yoksa veya WooCommerce hata mesajlarını düzenlemek için eklentileri kullanmayı tercih ediyorsanız, Say What eklentisini kullanabilirsiniz. Bu araç, tek bir kod satırı yazmadan veya şablon dosyalarını düzenlemeden web sitenizin dizelerini değiştirmenize yardımcı olur.
Ücretsiz sürüm temel özelliklerle birlikte gelirken, premium sürüm yıllık 39 USD'den başlar ve daha gelişmiş özelleştirme fırsatlarının kilidini açar.
Eklentiyi kurup etkinleştirdikten sonra sol tarafta yapılandırma seçeneklerini göreceksiniz. Buradan, değiştirmeniz gereken dizeyi seçebilir ve hedef içeriği girebilirsiniz. Bunu yaptıktan sonra Kaydet'e basın ve hepsi bu kadar.
Eklentiyle ilgili yardıma ihtiyacınız varsa, bir destek bileti oluşturabilir veya iletişim formunu kullanarak destek ekibine e-posta gönderebilirsiniz.
2) Ödeme hata mesajlarını programlı olarak düzenleyin
Bir eklenti kullanmak istemiyorsanız ve programlama becerisine sahipseniz, hata mesajlarını biraz kod ile düzenleyebilirsiniz. Bu bölümde, WooCommerce'deki hata mesajlarını değiştirmek için PHP'yi nasıl kullanacağınızı göstereceğiz.
Burada yapabileceğiniz çok şey var. Bu gösterim için, ödeme sayfasındaki varsayılan çoklu uyarılar yerine tek bir hata mesajı göstermeye odaklanacağız.
Bunu yapmak için temanın function.php dosyasını değiştireceğiz, bu yüzden başlamadan önce sitenizi yedeklemenizi ve henüz yoksa bir alt tema oluşturmanızı öneririz.
Ardından aşağıdaki kodu alt temanızın funtions.php dosyasına ekleyebilirsiniz. Daha önce belirtildiği gibi, ödeme sayfasında birkaç uyarı yerine tek bir hata mesajı görüntüleyecektir.
add_action('woocommerce_after_checkout_validation', 'dört katman', 9999, 2);
işlev dörtlü( $alanlar, $hatalar ){
// herhangi bir doğrulama hatası olması durumunda
if( !empty( $hatalar->get_error_codes() ) ) {
// mevcut tüm hata mesajlarını atla
foreach( $errors->get_error_codes() as $code ) {
$hatalar->kaldır( $kod);
}
// özel tek hata mesajını göster
$errors->add( 'validation', 'Özel Mesajınız Buraya Gidiyor!!!' );
}
}
Eğer koda daha yakından bakarsanız, fonksiyon olarak dörtlü katmanlar belirlediğimizi ve Özel Mesajınız Buraya Gidiyor !!! tek mesaj olarak. Bu snippet'i temel almaktan ve gereksinimlerinize göre ayarlamaktan çekinmeyin.
Bu gösteri için, aşağıda görebileceğiniz gibi kodu yapıştırmak için siteye özel bir eklenti kullanıyoruz.
Şimdi ön ucu kontrol edin, sepete herhangi bir ürün ekleyin ve ödeme sayfasına gidin. Herhangi bir zorunlu alanı doldurmadan satın alma işlemini tamamlamaya çalışırsanız aşağıdaki gibi bir hata görürsünüz:
Bu şekilde, WooCommerce ödeme hata mesajlarını biraz kodla değiştirebilirsiniz.
Gördüğünüz gibi, bu basit bir örnek. Müşterilerinizin alışveriş deneyimini iyileştirmek için bu yaklaşımı koşullu ile birleştirmenizi öneririz. Bununla ilgili daha fazla bilgi edinmek için WooCommerce ödemesine koşullu alanların nasıl ekleneceğine ilişkin kılavuzumuza bakın.
Şimdiye kadar, ödeme sırasında hata mesajlarını özelleştirmenin birkaç yolunu gördük. Ancak çevrimiçi mağazanızı geliştirmek için yapabileceğiniz daha çok şey var. Özel mesajları nasıl ekleyebileceğinizi görelim.
Özel Ödeme Mesajı Nasıl Eklenir
Bu bölümde, ödeme sayfanızda özel bir mesaj görüntülemeyi öğreneceksiniz. İlk olarak, kontrol panelinizde Sayfalar > Ödeme seçeneğine gidin.
Burada sayfa içeriğini değiştirebilir ve özel mesajları görüntüleyebilir, medya ekleyebilir ve çok daha fazlasını yapabilirsiniz. Varsayılan olarak, ödeme sayfası WooCommerce ödeme kısa kodunu içerir.
Ödeme alanlarından önce ve sonra özel bir mesaj görüntülemek istiyorsanız, paragraf bloğunu kullanabilirsiniz. Bu gösterim için, ödeme kısa kodundan önce ve sonra birer paragraf bloğu ekleyeceğiz. Bunları basitçe “İçerik Öncesi” ve “İçerik Sonrası” olarak adlandıracağız.
Sayfayı güncelledikten sonra, ön uçtan ödeme sayfasına bir göz atın ve yeni eklediğimiz özel mesajları göreceksiniz.
Benzer şekilde, ödeme sayfasına görseller, özel mesajlar, kupon kodları ve daha fazlası gibi her türlü içeriği ekleyebilirsiniz.
Hata Mesajı Konumu Nasıl Değiştirilir
Varsayılan olarak, WooCommerce hata mesajlarını sol tarafta görüntüler. İyi haber şu ki, bunu biraz CSS ile değiştirebilirsiniz. Bu bölümde, bir CSS snippet'i ile hata mesajı konumunu nasıl değiştirebileceğinizi göstereceğiz.
İlk olarak, WordPress yönetici kontrol panelinize giriş yapın ve Görünüm > Özelleştir'e gidin.
Özelleştirici'yi açın ve Ek CSS bölümüne gidin.
Burası CSS snippet'lerinizi ekleyebileceğiniz yerdir. WordPress özelleştirici, değişiklikleri canlı önizleme bölümünde görüntüler, böylece her güncellemeyi gerçek zamanlı olarak görebilirsiniz.
Bu parçacığı kopyalayıp sihirbaza yapıştırmanız yeterlidir.
form.checkout {
-ms-flex-sarma: sarma;
esnek sarma: sarma;
}
.woocommerce-NoticeGroup-checkout {
-webkit-box-flex: 1;
-ms-flex: 1 1 %100;
esnek: 1 1 %100;
maksimum genişlik: %100;
genişlik: %100;
kenar boşluğu-alt: 40 piksel;
üst kenar boşluğu:20 piksel;
}
.woocommerce-NoticeGroup-checkout ul.woocommerce-error {
pozisyon: göreceli;
üst: otomatik;
alt: otomatik;
sol: otomatik;
sağ:otomatik;
dolgu-sağ: 30px;
z-endeksi: otomatik;
imleç: varsayılan;
-ms-dönüşüm: yok;
dönüştürme: yok;
-webkit-dönüşüm: yok;
animasyon: yok;
-webkit-animasyon: yok;
}
.woocommerce-NoticeGroup-checkout ul.woocommerce-error: after {
içerik: yok;
}
.woocommerce-NoticeGroup-checkout ul.woocommerce-error.hidden-notice {
animasyon: yok;
-webkit-animasyon: yok;
}
Bu durumda, mesaja altta 40 piksel, üstte 20 piksel, sağda 30 piksel dolgu ve %100 genişlikte bir kenar boşluğu veriyoruz. Bu değerleri tercihlerinize göre ayarlayın ve değişiklikleri kaydetmeyi unutmayın.
Bonus: WooCommerce Hataları Nasıl Gizlenir
Bu kılavuzu bitirmeden önce, farklı bir alternatife bakalım. WooCommerce ödeme hata mesajlarını değiştirmek yerine hata mesajlarını gizlemek isterseniz ne olur? Durumunuz buysa, bu bölüm tam size göre. Size biraz kodla hataları nasıl kaldıracağınızı göstereceğiz.
Bazı çekirdek dosyaları düzenleyeceğimizden, sitenizin tam bir yedeğini oluşturduğunuzdan ve henüz yoksa bir alt tema kullandığınızdan emin olun.
Hataları gizlemek için wp-config.php dosyasını özelleştiriyoruz. Öncelikle, gerekirse geri yükleyebileceğiniz bir yedeğe sahip olmak için wp-config.php dosyasının bir kopyasını yerel bilgisayarınıza indirmenizi öneririz.
WordPress çekirdek dosyalarına erişmenin birkaç yolu vardır. Bu demo için Dosya Yöneticisi adlı özel bir eklenti kullanacağız. İlk olarak, kontrol panelinizde Eklentiler > Yeni Ekle'ye gidin ve Dosya Yöneticisi'ni arayın. Eklentiyi bulduktan sonra kurun ve web sitenizde etkinleştirin.
Aktivasyondan sonra sol tarafta eklentinin konfigürasyonunu göreceksiniz. wp-config.php dosyasını arayın.
Dosyaya sağ tıklayın ve Kod Düzenleyici seçeneğini seçin.
Dosyanın ortasında aşağıdaki satırlardan birini göreceksiniz:
define('WP_DEBUG', doğru);
veya
define('WP_DEBUG', yanlış);
Bulduğunuzda, bu satırı aşağıdaki kodla değiştirin ve dosyayı kaydedin:
ini_set('display_errors','Kapalı');
ini_set('hata_raporlama', E_ALL );
define('WP_DEBUG', yanlış);
define('WP_DEBUG_DISPLAY', yanlış);
Kod, tüm hata mesajlarını kapatacaktır.
Bu kadar! Şu andan itibaren mağazanız herhangi bir hata mesajı göstermeyecek.
Ödemeyi özelleştirmenin diğer yolları
Son olarak, WooCommerce ödemenizi daha da özelleştirmenin diğer yollarını görelim.
Ödeme için özel alanlar ekleyin
Bu bölümde, ödeme sayfasına nasıl özel alanlar ekleyebileceğinizi göstereceğiz.
Tahmin edebileceğiniz gibi, birçok farklı türde alan ekleyebilirsiniz. Bu gösteri için, alışveriş yapanlara bülteninize abone olma ve e-posta listenizi oluşturma seçeneği sunmak için ödeme sayfasının sonuna özel bir onay kutusu ekleyeceğiz.
Aşağıdaki betiği alt temanızın functions.php dosyasına yapıştırmanız yeterlidir:
// onay kutusu alanı add_action('woocommerce_after_order_notes', 'quadlayers_subscribe_checkout'); function quadlayers_subscribe_checkout( $checkout ) { woocommerce_form_field( 'abone', dizi( 'type' => 'onay kutusu', //'gerekli' => doğru, 'sınıf' => dizi('özel alan form-satır çapında'), 'label' => 'Bültenimize abone olun.' ), $checkout->get_value( 'abone' ) ); }
Gördüğünüz gibi, onay kutusunun yanına “Bültenimize abone olun” etiketini ekledik. Bunu baz alarak mağazanıza uyarlayabilirsiniz.
Alanları isteğe bağlı yap
Bir başka ilginç seçenek de zorunlu alanları isteğe bağlı yapmaktır. Bu sayede alışveriş yapanların sadece işlem için gerekli olan alanları doldurmasını sağlamış olursunuz. Bu şekilde, ödeme sürecini daha hızlı hale getirir ve müşterilerin deneyimini geliştirirsiniz.
Örneğin sanal ürünler satıyorsanız, aşağıdaki kodu alt temanızın functions.php dosyasına yapıştırarak Faturalama bölümündeki Adres alanını isteğe bağlı yapabilirsiniz.
add_filter('woocommerce_billing_fields', 'wc_address_field_opsiyonel'); function wc_address_field_opsiyonel( $alanlar ) { $fields['billing']['billing_address_1']['gerekli'] = false; $alanlarını döndür; }
Bununla ilgili daha fazla bilgi için WooCommerce ödemesini özelleştirme kılavuzumuza göz atın.
Çözüm
Özetle, ödeme bildirimlerini düzenleyerek, ödeme işleminize başka bir özelleştirme katmanı ekleyebilir ve rakiplerinizden sıyrılabilirsiniz.
Bu kılavuzda, WooCommerce ödeme hata mesajlarını değiştirmenin iki ana yolunu gördük: özel bir eklenti kullanarak ve programlı olarak biraz kodla. Bir eklenti kullanmak, kodlama becerisine sahip olmayan veya mağazalarını birkaç tıklamayla özelleştirmeyi tercih edenler için iyi bir alternatiftir.
Öte yandan, programlama bilginiz varsa ve daha fazla eklenti yüklemek istemiyorsanız, kendi çözümünüzü kodlayabilirsiniz. Bu size çok daha fazla esneklik sağlar ve istediğiniz her şeyi yapmanıza olanak tanır. Ana temanızı güncelledikten sonra özelleştirmenizi kaybetmemek için parçacığı alt temanıza yapıştırdığınızdan emin olun.
Umarız bu makaleyi faydalı bulmuşsunuzdur ve WooCommerce ödeme hata mesajlarını nasıl değiştireceğinizi öğrenmişsinizdir. Eğer yaptıysanız, lütfen bu gönderiyi sosyal medyada arkadaşlarınızla paylaşın.
Daha ilginç makaleler için şu yayınlara bir göz atın:
- Ödemeye Devam Et metni nasıl değiştirilir?
- En iyi WooCommerce ödeme eklentileri
- WooCommerce'de doğrudan ödeme bağlantıları nasıl oluşturulur