Cara Untuk Menampilkan Produk Woocommerce Di Website Lain

Berikut ini Langkah-Langkah Menampilkan Produk di Website lain. Langkah yang harus disiapkan adalah membuka dahulu website toko online dan login via cpanel dan pergi ke file manager.

Login Cpanel Hosting

• Login Cpanel Hosting kalian untuk mengakses file yang dibutuhkan dan menambah file yang akan digunakan untuk cara ini :

Login File Manager Hosting

• Pilih menu file dan pilih file manager untuk masuk ke file hosting website kalian,setelah itu cari folder atau root domain yang produknya ingin tampilkan di website lain.
• Masuk  wp-content>themes>nama themes yang kalian pakai.

Membuat Custom Page WordPress

• Buat custom page wordpress dengan mencontoh file page.php atau page-single.php nama file ini akan berbeda di setiap themes yang dipakai,namun umumnya themes wordpress menggunakan nama file page.php
• Buka file single page, lalu copy seluruh code yang ada di file single page.

Membuat File Custom Page

• Copy kode yang ada di single page maka kalian harus membuat file baru yang berfungsi membuat costom page nantinya.Buatlah file custom page dengan nama tampilproduk.php atau nama yang kalian inginkan untuk file tersebut.
• Setelah itu buka file yang dibuat dan paste seluruh code hasil copy dari single page tadi di file custom page. Maka hasilnya akan seperti di bawah ini.

• Hapus bagian header,sidebar,comment dan footer.Kita akan menyisakan kode yang akan kita buat maka hasilnya seperti di bawah ini :

• Perhatikan susunan themplate kalian, biasanya ada part di mana kode tidak lengkap,kalian harus mengambil keseluruhan kode yang ada di folder part dan menempatka di custom page yang dibuat, dan hapus bagian part teamplate jika di tempatkan di folder lain.

Kode Panggil Daftar Produk

• Salin kode di bawah ini dan tempatkan di atas tag </article> untuk menampikan produk secara acak.

• Perhatikan bagian posts_per_page‘ => 5 di mana angka 5 berarti menampilkan jumlah produk yang akan ditampikan,kalian bisa menyesuaikan sesuai kebutuhan.
• Setelah itu simpan custom page yang kalian buat,lalu pergi ke dashboard wordpress dan ke menu page dan tambah halaman baru.

Mengatur CSS Custom Page

• Jika ingin tampilan daftar produk rapi kalian butuh untuk menambahkan CSS di halaman custom yang kalian buat. Letakan CSS di bagian paling atas diantara tag <style></style>

Beriku ini adalah CSSnya :

Tampilan Custom Page

• Jika sudah masuk dan membuat halaman baru,silahkan pilih teamplate halaman custom dengan nama yang sudah dibuat tadi.

• Lalu Terbitkan halaman custom yang kalian buat untuk melihat hasilnya.

Tampilan Produk Dengan Iframe

Untuk menampilkan produk acak yang kalian buat tadi,cukup dengan menambahkan kode ini di sidebar kalian.

<iframe frameborder=”0″ scrolling=”yes” src=”url halaman custom page” style=”height: 900px; width: 100%;”></iframe>

Sampai di sini sudah selesai.