Wordpress

WooCommerce E-ticaret Sitenizi Geliştirmek İçin Pratik Fonksiyonlar

WooCommerce E-ticaret Sitenizi Geliştirmek İçin Pratik Fonksiyonlar

Merhaba arkadaşlar, e-ticaret dünyasında rekabet artarken, WooCommerce kullanıcı deneyimini geliştirmek için basit ve etkili stratejilerle öne çıkmak önemlidir. Bu yazıda, WooCommerce e-ticaret sitenizde uygulayabileceğiniz küçük dokunuşlar ve pratik fonksiyonlar hakkında keyifli bilgiler bulacaksınız. Küçük ve orta ölçekli işletmeler için tasarlanmış bu pratik çözümlerle müşterilerinizi elde tutun ve unutulmaz bir alışveriş deneyimi sunun. İyi okumalar!

Sepeti Temizle Butonu

Bu özel kod parçacığı, WooCommerce alışveriş sepetinde bulunan tüm ürünleri temizlemek için bir “Sepeti Boşalt” butonu ekler. Bu buton, müşterilere kolaylık sağlayarak istenmeyen ürünleri sepetten kaldırmalarına olanak tanır.

Woocommerce sepeti temizle butonu
add_action("woocommerce_cart_actions", "woo_empty_cart_button");
function woocommerce_empty_cart_button()
{
    echo '<a href="' .
        esc_url(add_query_arg("empty_cart", "yes")) .
        '" class="button" title="' .
        esc_attr("Sepeti boşalt", "woocommerce") .
        '"> <center>' .
        esc_html("Sepeti boşalt", "woocommerce") .
        "</center></a>";
}

// empty the cart and refresh the page (redirects to the cart page)
add_action("wp_loaded", "woo_empty_cart_action", 20);
function woocommerce_empty_cart_action()
{
    if (isset($_GET["empty_cart"]) && "yes" === esc_html($_GET["empty_cart"])) {
        WC()->cart->empty_cart();
        $referer = wc_get_cart_url();
        wp_safe_redirect($referer);
    }
}

Sepet Toplam Kazancı Göster

Bu fonksiyon, müşterilere alışveriş sepetlerindeki toplam kazancı gösterir. Sepet içerisindeki ürünlerden kaynaklanan indirimleri ve vergi miktarını toplam kazanca ekleyerek kullanıcıların tasarruf ettikleri tutarı gösterir.

function vono_total_earnings()
{
  global $woocommerce;

  $subtotal = $woocommerce->cart->get_subtotal();
  $allTotal = $woocommerce->cart->total;
  $totalTax = $woocommerce->cart->get_total_tax();

  $totalEarningsCal =
    $subtotal > $allTotal ? $subtotal - $allTotal + $totalTax : false;

  $totalEarnings = wc_price($totalEarningsCal);

  if ($totalEarningsCal > 0) {
    echo <<<HTML
	<table cellspacing="0" class="shop_table shop_table_responsive">
		<tbody>
			<tr class="total_winning">
				<th>Toplam Kazancın</th>
				<td data-title="Toplam Kazancın" style="color: var(--wc-green); font-weight: 700;">{$totalEarnings}</td>
			</tr>
		</tbody>
	</table>
HTML;
  }
}

add_action("woocommerce_proceed_to_checkout", "vono_total_earnings", 0);

WooCommerce’de Kuponu Otomatik Olarak Uygulama

Bu kod, belirli bir kupon kodunu URL üzerinden otomatik olarak sepete uygular. Müşteriler, özel bir URL kullanarak belirli bir kupon avantajından otomatik olarak yararlanabilirler.

WooCommerce E-ticaret Sitenize 8 Farklı Kampanya Oluşturma [Eklenti Olmadan]

function coupon_code_to_session()
{
    if (isset($_GET["coupon_code"])) {
        // Ensure that customer session is started

        if (!WC()->session->has_session()) {
            WC()->session->set_customer_session_cookie(true);
        }

        // Check and register coupon code in a custom session variable

        $coupon_code = WC()->session->get("coupon_code");

        if (empty($coupon_code) && isset($_GET["coupon_code"])) {
            $coupon_code = esc_attr($_GET["coupon_code"]);

            WC()->session->set("coupon_code", $coupon_code); // Set the coupon code in session
        }
    }
}

add_action("init", "coupon_code_to_session");

function apply_discount()
{
    // Set coupon code
    $coupon_code = WC()->session->get("coupon_code");

    if (!empty($coupon_code) && !WC()->cart->has_discount($coupon_code)) {
        WC()->cart->add_discount($coupon_code); // apply the coupon discount

        WC()->session->__unset("coupon_code"); // remove coupon code from session
    }
}

add_action("woocommerce_before_cart_table", "apply_discount", 10, 0);

//https://example.com/?coupon_code=10OFF

Woocommerce Ürünlere Kademeli Yıldız Rozeti Ekleme

