(Client) Tutorial IndoStore V4

IndoStore Theme Versi 4.0 for Client WORDPRESS THEME TOKO ONLINE INDONESIA

0

TUTORIAL SETTING

INDOSTORE THEME

untuk CLIENT

INDOSTORE THEME VERSI 4.0


1

1. SETTING INDOSTORE OPTIONS

Setting IndoStore Options melalui langkah berikut :

Klik Appearance kemudian klik IndoStore Options

Isi data-data Toko Online Anda, setelah selesai jangan lupa klik Save Option.

Terdiri 9 Box Option. Berikut penjelasan fungsi dari masing-masing Box :

BOX 1 : Extra Option

a. APP ID

Komentar produk menggunakan Facebook Comment, Anda

dapat masukkan App Id supaya Anda dapat memanage

komentar yang masuk. Cara mendapatkan App Id Website

akan dijelaskan pada penjelasan berikutnya.

Tapi, meskipun tanpa masukkaan App ID, fb comment tetap

berfungsi dengan baik, namun Anda tidak dapat memanage

komentar yang masuk.

b. Produk Pilihan

Produk pilihan disini sebenarnya hanya pemanis saja,

menampilkan produk secara random di sidebar kanan agar

tidak terlihat kosong.

c. Blog Option

Mengatur banyaknya blog artikel yang ditampilkan di

halaman utama.

d. Tombol Konfirmasi

IndoStore Theme dilengkapi halaman Konfirmasi

Pembayaran yang sangat berguna bagi customer Anda.

Anda dapat menampilkan tombol shortcut menuju halaman

Konfirmasi di sidebar kanan.

*Cara membuat halaman konfirmasi akan dijelaskan nanti.

e. Tombol Katalog Produk

IndoStore juga dilengkapi halaman Katalog Produk yang

memudahkan customer/reseller Anda mengeprint list produk

yang ada di toko Anda.

Anda dapat menampilkan tombol shortcut menuju halaman

Katalog di sidebar kanan.

*Cara membuat halaman katalog akan dijelaskan nanti.

f. Testimoni

IndoStore dilengkapi halaman Testimoni Pelanggan, jadi

Anda dapat menampilkan beberapa testi dari pelanggan

Anda dan tombol shortcut menuju halaman testimoni di

sidebar kanan.

*Cara membuat halaman testimoni akan dijelaskan nanti.


2

BOX 2 : Tentang Toko

a. Nama Toko

Tulis Nama Toko Online Anda.

Contoh : Cecep Store, Bali Store, dll terserah Anda.

b. Box Selamat Datang di Halaman Utama

Atur paragraf pembuka yang dapat Anda tampilkan atau

sembunyikan di halaman utama.

*Anda dapat menyisipkan Kode HTML

c. Jam Kerja

Atur jam kerja toko Anda, akan tampil di pojok kiri atas.

Contoh : Buka jam 08.00 s/d 21.00 Minggu Libur

d. Facebook Fanpage

Tampilkan Fanpage toko online Anda di website, akan

ditampilkan di sidebar kiri. Masukkan url Fanpage Anda,

bukan facebook profile.

e. Twitter

Tampilkan tombol Follow Twitter dan masukkan url Twitter

Anda/toko Anda.


3

BOX 3 : Desain Tema

a. Warna Tema

Pilih style warna tema yang tersedia.

*Terdiri dari biru, merah, gelap dll

b. Background Option

Tentukan background website Anda. Apabila Anda memilih

opsi Texture, Anda dapat menggunakan texture background

yang tersedia. Selain itu Anda dapat menggunakan gambar

background lain punya Anda sendiri dengan memilih opsi

Gambar dan memasukkan url gambar yang dijadikan

background.

* Upload terlebih dahulu gambar di Media, copy url-nya dan

paste di kolom yang disediakan.

c. Logo Option

Anda dapat menggunakan Text atau Gambar Logo Anda

sendiri. Apabila memilih text, logo akan berupa text Title

website Anda.

* Ukuran Logo : 400x70 pixel

* Upload terlebih dahulu logo di Media, copy url-nya dan

paste di kolom yang disediakan.

d. Header Option

Anda dapat mengganti header default tema ini dengan

memilih opsi Ganti, kemudian memasukkan url gambar

header Anda.

* Ukuran Header : 920x100 pixel

* Upload terlebih dahulu gambar header di Media, copy url-

nya dan paste di kolom yang disediakan.

e. Favicon Option

Anda dapat mengganti favicon default tema ini dengan

memilih opsi Ganti, kemudian memasukkan url gambar

Favicon Anda.

* Ukuran Favicon: 16x16 pixel atau 32x32 pixel

* Upload terlebih dahulu gambar favicon di Media, copy url-

nya dan paste di kolom yang disediakan


4

BOX 4 : Kontak Toko Anda

a. Email Laporan

Masukkan email Anda . Setiap ada order masuk dan

customer Anda melakukan konfirmasi pembayaran, email

laporan akan dikirimkan ke email Anda ini.

* Gunakan email Anda yang VALID dan sering dibuka/dicek.

b. Hotline

Masukkan No. Telpon /Handphone yang digunakan sebagai

layanan Hotline webstore Anda.

c. SMS Center

Masukkan No. Handphone yang digunakan sebagai layanan

SMS webstore Anda.

d. Blackberry Messenger

Masukkan PIN Blackberry Messenger Anda.

e. Yahoo Messenger Box

Tampilkan/Sembunyikan icon Yahoo Messenger Anda.

Apabila Anda tidak menggunakan YM, pilih opsi sembunyikan

saja.

f. Jumlah ID yang ditampilkan

Tersedia 2 ID Yahoo Messenger yang bisa ditampilkan, tapi

Anda dapat mengaturnya menjadi 2 ID atau hanya 1 ID yang

ditampilkan.

Anda juga dapat memilih model icon Yahoo Messenger Anda.

Rekomendasi : Gunakan icon no. 2 atau 14

Jangan lupa masukkan ID Yahoo Messenger Anda. Apabila

menggunakan nama email full, icon YM Anda tidak keluar,

cukup tulis ID nya saja.

Contoh : Email Yahoo Anda [email protected]

Anda cukup menuliskan w3thedesigns saja.


5

BOX 5 : Slider Option

a. Tentukan isi dari Slider

Anda dapat tentukan isi dari slider di halaman depan.

b. Setting Produk Slider

Anda dapat memilih kategori apa dan jumlah produk yang

ditampilkan dalam Slider.

c. Setting Gambar / Banner Slider

Pilih gambar/banner yang ingin ditampilkan. (terdiri 3 gambar)

+ Masukkan url Gambar 1 dan link tujuan Gambar 1




6

BOX 6 : Advertisment & Tracking Option

a. Iklan 234x60

Atur iklan ukuran 234x60 pada website Anda. (tampil di

header bagian kanan)

Masukkan kode iklan 234x60 pada kolom yang disediakan

b. Iklan 160x600

Atur iklan ukuran 160x600 pada website Anda. (tampil di

sidebar kanan)

Masukkan kode iklan 160x600 pada kolom yang disediakan.

Anda juga dapat menampilkan gambar banner iklan Anda

sendiri. Kodenya sebagai berikut :

Menampilkan gambar :

* Text merah diatas adalah url gambar banner.

Menampilkan gambar hyperlink / ngelink :

* Text merah diatas adalah url gambar banner.

* Text biru diatas adalah link tujuan gambar banner.

c. Fitur Tambahan Penempatan Kode

Anda dapat menambahkan kode Google Analytics dan

Webmaster Tool. Penempatan kode ini adalah di footer.

d. Counter Code

Anda dapat menggunakan Histats yang berfungsi memonitor

banyaknya pengunjung website Anda tiap harinya.

Pendaftarannya gratis (Histats.com)


7

BOX 7 dan 8 : Bank Support

a. Logo Bank

Atur untuk menampilkan atau tidak logo bank.

b. Anda cukup memilih akun Bank apa saja yang Anda gunakan untuk transaksi website toko online Anda.

Masukkan Atas nama rekening dan nomor rekening dari setiap akun bank.

BOX 9 : Expedisi Support

a. Logo Jasa Pengiriman

Atur untuk menampilkan atau tidak logo jasa pengiriman.

b. Anda cukup memilih jasa pengiriman apa saja yang Anda

gunakan untuk pengiriman barang.

Jangan Lupa klik tombol SAVE OPTION apabila selesai setting.


