Kembali ke Menu Utama

Panduan Header

Atur logo, judul, dan slogan halaman login

Langkah Pengaturan

1

Buka File

Buka file config/data/header.js

2

Upload Logo

Upload logo ke folder public dan sesuaikan path

3

Ubah Teks

Ganti judul dan slogan sesuai kebutuhan

File Konfigurasi

config/data/header.js
header.js
window.headerConfig = {

    // ============================================
    // PENGATURAN LOGO
    // ============================================

    logo: {
        // Tampilkan atau sembunyikan logo
        // 1 = tampil, 0 = sembunyi
        enabled: 1,

        // Lokasi file logo
        imagePath: "./public/logo.png",

        // Ukuran logo
        width: "90px",    // Lebar (px, %, em)
        height: "auto",  // Tinggi (auto = proporsional)
    },

    // ============================================
    // PENGATURAN JUDUL
    // ============================================

    title: {
        // 1 = tampil, 0 = sembunyi
        enabled: 1,

        // Layout: 0 = title di bawah logo (vertical)
        //         1 = title di samping logo (horizontal)
        flex: 1,

        // Teks judul besar
        name: "Login Page NLH",

        // Ukuran font judul (rem, px, em)
        fontSize: "0.85rem"
    }
};

Penjelasan Detail

01

logo

Pengaturan logo di bagian atas:

  • enabled: Tampilkan/sembunyikan
  • imagePath: Lokasi file logo
  • width/height: Ukuran logo
02

title

Judul besar yang muncul di header. Gunakan flex: 0 untuk vertical (title di bawah logo) atau flex: 1 untuk horizontal (title di samping logo).

03

title.flex

Layout posisi title. 0 = vertical (title di bawah logo), 1 = horizontal (title di samping logo).

04

title.fontSize

Ukuran font judul. Default 0.85rem. Bisa gunakan px, em, atau rem.

Cara Mengganti Logo

1

Siapkan file logo (PNG/JPG) dan upload ke folder public/

2

Ubah imagePath sesuai lokasi file logo Anda

3

Sesuaikan width jika logo terlalu besar/kecil

Rekomendasi Layout

Gunakan flex: 0 jika logo Anda besar dan ingin title di bawahnya. Gunakan flex: 1 untuk tampilan horizontal yang lebih compact.

Erik Sanjaya - Login Page Hotspot Mikrotik

https://eriksanjaya.com