Member Area

Bingung Cara Edit Halaman Promosi? Ini Trik Kustomisasi Landing Page HTML PedangPora!

Cara mengedit landing page HTML Luxee PedangPora sangatlah sederhana karena seluruh variabel konten penting telah dikelompokkan ke dalam satu objek konfigurasi JavaScript bernama window.PEDANGPORA_CONFIG di bagian atas file index.html. Anda hanya perlu membuka file tersebut menggunakan text editor, lalu mengganti teks yang berada di dalam tanda kutip untuk memperbarui data merek, nomor WhatsApp admin, harga paket, dan tautan demo undangan instan.

📖
Skenario Penggunaan Nyata

Bayangkan Anda ingin mengubah nomor kontak admin penjualan pada landing page dari nomor demo 628123456789 menjadi nomor WhatsApp kantor Anda sendiri. Daripada menelusuri ribuan baris kode HTML untuk mencari tombol WhatsApp satu per satu, Anda cukup naik ke baris konfigurasi atas, cari baris phoneNumber: "628123456789", lalu ganti angka di dalam tanda kutip dengan nomor baru Anda. Perubahan akan langsung diaplikasikan ke seluruh tombol chat di halaman web secara otomatis.

✨ Kelebihan Fitur Konfigurasi Satu Pintu

  • Skalabilitas Cepat: Cukup ganti sekali, nilai akan terdistribusi otomatis ke seluruh elemen navigasi dan tombol CTA landing page.
  • Bebas Resiko Typo Kode: Struktur HTML halaman promosi tetap terjaga rapi tanpa takut ada tag HTML yang tidak sengaja terhapus.
  • Ramah Pemula: Didesain agar siapa saja yang bisa mengetik teks dapat langsung memodifikasi landing page ini.

🛠️ Langkah Kustomisasi Berkas index.html

Langkah 1: Membuka Berkas index.html

Buka folder lp1 atau lp2 di komputer Anda. Klik kanan pada berkas index.html, lalu pilih opsi untuk mengedit menggunakan editor teks favorit Anda seperti Notepad++. Jika Anda ingin kustomisasi lebih mudah dan cepat dengan bantuan AI Google, gunakan Antigravity IDE.

Langkah 2: Menemukan Baris Konfigurasi

Perhatikan baris kode di baris 12 hingga 63 di bagian atas dokumen. Anda akan menemukan blok komentar besar bertuliskan PENGATURAN LANDING PAGE (UNTUK PEMULA) yang diikuti oleh kode berikut: 

window.PEDANGPORA_CONFIG = {
    brand: {
        title: "Undangan Digital Pedang Pora Premium", 
        logoMain: "pedangpora", 
        logoSub: "INVITATIONS"  
    },
    whatsapp: {
        phoneNumber: "628123456789", 
        globalMessage: "Halo Admin..." 
    },
    // ... setelan demoLinks, pricing, dan socials
};
Objek Konfigurasi Satu Pintu Landing Page index.html

Visual: Struktur skrip pengaturan PEDANGPORA_CONFIG pada bagian atas berkas index.html untuk edit cepat.

Langkah 3: Mengubah Nilai Parameter Teks

Silakan ganti nilai di dalam tanda kutip dua ("") sesuai dengan detail bisnis undangan Anda:

  • brand.title: Judul utama website promosi yang akan muncul di tab browser tamu.
  • whatsapp.phoneNumber: Nomor kontak WhatsApp admin penerima order. Gunakan format internasional (awali dengan 62) tanpa spasi atau tanda tambah (+).
  • demoLinks: Tautan URL demo undangan kedinasan aktif Anda yang akan dibuka saat calon klien mengeklik tombol "Lihat Demo".
  • pricing: Harga paket penawaran jasa Anda. Cukup tulis nominal angka harga paketnya (misal: 297.000).
  • socials: Tautan akun media sosial agensi Anda untuk footer situs.
💡
Pro Tips Keamanan Kode

Pastikan Anda **tidak menghapus tanda kutip dua ("") atau tanda koma (,)** yang membatasi parameter konfigurasi. Jika tanda kutip atau koma terhapus, script landing page akan mengalami error syntax dan data tidak akan tampil pada halaman browser.

🔗 Modul Panduan Terkait

Langkah berikutnya setelah mengedit file HTML selesai adalah menyesuaikan tampilannya:

💡 Pertanyaan Sering Ditanya (FAQ)

Pastikan Anda telah menyimpan (*save*) file index.html setelah melakukan pengeditan di text editor. Cek juga apakah Anda tidak sengaja menghapus tanda kutip penutup pada baris phoneNumber tersebut.

Sebaiknya tuliskan angka harga paketnya saja (contoh: "297.000"). Simbol mata uang rupiah (Rp) sudah disiapkan secara otomatis oleh sistem layout CSS di bagian depan nominal harga.

Jika Anda tidak memiliki salah satu akun medsos (misalnya Twitter/X), cukup kosongkan teks di dalam tanda kutipnya menjadi "". Sistem secara cerdas akan otomatis menyembunyikan ikon medsos tersebut dari footer website.

Terakhir diperbarui: 26-Mei-2026