Panduan Penyesuaian Tampilan WebKece

Transkripsi

1 Panduan Penyesuaian Tampilan WebKece Setelah sukses melakukan registrasi dan masuk ke dashboard administrator website, saatnya menyesuaikan tampilan web sesuai dengan kebutuhan dan identitas personal atau company Anda. Saatnya mengeksplorasi menu Styling. Klik menu styling pada left side-bar, dashboard administrator. Lalu akan tampil sub-menubar jendela styling berikut. Kita akan mengupas fungsi dari masing-masing submenu pada menu styling dibawah ini. General Pada submennu general, kita dapat melakukan beberapa penyesuaian tema. - Body Styling Anda dapat melakukan pengaturan background website, dengan mem-paste url image resources yang ingin dijadikan backround website atau upload gambar dari PC Anda (sebelumnya klik remove). Pada pengaturan dibawahnya anda dapat mengatur apakah gambar berulang -tile background- (repeat images, jika resolusi terlalu kecil), pengaturan tata letak gambar, termasuk diatur apakah scroll normaly atau fixed (posisi gambar tetap).

2 Selanjutnya, Anda juga dapat mengupload image header jika diinginkan. Memberikan pengaturan warna untuk link (termasuk link hover -> pengaturan warna ketika kursor di arahkan ke link Anda) di website Anda. Selain itu style untuk masing typografi text di website (body, heading 1 hingga 6) dapat anda atur masing-masing ukuran font size, font space, character hingga warnanya masing-masing. Scroll kebawah, selanjutnya anda dapat mengatur search box, akan ditampilkan atau tidak : dan juga breadcumbs (navigasi user) : Jika Anda mengerti Cascading Style Sheets (CSS), anda juga dapat mengetikkan script CSS Anda. Jika sudah yakin dengan semuanya, klik save options untuk menyimpan perubahan pengaturan.

3 Logo & Favicon Pada submenu ini Anda dapat mengatur logo yang tampil pada header website Anda; image logo ataupun text logo. Jika memilih logo dari gambar, Anda dapat meng-upload logo atau dengan mem-paste image path-nya. Jika memilih text logo, anda tinggal mengetikkan text logo yang Anda inginkan. Favicon adalah icon yang muncul pada title website Anda (tampil pada browser tab) : Jika sudah yakin jangan lupa klik save options. Navigation

4 Submenu navigation, Anda dapat mengatur style menu website Anda. Mulai dari typografi: font size, font face (menggunakan google font), hingga warna. Kita juga dapat mengatur animasi ketika kita mengklik menu website yang memiliki child-menu; delay, fade-in ataupun slider down animation, hingga kecepatan animasi dan juga dapat menambahkan icon panah (arrows markup) apabila diperlukan untuk memudahkan pengunjung mengeksplorasi menu website Anda. Lanjut ke pengaturan styling dibawahnya, ada pilihan Mobile menu label untuk mengatur text yang tampil sebagai petunjuk menu ketika website dalam tampilan responsive mobile. Opsi stickup menu diaktifkan jika Anda ingin menu website Anda senantiasa tampil di top layer walaupun ketika halaman website Anda tengah di scroll ke bawah. Jika sudah yakin jangan lupa klik save options. Slider Settings Pada submenu slider settings, Anda dapat mengatur style slider pada homepage website Anda. Mulai dari tipe slider, pengaturan urutan slide yang tampil, metode pengurutan, efek animasi, kolom dan baris slider.

5 Selanjutnya Banner Effect: adalah animasi munculnya teks pengiring slide, pause time: jeda pembaca untuk melihat slide, sebelum berpindah slide. Selanjutnya tersedia juga pengaturan kecepatan animasi untuk tiap slide, jika butuh gambar inset (thumbnail) anda juga dapat memilih Yes, begitu juga dengan pagination (separator, pembatas antar thumbnail slide), termasuk pengaturan tampilan Next & Prev pada slider.

6 Blog Submenu blog memuat sejumlah pengaturan artikel berkala (post) Anda ditampikan. Ada pengaturan Judul Blog yang ditempatkan pada halaman kumpulan blog Anda (domain-anda.com/blog). Pengaturan teks pengganti related post title yang biasanya ditempatkan di area paling bawah halaman artikel (post). Blog layout: pengaturan layout blog dan posisi widget. Pengaturan ukuran image blog dan juga opsi tombol icon sharing article.

7 Anda dapat mengatur loading gambar hanya ketika user berminat (scroll down) artikel Anda. Exceprt adalah potongan post yang akan di tampilakan pada halaman blog, pengaturan text pengganti Read More pada tiap excerpt. Pengaturan tampilan meta, tanggal publikasi, penulis, direct link (link menuju post), kategori, tag, jumlah komentar, jumlah pembaca, jumlah suka dan tidak suka pada artikel Anda.

