# Integrasi WooCommerce

Xionic menyediakan integrasi mendalam dengan WooCommerce tanpa memerlukan plugin tambahan. Kode integrasi diisolasi di folder core/WooCommerce/.

# Fitur Integrasi Utama

# 1. Deklarasi Dukungan Native

Tema mendeklarasikan dukungan WooCommerce secara formal melalui:

add_theme_support('woocommerce', array(
    'thumbnail_image_width' => 400,
    'single_image_width'    => 800,
    'product_grid'          => array(
        'default_rows'    => 4,
        'min_rows'        => 2,
        'max_rows'        => 8,
        'default_columns' => 4,
        'min_columns'     => 2,
        'max_columns'     => 6,
    ),
));

# 2. Dukungan Galeri Produk Modern

Mendukung secara native fitur galeri produk bawaan WooCommerce:

• wc-product-gallery-zoom (Zoom gambar saat kursor melayang).
• wc-product-gallery-lightbox (Modal popup layar penuh gambar produk).
• wc-product-gallery-slider (Slider swipe touch-friendly pada perangkat seluler).

# 3. Pembersihan Wrapper & Keselarasan Grid Bootstrap

Wrapper default WooCommerce (woocommercebeforemaincontent & woocommerceaftermaincontent) digantikan dengan kontainer Bootstrap 5 tema (.container py-5), sehingga halaman katalog dan produk tunggal memiliki lebar yang konsisten dengan halaman lain di situs.

# 4. Area Widget Khusus Belanja (shop-sidebar)

Tersedia widget area tersendiri bernama shop-sidebar yang otomatis menggantikan sidebar umum saat pengunjung berada di:

• Halaman utama toko (Shop Page).
• Halaman arsip kategori produk.
• Halaman tag produk.

# 5. Mini-Cart Header

Fungsi template helper xionicwoocommercecart_link() siap disematkan pada layout header mana pun. Helper ini menampilkan:

• Ikon keranjang belanja yang dinamis.
• Badge jumlah item produk.
• Total harga belanja yang ter-update secara AJAX saat item ditambahkan (cart fragments refresh).

# Optimasi Kecepatan: WCOptimizer

Salah satu kelemahan umum WooCommerce pada tema standar adalah pemuatan script berat di seluruh halaman website. Xionic mengatasi hal ini melalui kelas WCOptimizer: