
Cara Mengubah Desain Dashboard CyberPanel di Cloud VPS

Hai DomaiNesians! Mengelola VPS kini semakin mudah dengan control panel seperti CyberPanel, yang menawarkan fitur canggih untuk mengelola website dan server. Salah satu fitur unggulan CyberPanel adalah kemampuan untuk mengubah desain dashboard sesuai kebutuhan. Desain dashboard yang menarik dan sesuai dengan identitas merek bukan hanya soal estetika, tetapi juga memberikan kenyamanan dan pengalaman pengguna yang lebih baik. Fitur “Design” pada CyberPanel menjadi solusi praktis untuk mengatasi kebutuhan kustomisasi ini. Dengan fitur ini, kita bisa menyesuaikan tampilan dashboard agar lebih personal dan mendukung branding yang diinginkan, tanpa perlu keahlian teknis mendalam. Artikel ini akan memandu secara lengkap bagaimana mengubah desain dashboard CyberPanel di Cloud VPS, mulai dari langkah dasar hingga kustomisasi tingkat lanjutan.
Mengapa Butuh Mengubah Desain Dashboard di CyberPanel?
Desain dashboard atau antarmuka website merujuk pada tata letak, warna, font, dan elemen visual lainnya yang membentuk tampilan suatu platform. Dalam konteks CyberPanel, desain dashboard mencakup elemen seperti logo, warna latar, dan ikon yang muncul saat mengakses panel kontrol. Desain ini menjadi wajah pertama yang dilihat pengguna saat masuk ke dashboard, sehingga penting untuk membuatnya menarik dan fungsional.
CyberPanel menyediakan fitur “Design” yang memungkinkan pengguna mengubah tampilan dashboard dengan mudah. Fitur ini memanfaatkan CSS (Cascading Style Sheets) untuk mengkustomisasi elemen visual tanpa mengubah struktur inti sistem. Dengan fitur “Design”, kita bisa menyesuaikan elemen seperti warna latar belakang, logo, atau tata letak tertentu untuk mencerminkan identitas merek. Fitur ini terintegrasi langsung di dashboard CyberPanel, sehingga proses kustomisasi menjadi lebih sederhana dibandingkan mengedit file sistem secara manual.
Fitur “Design” pada CyberPanel fokus pada penyesuaian berbasis CSS, yang berarti perubahan hanya memengaruhi tampilan visual tanpa mengubah fungsi inti sistem. Namun, bagi pengguna yang ingin kustomisasi lebih mendalam, seperti mengganti favicon atau elemen inti lainnya, CyberPanel memungkinkan pengeditan file di direktori VPS. Meski begitu, langkah ini memerlukan pengetahuan teknis tambahan, seperti penggunaan SFTP atau pengeditan file sistem.
Berikut adalah beberapa skenario di mana fitur “Design” sangat berguna:
- Membangun identitas merek yang konsisten di seluruh platform, termasuk dashboard CyberPanel.
- Menyesuaikan tampilan untuk klien tertentu, misalnya saat menawarkan layanan hosting berbasis VPS.
- Meningkatkan kenyamanan visual bagi pengguna yang sering mengakses dashboard.
- Mengadaptasi desain untuk mendukung tema tertentu, seperti tema terang atau gelap.
Fitur “Design” di CyberPanel memberikan solusi praktis untuk mengatasi skenario-skenario tersebut. Dengan antarmuka yang ramah pengguna, kita bisa mengubah desain tanpa perlu keahlian mendalam, sekaligus memastikan dashboard tetap fungsional dan sesuai dengan kebutuhan.
Mengakses Dashboard CyberPanel
Nah, DomaiNesians! Setelah memahami pentingnya mengubah desain dashboard, langkah pertama adalah mengakses dashboard CyberPanel. Proses ini cukup sederhana, tetapi memerlukan beberapa langkah awal untuk memastikan akses berjalan lancar.
Untuk menggunakan fitur “Design”, panduan ini menggunakan CyberPanel versi 2.4 dengan lisensi gratis. Perlu dicatat bahwa antarmuka mungkin sedikit berbeda jika menggunakan versi berbayar (Enterprise) atau versi lain. Namun, langkah-langkah dasarnya tetap serupa. Jika belum memiliki VPS atau layanan hosting, segera kunjungi Paket Hosting DomaiNesia atau Cloud VPS Termurah dan Mudah di DomaiNesia untuk memulai.
Untuk mengakses dashboard CyberPanel, kita perlu mengetahui alamat IP VPS terlebih dahulu. Informasi ini bisa ditemukan di Dashboard MyDomaiNesia. Setelah mendapatkan alamat IP, tambahkan port 8090 pada URL di browser, misalnya https://160.12.34.567:8090. Masukkan nama pengguna dan kata sandi yang telah dibuat saat konfigurasi awal VPS. Jika lupa alamat IP, cukup cek kembali di dashboard MyDomaiNesia untuk memastikan koneksi lancar.
Proses Mengubah Desain Dashboard CyberPanel
Untuk mengubah desain dashboard CyberPanel, langkah pertama adalah mengakses halaman “Design”. Halaman ini dapat ditemukan melalui menu “Overview” pada sidebar dashboard CyberPanel, lalu pilih sub-menu “Design”. Antarmuka ini dirancang intuitif, sehingga memudahkan kita untuk mulai mengkustomisasi.
Setelah masuk ke halaman “Design”, kita akan melihat kolom dropdown yang berisi pilihan desain pre-made dari CyberPanel. Desain ini mencakup tema-tema siap pakai dengan kombinasi warna dan tata letak yang berbeda. Cukup pilih salah satu tema dari dropdown, dan kode CSS terkait akan muncul di kolom di bawahnya. Tema-tema ini memungkinkan perubahan cepat tanpa perlu menulis kode dari awal.
Setelah memilih tema dan melihat kode CSS di kolom, klik tombol “Save Changes” untuk menerapkan perubahan. Dashboard akan langsung menampilkan desain baru sesuai tema yang dipilih. Proses ini sangat cepat dan memungkinkan kita untuk melihat hasilnya secara instan.
Jika ingin mengembalikan desain ke tampilan default, cukup hapus semua kode di kolom CSS pada halaman “Design”, lalu klik “Save Changes” kembali. Langkah ini akan menghapus kustomisasi dan mengembalikan dashboard ke pengaturan awal CyberPanel.
Proses Mengubah Desain Dashboard Tahap Lanjutan
Bagi pengguna yang sudah familiar dengan pemrograman web, seperti CSS atau penggunaan fitur inspeksi elemen pada browser, kustomisasi lanjutan bisa menjadi langkah berikutnya. Bagian ini cocok untuk mereka yang ingin menyesuaikan desain lebih spesifik, terutama jika tema pre-made tidak sesuai dengan branding yang dimiliki.
Misalnya, untuk mengganti logo CyberPanel dengan logo merek sendiri, kita perlu mengetahui elemen CSS yang mengatur logo tersebut. Buka dashboard CyberPanel di browser, lalu gunakan fitur “Inspeksi Elemen” (biasanya diakses dengan klik kanan dan pilih “Inspect” atau “Inspeksi Elemen”). Fitur ini memungkinkan kita melihat struktur kode HTML dan CSS yang digunakan oleh dashboard.
Dari inspeksi elemen, terlihat bahwa logo CyberPanel dikaitkan dengan variabel #header-logo. Untuk menimpanya, kita bisa menambahkan kode CSS khusus di halaman “Design”. Berikut adalah contoh kode untuk mengganti logo:
1 2 3 4 5 |
#header-logo .logo-content-big .logo-content-small { background: url('https://ganti-url-gambar.com') left 50% no-repeat !important; background-size: contain !important; background-position: center !important; } |
Ganti https://ganti-url-gambar.com dengan URL gambar logo yang diinginkan. Pastikan gambar sudah diunggah ke lokasi yang dapat diakses, seperti server atau layanan hosting gambar. Setelah menambahkan kode ini di kolom “Design”, klik “Save Changes” untuk melihat logo baru pada dashboard.
Untuk mengubah elemen lain, seperti favicon (ikon website), kita perlu mengakses direktori inti CyberPanel. Gunakan perintah berikut untuk menemukan lokasi file favicon:
1 |
find / -name "favicon.png" |
Perintah ini akan menampilkan lokasi file favicon di sistem. Biasanya, terdapat lima file favicon yang perlu diganti untuk memastikan perubahan diterapkan sepenuhnya. Untuk mengakses dan mengganti file ini, gunakan SFTP atau FTP untuk terhubung ke VPS. Pastikan klien SFTP seperti FileZilla sudah dikonfigurasi untuk mengakses direktori inti CyberPanel.
Desain CyberPanel Berhasil Diubah!
Selamat DomaiNesians!, Kita telah berhasil mengubah desain dashboard CyberPanel di Cloud VPS, mulai dari menggunakan tema pre-made hingga kustomisasi lanjutan seperti mengganti logo dan favicon. Dengan fitur “Design”, CyberPanel memudahkan penyesuaian tampilan tanpa mengganggu fungsi inti sistem. Kustomisasi ini tidak hanya memperkuat identitas merek, tetapi juga meningkatkan kenyamanan pengguna saat mengelola server. Mulai dari pengaturan sederhana via CSS hingga pengeditan file inti, semua langkah telah dibahas secara rinci.
Semoga panduan ini membantu dalam mengoptimalkan pengalaman menggunakan CyberPanel. Sampai jumpa di artikel dan panduan DomaiNesia berikutnya!