WooCommerce fiyatları nasıl biçimlendirilir

Tasarım, sunum veya mağaza veya marka temasıyla tutarlı olması nedeniyle, fiyatlarımızı genellikle farklı formatlarda göstermek isteyebiliriz. Bu gönderide, Kod Düzenleyicinin yanı sıra Ayarlar seçeneğini kullanarak WooCommerce fiyatlarının nasıl biçimlendirileceğini öğreneceksiniz.

Yazı şu üç noktayı kapsıyor:

1. Ondalık Ayırıcıları Değiştirme
2. Bin Ayırıcının Değiştirilmesi
3. Kalın, italik veya altı çizili gibi stiller uygulamak için Fiyatları Biçimlendirme

1. Ondalık Ayırıcıların Değiştirilmesi:

Çoğu zaman, ürün fiyatlarınızda ondalık değerler olabilir. Fiyatların sebzelerin ağırlığına göre belirlendiği çevrimiçi bir markette bu oldukça yaygındır:

Birçok ülkede ondalık ayırıcı nokta (.) ile gösterilir. Ancak bu, İspanya, Güney Afrika, Brezilya, İsveç, Çin ve ondalık ayırıcının virgül olduğu diğer 70 ülke gibi birçok başka ülke için geçerli değildir.

Brezilya gibi ülkeler bazen binleri ayırmak için nokta (.) kullanır. Örneğin on iki bin beş yüz “12.500” değil “12.500” hatta “12 500” olarak yazılır.

Bu nedenle, belirli bir kitle veya milliyet için bir mağaza tasarlarken fiyatların farklı şekilde gösterilmesi gerekir. WooCommerce'de ondalık noktaları nasıl virgül veya boşluklarla değiştirebileceğimizi göreceğiz.

Bunu doğrudan WooCommerce Ayarları veya kod düzenleyici aracılığıyla yapmanın iki yolu vardır.
WooCommerce Ayarları ile Ondalık Ayırıcıyı Değiştirme
Farenizi WordPress panonuzdaki WooCommerce etiketinin üzerine getirin ve Ayarlar'a tıklayın. WooCommerce->Ayarlar'da, aşağı kaydırırken Genel sekmesi aşağıdakileri gösterir:

Burada “Ondalık Ayırıcı”nın değerini “.”dan değiştirebilirsiniz. ile ","

Bunu yapmak ve "Değişiklikleri Kaydet"e tıklamak, ondalık noktayı virgül olarak görüntüler:

Bu sayede dilediğiniz ayırıcıyı kullanabilirsiniz.
Kod düzenleyici aracılığıyla Ondalık Ayırıcıyı Değiştirme
WooCommerce, ondalık ayırıcıyı değiştirmek için doğrudan bir yol sağlarken, bunu kod aracılığıyla yapmayı öğrenmek faydalıdır. Bu örnekte, kod düzenleyiciyi kullanarak ondalık noktanın bir boşlukla nasıl değiştirileceğini göstereceğiz.

Bunu yapmak için alt temanızın functions.php dosyasına ekleyebileceğiniz küçük bir kod parçacığı var. (Neden doğrudan function.php dosyasını değil de alt temanın functions.php dosyasını düzenlediğimizi öğrenmek için bu yazıyı okuyun.)

Kod Parçacığı:

 add_filter('wc_price', 'woo_hide_decimal_point', 10, 4);
function woo_hide_decimal_point($dönüş, $fiyat, $args, $formatted_price) {
$birim = iç değer( $fiyat);
$ondalık = sprintf( '%02d', ( $fiyat-$birim ) * 100 );
return sprintf( '%s %d %s', get_woocommerce_currency_symbol(), $birim, $decimal );
}

Sonuç, ondalık noktanın kaldırılması ve bir boşlukla değiştirilmesidir:

Not: Kod, yalnızca ondalık ayırıcıyı “.” olarak ayarladıktan sonra çalışır. WooCommerce->Ayarlar'da.

Kodu biraz değiştirerek boşluğu benzer şekilde virgülle değiştirebilirsiniz.

 add_filter('wc_price', 'woo_replace_decimal_point', 10, 4);
