Cara Edit Tampilan Dasar Shopper Katalog Toko Online

Cloud VPS
Admin Tutorial
Latest posts by Admin Tutorial (see all)

Halo, Sob! Buat kamu pemilik Katalog Toko Online dengan template Shopper, wajib banget ikutin tutorial kali ini yang ingin melakukan edit tampilan dasar Katalog Toko Online kamu, Sob!

Eits, sebelum itu kita simak dulu yuk informasi mengenai template shopper yang kamu gunakan, ini dia infonya:

Sekarang kita simak langsung tutorialnya, oiya, kamu harus wajib melakukan login wordpress untuk melakukan setting tampilan dasar ini ya, Sob!

Login wp


Edit Logo

Kamu bisa melakukan edit logo kamu, loh Sob! Ikutin tutorialnya berikut ini:


STEP 1. Setelah Login, kamu langsung menuju menu Appearance > Shopper Theme Settings

Appearance > Shopper Theme Settings


STEP 2. Di bagian palinh atas akan muncul kolom kosong di bagian Custom Logo URL, yang bisa kamu isi dengan logo URL kamu. Jika kamu ingin upload kamu tinggal klik Upload Your Logo.

Custom logo URL


STEP 3. Setelah itu kamu akan diarahkan langsung untuk mengupload logo. Upload your logo > Select Files > lalu klik Edit seperti gambar di bawah ini:

Edit button


STEP 4. Lihat di bagian sidebar sebelah kanan, ada File URL seperti ini, Silahkan copy URLnya dan kembali ke pengaturan Shopper Theme Theme Options

Copy file URL


STEP 5. Lakukan paste URL di kotak kosong disini dan selanjutnya silahkan klik Save Change di bagian paling bawah.

Custom Logo URL

Save Changes


STEP 6. Selesai! Silahkan cek ulang perubahanmu pada Katalog Toko Online kamu, ya, Sob!


Setting Title, Tagline dan Site Icon

Nah, kalo yang satu ini kamu bisa ganti judul Toko Online kamu, Tagline dan Site Iconnya, Sob! Ikuti tutorialnya di bawah ini:


STEP 1. Setelah Login, Silahkan menuju ke menu Appearance > Customize


STEP 2. Selanjutnya kamu bisa langsung klik menu Site Identity berikut ini:

Site Identity


STEP 3. Nah, disini kamu bisa melakukan edit site title, tagline dan upload site icon kamu, Sob.

Site Identity Menu


STEP 4. Setelah itu kamu bisa langsung klik button Publish dan lakukan cek ulang website kamu untuk perubahan yang sudah kamu lakukan, ya Sob!

Publish Button


Menambahkan Widget

Oke, Sob kamu bisa menambahkan widget yang kamu inginkan. Ini dia tutorialnya:


STEP 1. Setelah Login wordpress, klik menu Appearance > Customize

Appearance > Customize


STEP 2. Silahkan kamu klik menu Widgets

Widgets Menu


STEP 3. Akan muncul menu seperti ini, silahkan klik Footer Widget 1

Footer Widget 1


STEP 4. Jika sudah masuk ke tampilan seperti berikut, kamu tinggal klik button Add a Widget > Pilih salah 1 Widget, contoh disini menggunakan widget Calendar.

Add Widget Calendar


STEP 5. Jika sudah pilih widget Calendar akan muncul contoh di sebelah kanan seperti contoh berikut, Isi judul yang kamu mau lalu klik Done.

Widget Calendar


STEP 6. Silahkan klik button Publish untuk menyimpan pengaturan yang kamu lakukan.

Button Publish


STEP 7. Selamat! Kamu sudah berhasil menambahkan widget kamu, silahkan cek Katalog Toko Online kamu ya, Sob.


Menambahkan About Us Page dan Menu

Kalau kamu ingin menambahkan About Us atau deskripsi Katalog Toko Online, kamu wajib ikutin tutorialnya disini:


STEP 1. Setelah Login, silahkan kamu masuk ke menu Pages > Add New

Pages > Add New


STEP 2. Selanjutnya, kamu bisa mengisi Title dengan judul About Us, isi text box sesuai dengan deskripsi Katalog Toko Online kamu, jika semua sudah terisi, silahkan klik tombol Publish.

About us page


STEP 3. Selanjutnya silahkan kamu pergi ke dashboard WordPress dan cari Menu Appearance > Menus

Appearance > Menus


