Wordpress

Woocommerce kategorilerini alt kategoriler ile göstermek

Wordpress birçok eklentiye ev sahipliği yapmaktadır. Şüphesiz en çok tercih edilen eklentilerin arasında yer alan Woocommerce eklentisini birçoğunuz duymuşsunuzdur. Woocommerce eklentisi ile birlikte web sitenizi e-ticaret sitesi haline kolaylıkla getirebilirsiniz. Bu yazımda Woocommerce kategorilerini alt kategoriler ile göstermek için ne yapmamız gerekiyor. Hangi kod bloklarını nereye nasıl ekleyeceğiz buna değinmeye çalışacağım.

Bazı Woocommerce için uyumlu olmayan temalarda shop (mağaza) sayfasında kategorileri istediğiniz gibi gösteremeyebilirsiniz. Tema ayarları sayfasında da bu duruma müdahale edemeyeceğiniz bir alan bulunmayabilir. En güzel çözüm güncel woocommerce desteği ve özellikleri sunan bir temaya geçiş yapmaktadır. Fakat mevcut temanızı kullanmak istediğiniz de ise manuel müdahaleler gerçekleştirerek temanıza ürün kategorilerinizi gösterebilirsiniz.

Woocommerce mağaza sayfanızda kategorileri göstermek istediğinizde tema dosyalarınıza ve bazen de Woocommerce eklentisinin dosyalarına erişmeniz gerekmektedir. Mevcut kodlarınıza müdahale etmeden önce lütfen yedek almayı unutmayınız. Kod yapılarına giriş seviyesinde bir hakimiyetiniz yok ise lütfen kod bloklarına müdahale etmeyiniz.

Kategori sayfanıza wp-content/theme/tema-adiniz/woocommerce.php dosyasından erişim sağlayabilirsiniz. Bu dosya yolu temanızın yerleşimine göre değişiklik gösterebilmektedir. Tema klasörünüz içerisinde woocommerce ait bir dosya bulamazsanız wp-content/plugins/woocommerce klasörü içerisini lütfen kontrol ediniz.

Woocommerce Tüm Ürün Kategorilerini Göstermek

Sizlere iki farklı kod bloğu vereceğim bu kod bloklarıyla istediğiniz yerde kategorilerinizi alt kategorileriniz ile birlikte gösterebileceksiniz. Aşağıdaki kod bloğunu kategorileri göstermek istediğiniz yere yerleştirerek bir listeleme elde edebilirsiniz. Görünüm konusunda css ile müdahalelerde bulunabilir gerekli html yerlerine class’lar ekleyerek çözüme ulaşabilirsiniz.

$args = array(
          'taxonomy' => 'product_cat',
          'hide_empty' => false,
          'parent'   => 0
      );
  $product_cat = get_terms( $args );

  foreach ($product_cat as $parent_product_cat)
  {

  echo '
      <ul>
        <li><a href="'.get_term_link($parent_product_cat->term_id).'">'.$parent_product_cat->name.'</a>
        <ul>
          ';
  $child_args = array(
              'taxonomy' => 'product_cat',
              'hide_empty' => false,
              'parent'   => $parent_product_cat->term_id
          );
  $child_product_cats = get_terms( $child_args );
  foreach ($child_product_cats as $child_product_cat)
  {
    echo '<li><a href="'.get_term_link($child_product_cat->term_id).'">'.$child_product_cat->name.'</a></li>';
  }

  echo '</ul>
      </li>
    </ul>';
  }

Woocommerce Mevcut Ürün Kategorisinin Alt Kategorilerini Göstermek

Woocommerce kategorilerini alt kategoriler ile göstermek

Üste paylaşmış olduğum kod bloğunu eklediğinizde tüm ürün kategorileriniz ve mevcut olan alt kategorileri gösterilmektedir. Şimdi vereceğim kod bloğu mutlaka kategori sayfanızın içerisine eklenmektedir. Woocommerce desteği olmayan temalarda genellikle dosya yolu wp-content/theme/tema-adiniz/woocommerce.php şeklinde olacaktır. Bazı durumlarda archive-product.php olarak da dosyaya erişim sağlayabilirsiniz. Burada kategori sayfanızın temanızın içerisinde nerede olduğunu bulmanız sizin işinizi kolaylaştıracaktır.

Aşağıda paylaştığım kod bloğunu mutlaka kategori sayfasına eklemeniz gerekmektedir. Çünkü mevcut kategoriyi çekip sizlere alt kategoriyi göstereceği için mevcut kategori sayfasının içerisinde bulunmaktadır.

if ( is_product_category() ) {

    $term_id  = get_queried_object_id();
    $taxonomy = 'product_cat';

    // Get subcategories of the current category
    $terms    = get_terms([
        'taxonomy'    => $taxonomy,
        'hide_empty'  => true,
        'parent'      => get_queried_object_id()
    ]);

    $output = '<ul class="subcategories-list">';

    // Loop through product subcategories WP_Term Objects
    foreach ( $terms as $term ) {
        $term_link = get_term_link( $term, $taxonomy );

        $output .= '<li class="'. $term->slug .'"><a href="'. $term_link .'">'. $term->name .'</a></li>';
    }

    echo $output . '</ul>';
}

Kod bloklarını dediğim yerlere ekleyerek ve istediğiniz classları ekleyerek css düzenlemesiyle güzel görüntüler elde edebilirsiniz. Yazımı beğendiyseniz yorum yapmayı ve paylaşmayı sakın unutmayın.

Woocommerce stokta olmayan ürünleri göstermek isterseniz diğer yazılarımı kontrol edebilirsiniz.

Sercan Sevinçer

SEO Uzmanı & WordPress Web Tasarım Uzmanı

İlgili Makaleler

Bir yanıt yazın

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

Başa dön tuşu