8

MEMBUAT FACEBOOK APP ID

Agar Anda dapat me-manage facebook comment, Anda harus mengisikan App ID Anda. Cara mebuatnya sangat mudah, ikuti

langkah-langkah berikut ini :

Buka https://developers.facebook.com/apps/ dan buatlah New App

Isi App Name kemudian klik Continue

Masukkan Captcha, klik Continue

Anda sudah mendapatkan App ID, jangan lupa isikan alamat website dimana App ID tersebut dipasang.

TIPS : Mendapatkan URL Gambar / Upload gambar

Untuk mendapatkan URL gambar logo, header, banner dan favicon Anda harus menguploadnya terlebih dahulu. Caranya : 1. Klik Media > Add New > Select Files

2. Setelah terupload, copy url gambarnya. Lalu paste di kolom yang sudah disediakan di IndoStore Option.

Copy App ID disini

Masukkan App ID pada IndoStore Options

Isi URL website Anda (contoh : http://indostore.oketheme.com)

Paste di App ID di Indostore Options


9

2. CARA POSTING PRODUK / MENAMBAHKAN PRODUK

Pada bagian ini saya akan menjelaskan bagaimana cara menambah produk di toko online Anda.

1. Buka Dashboard Wordpress Anda :

2. Klik Post Add New

3. Buatlah postingan tentang produk Anda, tampilannya seperti gambar di bawah ini :

4. Tulis nama produk Anda pada kolom Title/Judul postingan. Kemudian tulis deskripsi mengenai produk yang Anda jual.

5. Setelah deskripsi produk selesai di tulis, Anda harus meng-upload gambar utama produk yang akan dijadikan gambar

thumbnail produk. Pada sisi kanan bawah, cari tulisan Featured Images. Klik Set featured image

6. Klik Upload Files kemudian klik tombol Select Files

Klik tombol ini untuk membuat list detail

Ketik nama produk Anda


10

7. Pilih file gambar yang ingin diupload. Setelah selesai di upload, pilih/centang gambar yang sudah berhasil diupload tadi dan

klik tombol Set featured image.

8. Gambar tersebut sudah menjadi Featured Image seperti gambar dibawah ini :

9. Selanjutnya, Anda harus isi IndoStore Panel yang berisi informasi produk Anda tersebut. Pertama-tama Anda harus

mengaktifkan terlebih dahulu IndoStore Panel dengan cara :

+ Klik Screen Options di pojok kanan atas (lihat gambar)

+ Centang IndoStore Panel, maka IndoStore Panel akan keluar dibawah editor postingan.


11

Isi IndoStore Panel sesuai kebutuhan seperti Harga Produk (wajib), Kode Produk, Stock Produk dsb. Anda juga dapat

membedakan harga 1 macam produk berdasarkan ukuran/modelnya. Anda cukup mengaktifkan Pilihan Model & Harga

untuk memberikan harga yang berbeda dari tiap-tiap ukuran/model produk.

10. Setelah Panel IndoStore terisi dengan benar, Anda bisa menambahkan Category, Tags dsb kemudian klik Publish

11. Selesai, produk sudah berhasil ditambahkan!

Centang apabila produk ini mempunyai pilihan ukuran dan

harga yang berbeda.


12

3. CARA POSTING ARTIKEL BLOG

Artikel blog biasanya digunakan untuk keperluan SEO, supaya website toko online kita mempunyai nilai lebih di mata Search

Engine seperti Google, Yahoo dsb. Artikel produk hanya bisa diposting pada kategori khusus yaitu Blog. Artikel ini nanti akan

muncul dibawah produk pada halaman depan website toko online Anda. ( lihat contoh dibawah ini )

Sebelumnya, Anda harus membuat category khusus untuk artikel blog Toko Online Anda terlebih dahulu :

Buatlah Kategori baru dengan Name Blog atau Artikel dan kolom Slug HARUS diisi dengan text blog.

Kemudian klik tombol Add New Category

Setelah membuat category, Anda dapat langsung membuat artikel blog untuk Toko Online Anda. Caranya :

1. Klik Add New Blog pada Blog

2. Tulis Judul Artikel blog Anda, lakukan posting seperti biasa.Tetapi pada artikel blog ini, Anda harus memilih / mencentang category Blog yang sudah Anda buat tadi. Lalu klik Publish. Lihat gambar dibawah ini


13

4. SETTING SIDEBAR & WIDGET

IndoStore Theme mempunyai 2 sidebar di sisi kiri dan kanan, untuk mengatur widget apa saja yang ingin Anda tampilkan di sidebar Toko Online Anda, Anda dapat mengaturnya di sini :

1. Klik Appearance > Widgets

2. Anda tinggal menyeret widget yang tersedia ke Sidebar Kiri atau Kanan.

3. Untuk menghilangkan widget dari Sidebar, Anda cukup menyeret widget tersebut keluar dari Sidebar.

4. Kalau untuk Yahoo Chat, Facebook Fanpage, Twitter, Logo Bank dan Jasa Pengiriman, Anda dapat mengaturnya di IndoStore Options


14

5. CUSTOM MENU

Custom menu tidak wajib Anda lakukan, karena kami yakin default menu navigasi IndoStore theme sangat mudah dipahami oleh

pengunjung toko online Anda.

Secara default, navigasi IndoStore theme seperti ini :

Baris pertama : Halaman Website

Baris kedua : Kategori Website

Bagaimana bila Anda menginginkan susunan navigasi sesuai keinginan Anda? Caranya mudah.

4. Klik Appearance kemudian klik Menus

5. Buatlah menu dengan nama terserah Anda

6. Setelah menu dibuat, lihat sisi kiri tabel.

Anda dapat memilih Kategori dan Pages mana

saja yang ingin Anda tampilkan di menu Anda ini.

Centang, kemudian klik tombol Add to menu.

7. Simpan menu yang Anda buat.

8. Kemudian masukkan menu Anda tersebut ke

navigasi IndoStore Theme.

9. Simpan / Save

Navigasi telah selesai dimodifikasi Mudah bukan?

Gambar 1 : Menu Default

Gambar 2 : Custom Menu

Geser kekanan untuk menjadikan subcategori. Contoh pada gambar diatas.

Camera menjadi subcategori dari Product


15

6. MENGATUR JUMLAH PRODUK TERBARU DI HALAMAN DEPAN

Produk terbaru secara default wordpress akan ditampilkan 10 post. Hasilnya, tampilan toko online Anda jadi kurang menarik .

Setting jumlah produk yang tampil di halaman depan menjadi 9 produk seperti pada contoh dibawah ini. Bisa juga kelipatan 3.

Cara settingnya adalah melalui WP-Admin website Anda :

1. Klik Setting > Reading

2. Pastikan Front page displays disetting padaYour latest posts

3. Lihat pada Blog pages show at most. Ganti angka 10 dengan angka 9 atau kelipatan 3 sesuai kebutuhan Anda

4. Klik Save Changes


16

7. FAQ / PERTANYAAN YANG SERING DITANYAKAN

1. Gambar Tumbnail tidak keluar / error? Apabila Anda mengalami error gambar kecil thumbnail tidak keluar, itu dikarenakan Anda mengambil gambar yang sumbernya

dari website lain (gambar tidak disimpan di server sendiri).

Solusi :

1. Baca tutorial cara posting produk, Anda dapat upload gambar produk Anda dan menjadikannya sebagai Featured

Images atau Insert to Post.

2. Apabila gambar produk berasal dari website lain dan Anda kerepotan harus mendownload dan mengupload ulang ke

website Anda, gunakanlah plugin Grab & Save.

3. Cara Install : Masuk ke Plugins > Add new plugin > Pada kolo search, ketik Grab & Save > Install dan aktifkan plugin

Grab & Save.

Setelah plugin terinstall, akan ada tab baru ketika Anda akan menambahkan gambar ke dalam postingan.

Copy url gambar yang ingin Anda ambil dari website lain

Paste di kolom Image URL yang disediakan Grab & Save.

Klik tombol Grab, maka gambar akan otomatis disimpan di server Anda.

Mudah bukan? Berikut screenshoot plugin Grab & Save (Plugin ini Gratis)

Terima Kasih & Salam Sukses!

INDOSTORE THEME VERSI 4.0

WORDPRESS THEME TOKO ONLINE INDONESIA

(Client) Tutorial IndoStore V4

Documents