Cara Mengganti Blocks Checkout ke Classic Checkout WooCommerce (Panduan Lengkap)

Baru update WooCommerce dan tiba-tiba plugin ongkir atau payment gateway kamu tidak muncul di halaman checkout? Kemungkinan besar masalahnya ada di Blocks Checkout — fitur baru WooCommerce yang jadi default sejak versi 8.3.

Tenang, kamu tidak sendirian. Ini salah satu masalah paling sering ditanyakan pengguna WooCommerce di Indonesia.

Dalam panduan ini, kamu akan belajar cara mengganti Blocks Checkout ke Classic Checkout dengan mudah — tanpa coding, tanpa ribet.

Apa Bedanya Blocks Checkout dan Classic Checkout?

Sebelum mulai, penting untuk paham perbedaannya:

Blocks Checkout adalah sistem checkout baru dari WooCommerce yang dibangun menggunakan teknologi Gutenberg Blocks. Tampilannya lebih modern, tapi sayangnya belum semua plugin pihak ketiga mendukungnya.

Classic Checkout (atau Legacy Checkout) adalah sistem checkout lama yang menggunakan shortcode [woocommerce_checkout]. Meskipun disebut “lama”, sistem ini justru lebih stabil dan kompatibel dengan hampir semua plugin.

Kapan Harus Pakai Classic Checkout?

Pertimbangkan untuk beralih ke Classic Checkout jika:

  • Plugin ongkir tidak muncul di halaman checkout
  • Payment gateway tidak tampil atau error
  • Custom field tidak berfungsi
  • Checkout terasa lambat atau sering loading
  • Kamu menggunakan plugin seperti AgenWebsite Shipping yang dioptimalkan untuk Classic Checkout

Cara Cek Apakah Toko Kamu Pakai Blocks Checkout

Sebelum mengubah apapun, pastikan dulu toko kamu memang menggunakan Blocks Checkout:

  1. Login ke WordPress Admin
  2. Buka Pages (Halaman)
  3. Klik Edit pada halaman Checkout
  4. Perhatikan isi halaman tersebut

Jika kamu melihat block bernama “Checkout” dengan tampilan visual modern — berarti kamu menggunakan Blocks Checkout.

Jika kamu melihat shortcode [woocommerce_checkout] — berarti kamu sudah menggunakan Classic Checkout. Tidak perlu ubah apapun!

Cara Mengganti ke Classic Checkout (3 Metode)

Ada tiga cara untuk beralih ke Classic Checkout. Pilih yang paling nyaman untuk kamu.

Metode 1: Ganti Manual dengan Shortcode (Recommended)

Cara paling simpel dan aman. Cocok untuk semua level pengguna.

Langkah-langkah:

  1. Buka WordPress AdminPages (Halaman)
  2. Cari dan klik Edit pada halaman Checkout
  3. Hapus semua block yang ada di halaman tersebut (block Checkout dari Gutenberg)
  4. Tambahkan block Shortcode atau block Classic
  5. Masukkan shortcode: [woocommerce_checkout]
  6. Klik Update atau Publish
  7. Buka halaman checkout di browser untuk memastikan tampilannya sudah berubah

💡 Tips: Sebelum menghapus block lama, kamu bisa backup dengan cara Copy semua block, lalu Paste di dokumen lain (Notepad atau Google Docs). Jadi kalau mau balik, tinggal paste lagi.

Metode 2: Buat Halaman Checkout Baru

Kalau kamu tidak mau mengedit halaman yang sudah ada, buat saja halaman baru.

Langkah-langkah:

  1. Buka PagesAdd New (Tambah Baru)
  2. Beri judul: Checkout atau Checkout Classic
  3. Masukkan shortcode: [woocommerce_checkout]
  4. Publish halaman tersebut
  5. Buka WooCommerceSettingsAdvancedPage setup
  6. Pada bagian Checkout page, pilih halaman baru yang baru kamu buat
  7. Klik Save changes

Kelebihan metode ini: Halaman checkout lama tetap ada sebagai backup.