Kademeli Yıldız Rozeti Nedir? Kademeli yıldız rozeti, ürünlerin değerlendirildiği bir liste veya platformda sıkça kullanılan bir özelliktir. Bu rozet, ürünlerin aldığı puanlara dayalı olarak görüntülenen bir işarettir. Her yıldız rozeti, ürünün aldığı puanı temsil eder. Örneğin, bir ürün 5 yıldız puan aldıysa, ürünün yanında 3 yıldızlı bir rozet resmi görüntülenir. Benzer şekilde, 4 yıldız puan alan bir ürün için 2 yıldızlı bir rozet resmi ve 3 yıldız puan alan bir ürün için 1 yıldızlı bir rozet resmi kullanılır.

add_action("woocommerce_before_shop_loop_item_title", "star_badge_badge_shop_page", 10);

function star_badge_badge_shop_page()
{
    global $product;
    $average = $product->get_average_rating();
    if (5 == $average) {
        echo '<img class="onsale" src="https://localhost/trywordpress/wp-content/uploads/2023/08/3yildiz.png" style="width:65px; height:65px; transform: translateY(70px);"> ';
    } elseif (4 <= $average && $average < 5) {
        echo '<img class="onsale" src="https://localhost/trywordpress/wp-content/uploads/2023/08/2yildiz.png" style="width:65px; height:65px; transform: translateY(70px);"> ';
    } elseif (3 <= $average && $average < 4) {
        echo '<img class="onsale" src="https://localhost/trywordpress/wp-content/uploads/2023/08/1yildiz.png" style="width:65px; height:65px; transform: translateY(70px);"> ';
    }
}

WooCommerce Mağaza Sayfasında Kayan Sepet Tutarı Gösterimi

Bu özel fonksiyon, WooCommerce mağaza sayfalarını daha etkileşimli ve kullanıcı dostu hale getirmek için tasarlanmıştır. Sayfanın alt kısmına eklenen kayan sepet tutarı göstergesi, müşterilere anlık bilgiler sunarak alışveriş deneyimini daha şeffaf ve kullanıcı odaklı hale getirir.

Örnek: Show floating cart amount with woocommerce ajax

<?php
// örnek: https://fpexper.com/urun-listeleme/
add_action('woocommerce_after_shop_loop', 'vono_output_content_wrapper_end', 10);

function vono_output_content_wrapper_end()
{
  $cartTotal =  WC()->cart->get_cart();
  $cartAmount = WC()->cart->get_cart_contents_total();
  $cartUrl = wc_get_cart_url();
  $display = (count($cartTotal) > 0) ? "display: flex; opacity: 1;" : "display: none; opacity: 0;";
  // if (count($cartTotal) > 0) {
?>
  <style>
    .floating-cart {
      background-color: #4CAF50;
      border: 3px solid rgba(0, 0, 0, .1);
      color: #fff;
      opacity: 0;
      flex-flow: row nowrap;
      justify-content: space-between;
      padding: .7rem 3rem;
      align-items: center;
      position: fixed;
      bottom: 2.3em;
      left: 50%;
      transform: translateX(-50%);
      z-index: 9999;
      gap: 150px;
      transition: all 0.6s linear 0.4s;
    }

    .vono-cart {
      padding: .618em 1em !important;
    }

    .floating-cart-info::before {
      content: "\e016";
      font-family: 'WooCommerce';
      margin-right: .6em;
    }

    .vono-cart::after {
      content: "\e029";
      font-family: 'WooCommerce';
      margin-left: .6em;
    }

    @media only screen and (max-width: 600px) {
      .floating-cart {
        width: 100%;
        bottom: 0;
        padding: .7rem;
        gap: 50px;
      }
    }
  </style>
  <div class="floating-cart woocommerce" id="floating-cart" style="<?= $display ?>;">
    <div>
      <strong><?= count($cartTotal) . ' Ürün | ' . wc_price($cartAmount) ?></strong><br>
      <small class="floating-cart-info">Ek ücretler ve indirimler sepette hesaplanmaktadır.</small>
    </div>
    <div><a class="vono-cart wp-block-button wp-block-button__link no-border-radius" href="<?= $cartUrl ?>">Sepet</a></div>
  </div>
<?php

}

//ürün sepete eklendikten sonra sayfa yenilemeden fiyat güncelleme
add_filter('woocommerce_add_to_cart_fragments', 'wc_refresh_mini_cart_count');
function wc_refresh_mini_cart_count($fragments)
{
  ob_start();
  $cartTotal =  WC()->cart->get_cart();
  $cartAmount = WC()->cart->get_cart_contents_total();
  $cartUrl = wc_get_cart_url();
?>
  <div class="floating-cart woocommerce" id="floating-cart" style="display: flex; opacity: 1;">
    <div>
      <strong><?= count($cartTotal) . ' Ürün | ' . wc_price($cartAmount) ?></strong><br>
      <small>Ek ücretler ve indirimler sepette hesaplanmaktadır.</small>
    </div>
    <div><a class="vono-cart button" href="<?= $cartUrl ?>">Sepet</a></div>
  </div>
<?php
  $fragments['#floating-cart'] = ob_get_clean();
  return $fragments;
}

BKZ: https://rudrastyh.com/woocommerce/get-number-of-items-in-cart.html

WooCommerce Sayfa Yapısını Özelleştirme

Kod parçası, sayfalama slug’ını değiştirmek ve URL’yi optimize etmek için gerekli ayarları günceller. $newSlug değişkeni, sayfalama slug’ını belirlemek için kullanılır ve bu sayede sayfaların daha anlaşılır ve kullanıcı dostu bir yapıda olmasını sağlar.
Standart Sayfalama Yapısı: siteadi.com/magaza/page/2/
Özelleştirilmiş Sayfalama Yapısı: siteadi.com/magaza/sayfa/2/

add_action('init', 'woocommerce_shop_page_change');

function woocommerce_shop_page_change()
{
  global $wp_rewrite;

  $newSlug = "sayfa"; #yeni URL parçası
  $shopPageSlug = get_page_uri(get_option('woocommerce_shop_page_id'));

  $wp_rewrite->pagination_base = $newSlug;  //where new-slug is the slug you want to use ;)
  unset($wp_rewrite->extra_rules_top[$shopPageSlug. "/page/([0-9]{1,})/?$"]);
  $wp_rewrite->extra_rules_top[$shopPageSlug. '/' . $newSlug . '/([0-9]{1,})/?$'] = 'index.php?post_type=product&paged=$matches[1]';

}

Ürün Varyasyonlarını URL ile Senkronize Etme

Bu kod, WooCommerce ile geliştirilen bir WordPress web sitesindeki ürün sayfalarında yer alan varyasyon seçeneklerini, kullanıcıların seçtikleri değerleri URL üzerinden görüntülemelerini ve paylaşmalarını sağlar. Bu sayede, kullanıcılar belirli bir ürünün belirli varyasyonlarını seçtiklerinde, sayfanın URL’si otomatik olarak güncellenir, böylece seçilen varyasyonlar paylaşılabilecek ve daha sonra tekrar ziyaret edildiğinde önceden seçilmiş olarak görüntülenebilecektir.

<?php
add_action('wp_footer', 'product_variation_url_change');

function product_variation_url_change()
{
  ?>
  <script>
    jQuery(document).ready(function($) {
      // Seçilen seçeneklere bağlı olarak URL'yi güncelleme işlevi
      function updateURL(select) {
        var currentURL = window.location.href;
        var selectedValue = select.val();
        var attributeName = select.data('attribute_name');
        var newAttributeName = attributeName.replace('attribute_', 'v_');

        // URL'den parametreleri al
        var url = new URL(currentURL);
        var searchParams = new URLSearchParams(url.search);

        // Parametreyi yeni öznitelik adıyla güncelle veya ekle
        searchParams.set(newAttributeName, selectedValue);

        // Eski parametreyi sil, eğer varsa
        searchParams.delete(attributeName);

        // Güncellenmiş parametrelerle URL'yi yeniden oluştur
        url.search = searchParams.toString();
        var newURL = url.toString();

        // Sayfayı yeni URL kullanarak güncelle
        window.history.replaceState({}, document.title, newURL);
      }

      // URL parametrelerine bağlı olarak seçili seçenekleri ayarlamak için
      $('.variations select').each(function() {
        var attributeName = $(this).data('attribute_name');
        var newAttributeName = attributeName.replace('attribute_', 'v_');
        var paramValue = new URLSearchParams(window.location.search).get(newAttributeName);

        if (paramValue) {
          $(this).val(paramValue);
          updateURL($(this)); // Sayfa yüklendiğinde URL'yi güncelleyin
        }
      });

      // Diğer seçeneklerdeki değişiklikleri dinle
      $('.variations select').on('change', function() {
        updateURL($(this)); // Seçenek değişikliklerinde URL'yi güncelleyin
      });
    });
  </script>

<?php
}

Sevgili Okuyucularımız, Sizlere bilgi, eğlence ve ilham dolu içerikler sunabildiysek ne mutlu bize. Eğer yazımızda herhangi bir düzeltme veya öneri sunmak isterseniz, lütfen yorum yapmaktan çekinmeyin. Sizden gelen geri bildirimler, içeriklerimizi daha da geliştirmemiz için bize büyük bir yardımcı olacaktır. Teşekkür ederiz!
Unutmayın! Paylaşmak; kazanmanın en hızlı ve kolay yoludur. Bir sonraki makalede görüşmek dileğiyle esen kalın.

Bu makale yardımcı oldu mu?
EvetHayır

Paylaş

3 yorum

Bir yanıt yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir