Cara Mengatur Layout Utama & Warna Utama

Video Tutorial Cara Mengatur Layout Utama & Warna Utama

Mohon maaf, video tutorial untuk materi "Cara Mengatur Layout Utama & Warna Utama" belum tersedia

Panduan Tertulis Cara Mengatur Layout Utama & Warna Utama

Layout Utama adalah pengaturan yang akan merubah tampilan halaman depan website wedding organizer Anda. Warna Utama website adalah warna yang akan diterapkan pada sebagian besar tampilan halaman depan website wedding organizer Anda. 

 

Mengakses Layout Utama & Warna Utama

A. Pada modul “Manajemen Administrasi” > pilih fitur “Data Master & Pengaturan” > pilih fitur “Desain & Tampilan” > pilih fitur “Tampilan Halaman Utama” > pilih fitur “Theme Builder”

Desain Tampilan 1.png

Desain Tampilan 2.png Desain Tampilan 3.png

 

Selanjutnya Anda akan melihat halaman pengaturan tampilan halaman depan

 

Desain Tampilan 4.png

(Gambar di atas : Tampilan halaman pengaturan tampilan halaman depan)

 

B. Pada halaman pengaturan tampilan halaman depan > pilih tombol “Pengaturan Lanjut” “Logo.png” > pilih tombol “Layout Utama & Warna”

 

Desain Tampilan 5.png

(Gambar di atas : Penunjuk tombol "Layout Utama & Warna")

 

Mengatur Layout Utama & Warna Utama

Lakukan penyesuaian pada "Tipe Layout""Warna Tema", "Warna Background""Gambar Background""Posisi Background", dan "Font Dasar".

 

Desain Tampilan 6.png

(Gambar di atas : Penunjuk dalam memilih jenis "Tipe Layout")

 

1. "Tipe Layout"

Berikut tampilan Layout Utama sesuai jenisnya : 

  • Full

 

Desain Tampilan 7.png

(Gambar di atas : Tampilan "Tipe Layout" jenis "Full")

  • Boxed

 

Desain Tampilan 8.png

(Gambar di atas : Tampilan "Tipe Layout" jenis "Boxed")

 

2. "Warna Tema"

Warna Utama Tema tampilan website wedding organizer Anda dapat diatur dengan mengklik menu yang ditandai kotak merah dibawah ini :

Desain Tampilan 9.png

(Gambar di atas : Petunjuk cara mengatur "Warna Tema")

 

3. "Warna Background" 

"Warna Background" dapat Anda atur dengan mengklik menu yang ditandai kotak merah dibawah ini :

Desain Tampilan 10.png

(Gambar di atas : Petunjuk cara mengatur "Warna Background")

 

Untuk pengaturan Warna Tema Warna Background, bisa dilakukan dengan 3 metode yaitu menggunakan RGBHSLHEX.

  • RGB: Metode penentuan warna dimana skema warna terbagi menjadi 3 kanal: Merah, Hijau, Biru dan warna ditentukan dalam bilangan bulat antara 0 dan 255
  • HSL: (Hue Saturation and Lightness): Metode penentuan warna dimana hue ditentukan dalam bilangan bulat antara 0 dan 359, saturation dan lightness ditentukan dalam bentuk persentase
  • HEX: Metode penentuan warna dimana warna Merah, Hijau, Biru dalam format bilangan bulat heksadesimal antara 00 dan FF

Untuk mengganti metode pengaturan warna dapat dengan mengklik tombol yang ditandai dengan kotak merah dibawah ini :

Lv2OIOf7HJS9MSr9i5RVsgV3Y2V9ufpCp4ZGfI4B.jpg

(Gambar di atas : 3 metode penentuan warna)

 

4. "Gambar Background" 

"Gambar Background" tampilan website wedding organizer Anda dapat diatur dengan mengklik tombol "Ubah Gambar" Logo.png terlebih dahulu sebagai berikut : 

 

Desain Tampilan 11.png

(Gambar di atas : Penunjuk tombol "Ubah Gambar" Logo.png)

 

Apabila Anda ingin mengupload gambar yang sudah ada di file komputer Anda, ikuti langkah berikut : 

  1. Klik tombol “Choose File” Logo 2.png, lalu pilih gambar yang ingin diupload
  2. Klik tombol “Upload Gambar”

 

Desain Tampilan 12.png

(Gambar di atas : Penunjuk tombol “Choose File” dan “Upload Gambar”)

 

5. "Posisi Background" 

"Posisi Background" terdiri dari 4 Jenis yaitu “Repeat Scroll”, “Repeat Fixed”, “Fill Scroll”, “Fill Faxed”. Anda dapat memilih yang lebih sesuai dengan keinginan wedding organizer Anda.

  • "Repeat Scroll" : Gambar yang Anda jadikan sebagai background akan dilipatgandakan dan gambar background akan ikut bergerak saat pengunjung website Anda menaikkan atau menurunkan halaman menu.
  • "Repeat Fixed" : Gambar yang Anda jadikan sebagai background akan dilipatgandakan dan gambar background tidak ikut bergerak saat pengunjung website Anda menaikkan atau menurunkan halaman menu.
  • "Fill Scroll" : Gambar yang Anda jadikan sebagai background akan memenuhi background website dari atas sampai bagian bawah website dan gambar background akan ikut bergerak saat pengunjung website Anda menaikkan atau menurunkan halaman menu.
  • "Fill Fixed" : Gambar yang Anda jadikan sebagai background akan memenuhi background website dari atas sampai bagian bawah website dan gambar background tidak ikut bergerak saat pengunjung website Anda menaikkan atau menurunkan halaman menu.

 

Desain Tampilan 13.png

(Gambar di atas : Penunjuk dalam memilih jenis "Posisi Background")

 

Anda juga dapat mengatur dan memilih letak Posisi Background

Desain Tampilan 14.png

(Gambar di atas : Penunjuk dalam memilih jenis letak "Posisi Background")

 

6. "Font Dasar" 

Sesuaikan jenis font yang ingin dipakai pada website sesuai dengan keinginan anda dengan mengklik tombol "Pilih", lalu pilih salah satu font

Desain Tampilan 15.png

(Gambar di atas : Penunjuk tombol "Pilih")

 

Apabila Anda sudah menentukan Layout Utama & Warna website wedding organizer Anda, silahkan pilih “Simpan Pengaturan”

 

Desain Tampilan 16.png

(Gambar di atas : Penunjuk tombol "Simpan Pengaturan")

 

Maka Layout Utama & Warna website Anda sudah berhasil tersimpan.

Twit Terbaru
Facebook Aksana
messenger icon
messenger icon Chat Dengan Kami