Mendesain formulir kontak Anda

Setelah menambahkan formulir kontak, Anda dapat menyesuaikan tampilannya. Panduan ini akan menunjukkan cara mengubah gaya, warna, dan tata letak formulir situs Anda.

Blok Formulir menyertakan berbagai gaya desain formulir yang dapat Anda pilih:

1. Pilih Tampilan Daftar pada sudut kiri atas editor. Ikonnya tampak seperti tumpukan tiga garis horizontal.
2. Temukan blok Formulir di sini lalu klik:

3. Pada pengaturan blok di bilah sisi kanan, klik pada tab Gaya (ditampilkan dengan ikon lingkaran hitam dan putih):

4. Pilih gaya:
   • Default menampilkan nama kolom di luar kolom input tanpa animasi.
   • Bergerak menampilkan nama kolom di dalam kolom input dan animasi singkat serta menyoroti kolom yang diklik pengunjung.
   • Tepian menampilkan nama kolom di dalam kolom input, animasi singkat, dan tepian di sekeliling pengaturan blok formulir setiap saat.
5. Klik tombol “Simpan” di atas layar.

Teks placeholder adalah teks contoh yang bisa muncul di kolom formulir sebelum pengunjung mengklik kolom tersebut, dan kemudian menghilang saat mereka mengklik untuk mulai mengetikkan teks mereka sendiri. Teks ini bermanfaat untuk menunjukkan kepada pengunjung Anda contoh konten perlu diisikan dalam formulir.

Untuk menambahkan teks placeholder ke formulir kontak:

1. Klik kolom mana pun di formulir Anda.
2. Buka pengaturan blok di bilah sisi.
3. Gulir turun ke pengaturan “Teks placeholder“.
4. Ketik teks placeholder Anda pada kotak yang tersedia. Teks akan muncul dalam kolom formulir.
5. Klik tombol “Simpan” di atas layar.

Secara default, kolom dalam formulir akan mengisi lebar kontainer formulir. Anda dapat mengubah lebar masing-masing kolom dengan melakukan langkah-langkah berikut:

1. Klik kolom mana pun di formulir Anda.
2. Buka pengaturan blok di bilah sisi.
3. Gulir turun ke pengaturan Lebar dan atur lebar menjadi 25%, 50%, 75%, atau 100%.
   • Jika Anda ingin dua kolom ditampilkan bersebelahan, atur masing-masing ke 50%. Jika ada ruang, beberapa kolom dapat muncul dalam satu baris.
4. Klik tombol “Simpan” di atas layar.

Anda dapat memilih untuk mengedit tampilan warna dan teks untuk tiap formulir, atau Anda dapat mengaturnya sehingga setiap kolom formulir menggunakan pengaturan warna dan teks yang sama.

Jika Anda mengklik satu kolom formulir, pengaturan blok akan menyertakan toggle “Sinkronkan gaya kolom“. Jika toggle diatur ke posisi AKTIF, perubahan yang Anda lakukan pada kolom ini akan memengaruhi semua kolom. Klik ke posisi NONAKTIF jika Anda ingin mengubah pengaturan untuk kolom tersebut saja:

Anda dapat menyinkronkan perubahan berikut ke semua kolom untuk memastikan pengalaman visual yang konsisten di seluruh formulir:

• Warna: mengatur warna untuk:
  • Teks Label: teks yang muncul di atas kolom formulir.
  • Teks Kolom: teks placeholder (opsional) serta teks input dalam kolom.
  • Latar Belakang Kolom: latar belakang bagian input pada kolom formulir.
  • Garis Tepi: garis yang mengelilingi kolom formulir.
• Gaya Kolom Input: Menetapkan ukuran teks, tinggi baris, dan gaya garis tepi untuk kolom.
• Gaya Label: Menetapkan ukuran teks dan tinggi baris untuk label kolom.

Untuk menyesuaikan warna formulir Anda, ikuti langkah-langkah berikut:

1. Buka Tampilan Daftar lalu temukan blok Formulir dan tiap kolom di dalamnya:

2. Dengan seluruh blok Formulir dipilih, buka pengaturan blok di bilah sisi lalu klik tab Gaya (ikon lingkaran hitam dan putih).
3. Dengan menggunakan pengaturan warna, Anda dapat mengontrol warna teks dalam formulir, warna latar belakang, dan warna tautan yang digunakan dalam formulir:

4. Selanjutnya, klik pada kolom formulir individu dan buka lagi pengaturan blok.
5. Di sini, Anda dapat mengontrol warna-warna berikut untuk tiap kolom formulir individu:
   • Teks Label: teks yang muncul di atas kolom formulir.
   • Teks Kolom: teks placeholder (opsional) serta teks input dalam kolom.
   • Latar Belakang Kolom: latar belakang bagian input pada kolom formulir.
   • Garis Tepi: garis yang mengelilingi kolom formulir.
6. Aktifkan toggle “Sinkronkan gaya kolom” untuk menerapkan perubahan ke semua kolom, atau nonaktifkan untuk mengontrol setiap kolom secara terpisah.
7. Klik tombol “Simpan” di atas layar.