Cara Mengatur Jenis Komponen (Produk Lain, Daftar Hotel, Tiket Pesawat)

Video Tutorial Cara Mengatur Jenis Komponen (Produk Lain, Daftar Hotel, Tiket Pesawat)

Mohon maaf, video tutorial untuk materi "Cara Mengatur Jenis Komponen (Produk Lain, Daftar Hotel, Tiket Pesawat)" belum tersedia

Panduan Tertulis Cara Mengatur Jenis Komponen (Produk Lain, Daftar Hotel, Tiket Pesawat)

Komponen merupakan penyusun dari section pada website. Komponen pada website memiliki jenis yang berupa: Heading/JudulGambarLogo Utama, dan lain sebagainya.

Pada panduan bagian ini, akan dipaparkan cara mengatur komponen: Produk Lain, Daftar Hotel, Tiket Pesawat

 

Anda dapat mengatur Komponen website Anda pada 

  1. Masuk pada menu “Manajemen Administrasi”
  2. Klik menu “Data Master & Pengaturan” 
  3. Pilih menu “Desain & Tampilan”
  4. Pilih menu “Tampilan Halaman Utama”
  5. Pilih menu “Theme Builder V2”

 

admin.xit.erahajj.co.id_pengaturan_theme-builder_tema_daftar-tema(SS panduan) (2).png

Selanjutnya Anda akan melihat halaman pengaturan tampilan halaman depan.

 

16709036509251-E9e58RipqZHnuCXa0XvxEvkee1FPGSQqlr5Yrbhe.png

 

     6. Anda dapat menambah komponen pada salah satu section dengan klik tombol "Logo.png" 

 

16709040663082-mQzVmju45GKNzCHB2OqL6OevD7ST7zFBmMAlSKrp.png

 

     7. Selanjutnya pilih salah satu komponen yang ingin ditambah pada website

 

16709041355028-gPRG6snjyOW4NZ670kXuvXfSKM6GizIiOG9vqQ6Q.png

 

Mengatur komponen: Produk Lain

 

  1. Sesuaikan Urutan, Produk Ditampilkan, Jumlah Ditampilkan, Urutkan Berdasarkan, Status Promo, Jenis Tampilan, Tampilkan Thumbnail” dengan keinginan Anda.

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan).png

 

2. Kemudian klik Properti lalu sesuaikan dengan keinginan Anda seperti:

  • Warna Teks: Untuk menentukan warna pada teks
  • Alignment: Untuk mengatur tata letak teks
  • Font: Untuk menentukan jenis font yang ingin dipakai
  • Margin: Untuk mengatur jarak antara Section atau Komponen
  • Padding: Untuk mengatur jarak Komponen yang ada di dalam Section
  • CSS Selector Class: Untuk memberikan style pada Section atau Komponen berdasarkan nama class tertentu pada menu Custom CSS
  • CSS Selector ID: Untuk memberikan style pada Section atau Komponen berdasarkan nama ID tertentu pada menu Custom CSS
  • Custom Inline CSS: Untuk memberikan stlye CSS pada Komponen secara langsung
  • Responsive Layout: Untuk menentukan tampil tidaknya Section atau Komponen terpiih pada ukuran layar tertentu

 

 

16709133987074-CsWUR9JsYbO3HfqC5XbWP3a2LeLyBXcCSfnZlHYX.png

 

   3. Pilih “Background”, lalu sesuaikan Warna Background, Gambar Background, dan Posisi Background”

 

16709135454470-5FnWuP2cj3sPIZl9md6R6QX7xZuNpaZAfBaIvWed.png

 

  • Warna Background ada 3 jenis “Transparan, Sesuai warna Tema, dan Pilih Warna”, Anda dapat memilih sesuai dengan travel anda

 

16709147379537-9bX98bol3sDdBitkshQLNrlIvJBdzjWgFq7ukETk.png

 

  • Gambar Background  

 

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

Klik Ikon Logo.png > Klik tombol simbol Logo 2.png > Pilih “Upload Gambar”

 