STEP 4. Selanjutnya silahkan kamu klik centang pada About Us, lalu klik Add to Menu, seperti contoh berikut

About Us > Add to Menu


STEP 5. Silahkan klik tombol Save Menu, untuk menyimpan perubahannya. Sekarang silahkan cek Katalog Toko Online kamu untuk melihat menu About Us pada header.

Save Menu Button


Menambahkan Contact Us Page dan Menu

Contact Us

Kemudahan pelanggan untuk mengetahui Kontak kamu adalah hal yang penting, Sob. Yuk, ikutin cara menambahkan Page dan Menu Contact Us, agar bisa mendapatkan hasil seperti ini silahkan ikuti tutorialnya berikut ini:


STEP 1. Setelah Login, silahkan klik menu Plugins> Add New

Plugins> Add New


STEP 2. Pada kolom search cari dengan keyword Font Awesome.

Font Awesome


STEP 3. Silahka kamu klik button Install Now > Setelah itu klik Activate

Install Now

Activate Button


STEP 4. Selanjutnya kembali ke sidebar menu yang di sebelah kiri lalu pilih menu Pages > Add New. Isi bagian judul dengan Contact Us.

Pages > Add New > Contact Us


STEP 5. Setelah itu kamu bisa copy paste shortcode di bawah ini untuk memunculkan icon dan formatnya didalam text box. Selanjutnya kamu bisa isi instagram toko online kamu, nomor hp, nomor wa dan email kamu.

[icon name="instagram" class="fa-2x" unprefixed_class=""] Instagram:

 

[icon name="phone" class="fa-2x" unprefixed_class=""] Phone:

 

[icon name="whatsapp" class="fa-2x" unprefixed_class=""] Whatsapp:

 

[icon name="envelope-square" class="fa-2x" unprefixed_class=""] Email:

Copy Paste Shortcode


STEP 8. Lalu klik tombol Update di sebelah kanan bawah untuk menyimpan konfigurasimu

Update Button


STEP 9. Oke, Sob sekarang kamu cek halaman Contact Us kamu untuk melihat perubahan pada halaman contact us kamu.


Menambahkan Sosial Media pada Footer

Buat kamu yang ingin menambahkan sosial media pada footer kamu, silahkan kamu simak tutorialnya ya, Sob!


STEP 1. Setelah Login, Silahkan kamu klik menu Appearance > Shopper Theme Settings

menu Appearance > Shopper Theme Settings


STEP 2. Setelah itu silahkan kamu letakkan Link sosial media kamu sesuai dengan sosial media yang kamu punya dan kamu butuhkan. Jika sudah selesai, silahkan klik Save Changes.

Shopper Theme Options


STEP 3. Selesai! Kamu sudah berhasil menambahkan sosial media pada footer Katalog Toko Online, seperti berikut ini:

Social Media at Footer


Oke, Sob hanya dengan beberapa langkah mudah di atas, Katalog Toko Online kamu sudah berhasil dilakukan. Simak terus Tips Hosting di halaman tutorial Jagoan Hosting Indonesia ya, jika ada bagian dari tutorial yang tidak ditemukan, kamu bisa menghubungi teman-teman di Jagoan Hosting supaya bisa dibantu lebih lanjut melalui Live Chat atau fitur Open Tiket ya!

Apakah artikel ini membantu, Sob?

Berikan rating buat artikel ini!

Rata-rata rating 5 / 5. Dari total vote 1

Pertamax, Sob! Jadilah pertama yang memberi vote artikel ini!

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?

Related Posts
Cara Edit Tampilan Dasar Katalog Toko Online

Hai, Sob ! Buat kamu yang suka bingung gimana sih cara mengubah tampilan dasar katalog toko online kamu dengan template Read more

Cara Menambahkan dan Mengatur Produk Baru Toko Online

Halo, Sob! Buat kamu pengguna template toko online shopper atau shopisle yang suka bingung gimana caranya menambahkan dan mengatur produk Read more

Tutorial Setting Instagram Feed pada Katalog Toko Online

Hai hai, Sob! Kamu suka penasaran gimana sih caranya integrasi Instagram di katalog Toko Online kamu? Penasaran kamu sekarang sudah Read more

Cara Menambahkan Video pada Katalog Toko Online Shopisle

Hai, Sob! Buat kamu pemilik Katalog Toko Online dengan tema Shopisle, kamu bisa banget loh menambahkan video pada Katalog Toko Read more