8 Portofolio Adalah ekstra konten yang Webkece sediakan untuk anda mengelompokkan tipe posting (artikel berkala) yang sifatnya spesifik. Anda dapat mengelola lebih jauh menu portofolio dengan melihat tutorial : Panduan mengelola ekstra konten Webkece. Bagian paling atas adalah pengaturan fitur seleksi portofolio yang akan digunakan dalam mengklasifikasikan pengelompokkan portofio pada website. Anda bisa mengatur filter by category atau name. Selanjutnya Anda bisa mengurutkan berdasarkan nama file, ID ataupun yang lain secara ascending maupun descending. Show Title digunakan sebagai opsi pengaturan penampilan judul portofolio, lalu Show Excerpt adalah opsi penampilan ringkasan portofolio dengan panjang maksimum ringkasan dapat diatur pada Excerpt Words.

9 Selanjutnya pengaturan show button dan button text untuk mengatur daftar tampilan portofolio website Anda seperti pada ilustrasi disamping. Jika ingin menampilan atribut lain (komentar, tanggal terbit dan lainnya) maka aktifkan show portofolio meta. Enable Lightbox digunakan untuk menampilkan pop-up image lightbox pada gambar dalam portofolio. Anda juga dapat mengatur layout tiap posting portofolio anda dalam bentuk coloumns atau fullwidth dan ada dua pilihan juga untuk gallery portofolio: grid / masonry. Selanjutnya Anda juga dapat mengatur berbagai macam tipe layout yang tersedia. Anda juga bisa melakukan pengurutan portofolio yang tampil berdasarkan ascending/descending. Terakhir Anda juga bisa mengatur jumlah maksimal kolom dan banyak portofolio pada satu halaman website. Jika sudah yakin, klik save options.

10 Footer Feedburner adalah layanan blogfeeder (layanan langganan artikel berkala dari website Anda) jika Anda pernah melakukan pendaftaran/pengaturan newsfeed untuk website Anda, Anda dapat mem-paste linknya pada kolom isian tersebut. Anda juga dapat mengatur typography pada footer Anda, termasuk jika tidak ingin menampilkan footer Anda tinggal mengaktifkan footer Anda. Lalu klik Save Options. Cookie Banner Bagi Anda yang mengerti dan memberlakukan cookie kepada browser pengunjung, maka Anda dapat mengaktifkan sekaligus memberikan konten pemberitahuan kepada pengunjung melalui submenu ini.

11 Authentication Authentication digunakan khusus untuk toko online, karena pelanggan tetap toko Anda butuh registrasi terlebih dahulu agar berbagai data pembeli bisa disimpan. Ada beberapa pengaturan yang tersedia pada menu authentication; fitur display login (enable login link atau tidak), user profile link digunakan untuk mengatur url untuk tiap-tiap pelanggan, logoff-registration-authentication_link-reg_question digunakan untuk mengganti teks tersebut jika diperkirakan akan memudahkan user. Terakhir, separtor untuk memisahkan masing-masing pilihan di atas. Jika sudah yakin dengan pengaturan anda klik save options. Social

12 Silahkan copy-paste url media sosial yang Anda kelola ke dalam isian masing-masing sosial media URL yang disediakan. Anda juga dapat mengganti icon sosial media tersebut jika diinginkan dengan mengganti dengan url icon yang Anda inginkan. Termasuk mengganti url dan icon rss-feed. Shop Settings Bagi Anda yang mengoperasikan sebuah toko online melalui WebKece, submenu shop, wajib Anda cermati. Empty cart message, adalah informasi awal keranjang belanja pelanggan website Anda, Anda bisa mengganti pesan keranja belanja kosong dalam isian tersebut. Product per page adalah maksimum daftar produk yang ditampilkan dalam satu halaman sehingga produk lainnya akan ditempatkan di halaman selanjutnya. Product title length limit adalah maksimum jumlah kata yang digunakan untuk nama produk. Product Description digunakan jika Anda memberikan detail spesidikasi yang cukup banyak untuk produk Anda. Show Details adalah untuk menuju ke halaman khusus deskripsi produk yang sudah Anda buat sebelumnya.

13 Display login links: jika Anda ingin memperlihatkan link untuk login bagi customer Anda. user profile link digunakan untuk mengatur url untuk tiap-tiap pelanggan, logoff-registration-authentication_link digunakan untuk mengganti teks tersebut jika diperkirakan akan memudahkan user.