16709140824635-T1BkY2dh7iNSRWO9ySNXDtfqXjnhwPF3qxSCaWK4.png

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (26).png

 

  • Posisi Background terdiri dari 4 Jenis yaitu “Repeat Scroll”, “Repeat Fixed”, “Fill Scroll”, “Fill Faxed”. Anda dapat memilih nya sesuai dengan keinginan travel Anda.

 

16709142298736-MckyBBRrSOxyvBSNkFMtXK45ABo4rpUweBIEHamn.png

 

Anda juga dapat mengatur dan memilih letak posisi background

 

16709142906254-hWo2S2KsmAQh02iPPsd1F5Wpnk5iE4Ojg9LSSoII.png

 

   4. Setelah Anda sudah mengaturKomponen, Properti, dan Background”, kemudian pilih kembali Komponen lalu klik Simpan Komponen”

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan).png

 

   5. Setelah Anda sudah mengatur semua nya Anda bisa melakukan Preview Tampilan terlebih dahulu dengan cara pilih ikon Logo 2.png

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (29).png

    6. Dan terakhir apabila sudah di preview tampilan, Anda dapat langsung menerapkan tampilan website dengan cara pilih ikon Logo.png"

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (29).png

 

Mengatur komponen: Daftar Hotel

 

  1. Sesuaikan Urutan, Hotel Ditampilkan, Jumlah Ditampilkan, Urutkan Berdasarkan, Status Promo, Jenis Tampilan, Tampilkan Thumbnail” dengan keinginan Anda.

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (1).png

 

2. Kemudian klik Properti lalu sesuaikan dengan keinginan Anda seperti:

  • Warna Teks: Untuk menentukan warna pada teks
  • Alignment: Untuk mengatur tata letak teks
  • Font: Untuk menentukan jenis font yang ingin dipakai
  • Margin: Untuk mengatur jarak antara Section atau Komponen
  • Padding: Untuk mengatur jarak Komponen yang ada di dalam Section
  • CSS Selector Class: Untuk memberikan style pada Section atau Komponen berdasarkan nama class tertentu pada menu Custom CSS
  • CSS Selector ID: Untuk memberikan style pada Section atau Komponen berdasarkan nama ID tertentu pada menu Custom CSS
  • Custom Inline CSS: Untuk memberikan stlye CSS pada Komponen secara langsung
  • Responsive Layout: Untuk menentukan tampil tidaknya Section atau Komponen terpiih pada ukuran layar tertentu

 

 

16709133987074-CsWUR9JsYbO3HfqC5XbWP3a2LeLyBXcCSfnZlHYX.png

 

   3. Pilih “Background”, lalu sesuaikan Warna Background, Gambar Background, dan Posisi Background”

 

16709135454470-5FnWuP2cj3sPIZl9md6R6QX7xZuNpaZAfBaIvWed.png

 

  • Warna Background ada 3 jenis “Transparan, Sesuai warna Tema, dan Pilih Warna”, Anda dapat memilih sesuai dengan travel anda

 

16709147379537-9bX98bol3sDdBitkshQLNrlIvJBdzjWgFq7ukETk.png

 

  • Gambar Background  

 

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

Klik Ikon Logo.png > Klik tombol simbol Logo 2.png > Pilih “Upload Gambar”

 

16709140824635-T1BkY2dh7iNSRWO9ySNXDtfqXjnhwPF3qxSCaWK4.png

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (26).png

 

  • Posisi Background terdiri dari 4 Jenis yaitu “Repeat Scroll”, “Repeat Fixed”, “Fill Scroll”, “Fill Faxed”. Anda dapat memilih nya sesuai dengan keinginan travel Anda.

 

16709142298736-MckyBBRrSOxyvBSNkFMtXK45ABo4rpUweBIEHamn.png

 

Anda juga dapat mengatur dan memilih letak posisi background

 

