Sıfırdan WooCommerce E-Ticaret Teması Nasıl Yapılır?

YouTube'ta Takip Et →

Sıfırdan WooCommerce teması yazmadan önce WordPress eklentiler sayfasına girip WooCommerce eklentisini indirmemiz ve etkinleştirmemiz gerekiyor. Etkinleştirdikten sonra WooCommerce kurulumunu yapıyoruz.

WooCommerce eklentisini kurduğunuzda, eklenti Mağaza, Ödeme, Hesabım, Sepet gibi otomatik olarak yeni sayfalar ekliyor. Dilerseniz Mağaza sayfasını menü olarak ekleyerek ulaşımı kolaylaştırabilirsiniz. Birkaç örnek ürün ekleyerek de Mağaza sayfasında ürünlerin görüntülenmesini sağlayabilirsiniz.

Bu içerik ilginizi çekebilir.

Yeni oluşturduğumuz temanın functions.php dosyasına aşağıdaki kodu yazarak, bu temanın WooCommerce de kullanacağını ifade ediyoruz. Böylece ürün sayfaları varsayılan olarak WooCommerce’in varsayılan şablonları ile eşleşecek.

function sg_woocommerce_support() {
    add_theme_support( 'woocommerce' );
}

add_action( 'after_setup_theme', 'sg_woocommerce_support' );

Tema klasörü içerisinde yeni bir dosya oluşturalım, ismi de woocommerce.php olsun. Oluşturduğumuz bu sayfanın içine de <?php woocommerce_content(); ?> kodunu yazalım. Böylece WooCommerce içerikleri bu sayfa üzerinde görünecek.

Cart ve Checkout sayfaları birer sayfa olarak WordPress’e eklenirler. Bu nedenle alışveriş sayfaları için ayrı bir Page Template oluşturmamız gerekiyor. template-shop.php ismiyle yeni bir dosya oluşturalım. Page.php kodlarını bu sayfaya taşıyalım ve sayfanın üst tarafına aşağıdaki kodu ekleyerek Page Template olarak görünmesini sağlayalım.

<?php /* Template Name: Shop Template */ ?>

Sonrasında eklentiler klasöründeki WooCommerce eklentisinin altındaki templates klasörünü kendi tema klasörümüze aktarıyoruz. Bu klasörü, kendi temamıza aktarmamızın nedeni WooCommerce tema dosyaları üzerinde düzenleme yapmak. Aktardığımız klasörün ismini de woocommerce olarak değiştirelim.

WordPress önce tema klasörünün içerisindeki woocommerce klasörünün içindeki dosyalara bakar. Eğer burada ilgili dosyalar yoksa, eklenti klasöründeki templates klasörüne bakar. Tema içerisindeki woocommerce klasörüne sadece üzerinde değişiklik yapmamız gereken dosyaların bulunması yeterli, diğerlerini silebiliriz böylelikle.