Metode 3: Menggunakan Plugin

Kalau kamu tidak nyaman edit manual, ada plugin yang bisa membantu:

Plugin yang bisa digunakan:

  • Disable WooCommerce Blocks — Menonaktifkan semua WooCommerce Blocks
  • Classic Editor — Mengembalikan editor WordPress ke versi klasik

Catatan: Kami lebih merekomendasikan Metode 1 atau 2 karena tidak menambah plugin baru. Semakin sedikit plugin, semakin cepat website kamu.

Jangan Lupa Halaman Cart!

Selain Checkout, halaman Cart (Keranjang) juga menggunakan Blocks di WooCommerce versi baru. Jika kamu mengalami masalah serupa di halaman Cart, ulangi langkah di atas dengan shortcode:

[woocommerce_cart]

Verifikasi: Pastikan Semuanya Berfungsi

Setelah mengganti ke Classic Checkout, lakukan pengecekan:

  1. Tambahkan produk ke keranjang — Pastikan tombol “Add to Cart” berfungsi
  2. Buka halaman Cart — Cek tampilan dan tombol “Proceed to Checkout”
  3. Buka halaman Checkout — Pastikan semua field muncul: Form billing, Form shipping, Pilihan ongkir, dan Pilihan payment
  4. Test order — Buat pesanan dummy untuk memastikan flow berjalan lancar

Troubleshooting

Plugin Ongkir Masih Tidak Muncul

Jika setelah ganti ke Classic Checkout plugin ongkir tetap tidak muncul:

1. Cek konfigurasi Shipping Zone

  • Buka WooCommerceSettingsShipping
  • Pastikan ada Shipping Zone yang mencakup lokasi toko dan pembeli

2. Cek apakah produk butuh shipping

  • Edit produk → Tab Shipping
  • Pastikan Weight dan Dimensions terisi

3. Clear cache

  • Jika pakai plugin cache (LiteSpeed, WP Rocket, dll), clear semua cache
  • Clear juga cache browser kamu

4. Cek conflict plugin

  • Nonaktifkan plugin lain satu per satu untuk menemukan yang bentrok

Tampilan Checkout Berantakan

Ini biasanya masalah tema. Coba switch sementara ke tema default (Storefront atau Twenty Twenty-Four). Jika normal, berarti tema kamu yang perlu di-update atau ada custom CSS yang perlu disesuaikan.

Kenapa AgenWebsite Merekomendasikan Classic Checkout?

Plugin AgenWebsite Shipping dan AgenWebsite Payments dioptimalkan untuk Classic Checkout karena beberapa alasan:

  1. Kompatibilitas lebih luas — Classic Checkout didukung oleh hampir semua plugin dan tema
  2. Customization lebih mudah — Menambahkan custom field, mengubah urutan field, atau styling bisa dilakukan dengan mudah
  3. Performa stabil — Tidak ada JavaScript kompleks yang bisa menyebabkan loading lambat
  4. Fitur lengkap — Semua fitur seperti kalkulasi ongkir real-time, kode unik pembayaran, dan custom tarif berjalan sempurna

Kami terus memantau perkembangan WooCommerce Blocks dan akan update kompatibilitas begitu sistemnya lebih stabil. Untuk saat ini, Classic Checkout tetap pilihan terbaik untuk toko online Indonesia.

Kesimpulan

Mengganti WooCommerce Blocks Checkout ke Classic Checkout itu mudah:

  1. Edit halaman Checkout
  2. Hapus block Checkout
  3. Ganti dengan shortcode [woocommerce_checkout]
  4. Save dan test

Dengan Classic Checkout, plugin ongkir dan payment gateway kamu akan berfungsi normal kembali. Tidak ada fitur yang hilang — justru kompatibilitas dan stabilitasnya lebih baik.

Sudah pakai AgenWebsite Shipping untuk kalkulasi ongkir otomatis? Dengan Classic Checkout, semua fitur premium seperti multi-kurir, tracking real-time, dan custom tarif akan berjalan optimal.

Leave a Reply

Your email address will not be published. Required fields are marked *