function woo_replace_decimal_point($dönüş, $fiyat, $args, $formatted_price) {
$birim = iç değer( $fiyat);
$ondalık = sprintf( '%02d', ( $fiyat-$birim ) * 100 );
return sprintf( '%s %d,%s', get_woocommerce_currency_symbol(), $birim, $decimal );
} 

Ondalık ayırıcıyı değiştirmek için WooCommerce->Ayarlar üzerinden kod parçacıkları kullanmak neden daha iyidir:

Ondalık noktaları değiştirmek için WooCommerce->Ayarlar yerine kod düzenleyiciyi kullanmanın birçok avantajı vardır.

Birincisi, fiyatı istediğiniz gibi biçimlendirebilmenizdir. Yukarıdaki resimde dikkat ederseniz, para birimi simgesinden sonra fiyatta bir boşluk var. Ondalık noktanın WooCommerce->Ayarlar aracılığıyla değiştirildiği bu gönderinin ilk ekran görüntüsünde bu alan eksik.

Diğer bir avantaj, bu değişikliklerin mağazanızın tüm ürünleri için değil, yalnızca belirli bir ürün için yapılmasını istediğiniz zamandır. Kod düzenleyiciyi kullanmak size bu esnekliği sağlar.

Kod parçacıkları kullanarak, <b>,<u>,<i>,<sup>,<sub> ve daha pek çok HTML etiketi ekleyerek fiyatın ondalık kısmını farklı stillerde görüntüleyebilirsiniz.

Örnek: Fiyatın ondalık kısmına alt çizgi ekleme.

 add_filter('wc_price', 'woo_format_decimal_value', 10, 4); 
function woo_format_decimal_value($dönüş, $fiyat, $args, $biçimlendirilmemiş_fiyat) { 
$birim = iç değer( $fiyat); 
$ondalık = sprintf( '%02d', ( $fiyat-$birim ) * 100 ); 
return sprintf( '%s %d.<u>%s</u>', get_woocommerce_currency_symbol(), $birim, $decimal ); 
}

Yukarıdaki kod parçacığı, alt temanın functions.php dosyasına eklendiğinde, fiyatın ondalık kısmına bir alt çizgi ekler:

Diğer HTML etiketlerini de aynı şekilde kullanabilirsiniz. Ondalık değeri bir üst simge veya alt simge olarak nasıl görüntüleyebileceğinizi bilmek istiyorsanız, bu yazıyı okuyun.

2. Bin Ayırıcının Değiştirilmesi:

Tıpkı ondalık ayırıcıların bazı ülkelerde farklı görüntülenmesi gibi, bin ayırıcılarda da durum böyledir.

Örneğin Brezilya, Güney Afrika veya İspanya gibi ülkelerde binlik ayırıcı bir boşluk veya nokta/nokta ile gösterilir. Bu ülkelerde on üç bin beş yüz 13 500 veya 13.500 olarak yazılabilir.

Mağazanızı bu kitle için tasarlarken binlik ayırıcısını buna göre düzenlediğinizden emin olmalısınız.

Tıpkı ondalık ayırıcılar gibi, bunu da WooCommerce->Ayarlar veya kod düzenleyici aracılığıyla yapmanın iki yolu vardır.
WooCommerce Ayarları ile Bin Ayırıcıyı Değiştirme
Farenizi WordPress panonuzdaki WooCommerce etiketinin üzerine getirin ve Ayarlar'a tıklayın. WooCommerce->Ayarlar'da, aşağı kaydırırken Genel sekmesi aşağıdakileri gösterir:

Bin ayırıcı metin kutusundaki değerin virgül (“”) yerine bir boşlukla değiştirilmesi, binlik ayırıcının görüntülenme şeklini değiştirecektir. Bu kutuya bir boşluk girmeniz gerektiğini unutmayın. Basitçe virgülün silinmesi, binlik ayırıcının boşlukla değişmesine neden olmaz.

"Değişiklikleri kaydet"e tıklayın ve ürünü görüntüleyin:

Artık binlik ayırıcının yerinde bir boşluk olduğunu görebilirsiniz.

Herhangi bir karışıklığı önlemek için, ondalık değeri olmayan fiyatlar için WooCommerce->Ayarlar aracılığıyla ondalık basamakları “0” olarak ayarlayabilirsiniz:

Burada ondalık sayıları “0” olarak girdikten sonra “Değişiklikleri kaydet”e tıklayın ve ürünü tekrar görüntüleyin:

Kod düzenleyici aracılığıyla Bin Ayırıcıyı Değiştirme

Benzer şekilde binlik ayırıcıyı da kod parçacıkları kullanarak değiştirebiliriz. Yukarıda ondalık ayırıcı bölümünde bahsedildiği gibi, kodu istediğimiz gibi özelleştirebileceğimiz veya şekillendirebildiğimiz için kod düzenleyiciyi kullanmanın her zaman daha fazla avantajı vardır ve hatta tüm mağaza için olmasa bile belirli bir ürün için.

Şimdi bir kod parçacığı kullanarak binlik ayırıcıyı nokta (.) olarak değiştirmeye çalışalım.

Not: Bunun için bir ön koşul, WooCommerce->Ayarlar'da binlik ayırıcı kutusunu boş bırakmanız gerektiğidir. Boşluk da yok.

 add_filter('wc_price', 'woo_format_thousand_separator', 10, 4); 
function woo_format_thousand_separator($dönüş, $fiyat, $args, $formatted_price) 
{ 
  $formatted_price=number_format($fiyat,0,' ','.'); 
  return sprintf( '%s %s', get_woocommerce_currency_symbol(), $formatted_price); 
}

sayı_biçimi işlevi, 4 bağımsız değişkeni kabul eden yerleşik bir PHP işlevidir:

1. Sayı veya bizim durumumuzda fiyat.
2. Ondalık basamak sayısı. Herhangi bir ondalık değer görüntülemek istemediğimiz için 0'a ayarladık.
3. Kullanmak istediğiniz ondalık ayırıcı. Bunu boş bir değere ayarladık.
4. Bin ayırıcı. Bunu nokta (.) olarak belirledik.

Bu kod parçacığı, alt temanızın function.php dosyasına eklendiğinde, binlik ayırıcıyı aşağıdaki ekran görüntüsünde gösterildiği gibi nokta veya nokta (.) olarak görüntüler:

3. WooCommerce Fiyatlarını Biçimlendirme:

Artık ondalık değerleri ve binlik ayırıcıları nasıl biçimlendireceğinizi bildiğinize göre, aynı şey genel olarak fiyatlar için de geçerlidir. Ayarlar seçeneğini kullanarak bu değerleri doğrudan biçimlendiremezsiniz, ancak yukarıdaki kodda küçük değişiklikler yaparak Kod Düzenleyiciyi kullanarak bunu yapabilirsiniz.

Örnek: Ürün fiyatının italik olarak yazılması.

Varsayılan durumlarda, ürün fiyatı aşağıdaki gibi görüntülenir:

Buna bir stil eklemek isterseniz, örneğin italik olarak yazmak isterseniz?

Yukarıdaki kod parçacıklarında küçük değişiklikler yaparak bunu başarabilirsiniz.

Bu kodu alt temanızın functions.php dosyasına kopyalamanız yeterlidir:

 add_filter('wc_price', 'woo_format_price_italics', 10, 4); 
function woo_format_price_italics($dönüş, $fiyat, $args, $formatted_price) { 
$birim = iç değer( $fiyat); 
$ondalık = sprintf( '%02d', ( $fiyat-$birim ) * 100 ); 
return sprintf( '<i>%s %d.%s</i>', get_woocommerce_currency_symbol(), $birim, $decimal ); 
}

Bunu yapmak, fiyatı ondalık noktayla birlikte italik olarak görüntüler:

Kod parçacığında küçük bir değişiklik de ondalık bölümün görüntülenmesini engeller:

 add_filter('wc_price', 'woo_format_price_italics', 10, 4); 
function woo_format_price_italics($dönüş, $fiyat, $args, $formatted_price) { 
$birim = iç değer( $fiyat); 
return sprintf( '<i>%s %d</i>', get_woocommerce_currency_symbol(), $birim); 
}

Gördüğünüz gibi, fiyatı ondalık kısım olmadan burada italik olarak görüntüleyebilirsiniz:

Snippet'i incelemek, WooCommerce fiyatlarını kendi yöntemlerinizle kolayca biçimlendirmenizi sağlayacaktır.