16709142906254-hWo2S2KsmAQh02iPPsd1F5Wpnk5iE4Ojg9LSSoII.png

 

   4. Setelah Anda sudah mengaturKomponen, Properti, dan Background”, kemudian pilih kembali Komponen lalu klik Simpan Komponen”

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (1).png

 

   5. Setelah Anda sudah mengatur semua nya Anda bisa melakukan Preview Tampilan terlebih dahulu dengan cara pilih ikon Logo 2.png

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (29).png

    6. Dan terakhir apabila sudah di preview tampilan, Anda dapat langsung menerapkan tampilan website dengan cara pilih ikon Logo.png"

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (29).png

 

Mengatur komponen: Tiket Pesawat

 

  1. Sesuaikan Urutan, Tiket Ditampilkan, Jumlah Ditampilkan, Urutkan Berdasarkan, Status Promo, Jenis Tampilan, Tampilkan Thumbnail” dengan keinginan Anda.

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (2).png

 

2. Kemudian klik Properti lalu sesuaikan dengan keinginan Anda seperti:

  • Warna Teks: Untuk menentukan warna pada teks
  • Alignment: Untuk mengatur tata letak teks
  • Font: Untuk menentukan jenis font yang ingin dipakai
  • Margin: Untuk mengatur jarak antara Section atau Komponen
  • Padding: Untuk mengatur jarak Komponen yang ada di dalam Section
  • CSS Selector Class: Untuk memberikan style pada Section atau Komponen berdasarkan nama class tertentu pada menu Custom CSS
  • CSS Selector ID: Untuk memberikan style pada Section atau Komponen berdasarkan nama ID tertentu pada menu Custom CSS
  • Custom Inline CSS: Untuk memberikan stlye CSS pada Komponen secara langsung
  • Responsive Layout: Untuk menentukan tampil tidaknya Section atau Komponen terpiih pada ukuran layar tertentu

 

 

16709133987074-CsWUR9JsYbO3HfqC5XbWP3a2LeLyBXcCSfnZlHYX.png

 

   3. Pilih “Background”, lalu sesuaikan Warna Background, Gambar Background, dan Posisi Background”

 

16709135454470-5FnWuP2cj3sPIZl9md6R6QX7xZuNpaZAfBaIvWed.png

 

  • Warna Background ada 3 jenis “Transparan, Sesuai warna Tema, dan Pilih Warna”, Anda dapat memilih sesuai dengan travel anda

 

16709147379537-9bX98bol3sDdBitkshQLNrlIvJBdzjWgFq7ukETk.png

 

  • Gambar Background  

 

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

Klik Ikon Logo.png > Klik tombol simbol Logo 2.png > Pilih “Upload Gambar”

 

16709140824635-T1BkY2dh7iNSRWO9ySNXDtfqXjnhwPF3qxSCaWK4.png

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (26).png

 

  • Posisi Background terdiri dari 4 Jenis yaitu “Repeat Scroll”, “Repeat Fixed”, “Fill Scroll”, “Fill Faxed”. Anda dapat memilih nya sesuai dengan keinginan travel Anda.

 

16709142298736-MckyBBRrSOxyvBSNkFMtXK45ABo4rpUweBIEHamn.png

 

Anda juga dapat mengatur dan memilih letak posisi background

 

16709142906254-hWo2S2KsmAQh02iPPsd1F5Wpnk5iE4Ojg9LSSoII.png

 

   4. Setelah Anda sudah mengaturKomponen, Properti, dan Background”, kemudian pilih kembali Komponen lalu klik Simpan Komponen”

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (2).png

 

   5. Setelah Anda sudah mengatur semua nya Anda bisa melakukan Preview Tampilan terlebih dahulu dengan cara pilih ikon Logo 2.png

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (29).png

    6. Dan terakhir apabila sudah di preview tampilan, Anda dapat langsung menerapkan tampilan website dengan cara pilih ikon Logo.png"

 

admin.xit.erahajj.co.id_pengaturan_theme-builder(SS panduan) (29).png

 

Untuk panduan menambah komponen yang lain dapat Anda lihat pada materi sebelumnya atau dengan mengakses link ini

Twit Terbaru
Facebook Erahajj
messenger icon
messenger icon Chat Dengan Kami