Header dan footer

Header website adalah bagian atas halaman web dan biasanya berisi elemen seperti logo, menu, bilah pencarian, tombol sign-in/akun pelanggan, dll. Footer ditampilkan di bagian bawah halaman web dan biasanya berisi informasi seperti detail kontak, tautan, pemberitahuan hukum, dan opsi lainnya.

Desain header

Untuk mengubah desain header, klik Edit, lalu klik header. Opsi berikut tersedia di bagian Header pada tab Customize di editor website:

• Pilih Template dari menu drop-down.

• Pilih pengaturan Background untuk mengubah palet warna melalui berbagai Theme styles, opsi warna Custom, dan opsi Gradient.

• Saat menambahkan Border ke header, ukuran, gaya, dan warnanya dapat didefinisikan.

• Sesuaikan Round corners agar sesuai dengan desain.

• Tambahkan Shadow dan tentukan Color, Offset, Blur, dan Spread.

• Tambahkan Scroll Effect. Arahkan kursor pada efek untuk melihat pratinjau.

• Pilih Header Position antara Regular, Hidden, dan Over The Content. Ketika Over The Content dipilih, Anda dapat menyesuaikan Background dan Text Color.

• Tampilkan atau sembunyikan Elements seperti teks, bilah pencarian, tombol Sign, tautan media sosial, tombol Contact us, dan logo.

Untuk menyelesaikan perubahan, klik Save.

Tip

Untuk menyembunyikan header, klik Edit, klik pada header, dan buka tab Theme di editor website. Gulir ke bawah ke bagian Advanced dan alihkan tombol Show Header untuk menyembunyikan/menampilkan header.

Konten header

Menu mengatur konten header dan membantu pengguna menavigasi halaman web secara efektif. Menu yang ramah pengguna dan terstruktur dengan baik juga memainkan peran penting dalam meningkatkan peringkat mesin pencari.

Editor menu

Editor menu memungkinkan untuk mengedit header website dan menambahkan item menu dan mega menu.

Untuk mengedit konten header, buka Website ‣ Site ‣ Menu Editor. Dari sana, Anda dapat:

• mengganti nama item menu atau mengubah URL-nya menggunakan ikon Edit Menu Item;

• menghapus item menu menggunakan ikon Delete Menu Item;

• memindahkan item menu dengan menyeret dan meletakkannya ke tempat yang diinginkan di menu;

• membuat menu drop-down biasa dengan menyeret dan meletakkan item sub-menu ke kanan, di bawah menu induknya.

Catatan

Anda juga dapat mengakses editor menu dengan mengklik Edit, memilih item menu mana pun, dan mengklik ikon Edit Menu.

Tambahkan item menu

Secara default, halaman ditambahkan ke menu sebagai item menu drop-down ketika halaman dibuat. Untuk menambahkan item menu baru, ikuti langkah-langkah berikut:

1. Buka Website ‣ Site ‣ Menu Editor.

2. Di editor menu, klik Add Menu Item.

3. Di jendela pop-up, masukkan Nama yang akan ditampilkan di menu.

4. Ketik / di bidang URL atau Email untuk mencari halaman di website Anda atau # untuk mencari anchor kustom yang ada.

5. Klik OK.

6. Edit struktur menu jika diperlukan, lalu Simpan.

Desain item menu

Untuk mengubah item menu, klik Edit, klik item menu, lalu buka bagian Navbar dari editor website. Opsi berikut tersedia:

• Sesuaikan Perataan Seluler.

• Pilih Font untuk item menu.

• Ubah ukuran font, warna, dan perataan di bidang Format.

• Pilih Gaya Tautan untuk menyorot halaman saat ini di menu.

• Ubah gaya tombol header.

• Pilih untuk menampilkan Sub Menu Saat Diarahkan atau Saat Diklik.

Catatan

Bidang yang tersedia di bagian Navbar dapat bervariasi tergantung pada template yang dipilih.

Untuk menyelesaikan perubahan, klik Save.

Menu mega

Menu mega mirip dengan menu drop-down, tetapi alih-alih daftar sub-menu sederhana, menu ini menampilkan panel yang dibagi menjadi grup-grup opsi navigasi. Hal ini membuat menu mega cocok untuk website dengan jumlah konten besar atau website eCommerce, karena dapat membantu menyertakan semua halaman web atau kategori eCommerce Anda dalam menu sambil tetap membuat semua item menu terlihat sekaligus.

Untuk membuat mega menu, buka Website ‣ Site ‣ Menu Editor dan klik Tambahkan Item Mega Menu. Masukkan Nama mega menu di pop-up, klik OK, lalu Simpan.

Untuk menyesuaikan opsi dan konten mega menu, klik item mega menu di header, lalu klik Edit. Mega menu terdiri dari blok bangunan, yang berarti Anda dapat menyesuaikan setiap komponen secara individual. Misalnya:

• Edit teks langsung di blok bangunan.

• Edit URL item menu dengan memilih item menu dan mengklik tombol Edit tautan di pop-up pratinjau kecil. Ketik / untuk mencari halaman di website Anda, atau # untuk mencari anchor kustom yang ada.

  

• Pindahkan item menu dengan menarik dan meletakkan blok terkait ke posisi yang diinginkan di mega menu.

• Hapus item menu dengan menghapus blok terkait.

Untuk menyesuaikan tata letak umum mega menu, buka tab Customize di editor website, lalu di bagian Mega Menu:

• Pilih Template.

• Pilih Size: baik Full-Width atau Narrow.

Untuk menyelesaikan perubahan, klik Save.

Sembunyikan item menu dinamis untuk user yang tidak login

Untuk menyembunyikan item menu dinamis (yaitu, item menu yang dibuat secara otomatis oleh Odoo, misalnya, ketika Anda menginstal aplikasi atau modul, seperti Acara, Courses, dll.) untuk user yang tidak login, ikuti langkah-langkah berikut:

1. Aktifkan mode pengembang.

2. Buka Website ‣ Configuration ‣ Menus.

3. Perluas daftar menu untuk website yang relevan jika diperlukan, lalu klik item menu yang ingin Anda sembunyikan.

4. Di bagian Visible Groups, klik Add a line di bawah Group Name.

5. Cari grup User types / Portal, pilih, lalu klik Select.

6. Simpan.

Tip

Untuk menyembunyikan item menu Shop, batasi akses eCommerce hanya untuk pengguna yang sudah login.

Desain footer

Untuk mengubah footer, klik Edit, klik footer, dan di bagian Footer pada tab Customize di editor website:

• Pilih Template.

• Pilih Colors.

• Pilih Slideout Effect: Regular (tanpa efek), Slide Hover, atau Shadow.

• Aktifkan atau nonaktifkan tombol Copyright untuk menyembunyikan atau menampilkan hak cipta.

• Pilih ukuran Border.

• Tambahkan Shadow.

• Tambahkan Scroll Top Button dan pilih posisinya.

• Sembunyikan atau tampilkan footer dengan mengaktifkan tombol Page visibility.

Untuk menyelesaikan perubahan, klik Save.