Website Theme

Bizops menyediakan kemampuan tema tingkat lanjut untuk menyesuaikan tampilan dan nuansa situs web Anda dan membuatnya sesuai dengan merek Anda.

Beranda > Situs Web > Pengaturan > Tema Situs Web

1. Cara Membuat Tema Situs Web

Buka daftar Tema Situs Web dan klik Baru.
Masukkan Nama Tema.
Sesuaikan tema Anda.
Klik Simpan.

Catatan: Pastikan Anda mengatur Tema Situs Web di Pengaturan Situs Web agar tema dapat diterapkan. https://docs.frappe.io/files/website-theme.png

2. Fitur

2.1 Theme Configuration

Bagian "Konfigurasi Tema" ada untuk membuat tema dasar. Di sini Anda dapat memilih skema warna, font, dan gaya tombol.

2.2 Stylesheet

Jika Anda mengetahui tema SCSS dan Bootstrap 4 , Anda dapat menulis SCSS khusus secara manual.

Di kolom "Custom Overrides" Anda dapat menimpa variabel yang ditetapkan oleh berkas tema aplikasi mana pun. Konten kolom ini akan disertakan sebelum mengimpor SCSS lainnya. Misalnya, variabel $spacer ditetapkan 1rem sebagai default. Cukup definisikan ulang menjadi untuk $spacer: 2rem; membuat semua spasi dua kali lebih besar.

Di kolom "Custom SCSS", Anda dapat menambahkan gaya Anda sendiri. Gaya ini akan disertakan setelah mengimpor tema aplikasi. Anda juga dapat mengganti gaya tertentu. Misalnya, jika Anda tidak menyukai tombol kami, cukup sertakan yang berikut ini:

.btn-primary { background-color: $teal; color: $orange; }

2.3 Included Theme Files

Jika Anda melihat tema default yang dihasilkan oleh dialog konfigurasi, ia mengimpor frappe/public/scss/website dan erpnext/public/scss/website . Ini adalah berkas tema default untuk aplikasi frappe dan erpnext . Jika Anda memiliki aplikasi lain yang terpasang, aplikasi tersebut mungkin juga menyediakan website.scss berkasnya sendiri.

Bagian "Berkas Tema yang Disertakan" mencantumkan semua aplikasi yang terpasang. Setiap aplikasi dapat menyertakan berkas temanya sendiri ( [app]/public/scss/website.scss ). Tema mungkin lengkap, menyediakan gaya untuk seluruh situs web, atau hanya sekadar add-on. Misalnya, tema mungkin hanya memberi gaya pada elemen yang diperkenalkannya. Dengan mencentang kotak, Anda dapat memilih tema mana yang harus disertakan dalam situs web Anda.

2.4 Custom JS

Anda juga dapat menulis JavaScript khusus yang akan berjalan saat tema Anda diterapkan. Gunakan untuk menambahkan/menghapus kelas dari elemen, atau skrip apa pun yang membantu Anda mengubah tampilan elemen.