Membuat CSS Kustom di Webs.com

Akuntan Webs.com menyediakan fitur seperti template halaman siap pakai, sehingga Anda dapat mempublikasikan situs bisnis dan pribadi tanpa perlu menguasai kode. Namun, jika Anda sudah familiar dengan Cascading Style Sheets (CSS), Anda dapat membuat kode kustom. CSS memberi kendali penuh atas tata letak dan desain template, memungkinkan Anda mulai dari awal atau memodifikasi desain yang ada. Dengan menggunakan menu Webs.com, terapkan CSS Anda agar halaman terlihat berbeda.

Langkah‑langkah Membuat CSS Kustom

Step 1

Masuk ke akun Webs.com Anda dan klik tab “Modify Template” di bilah menu kanan atas.

Step 2

Klik tautan “Change Template” yang muncul di bawah menu utama, lalu pilih opsi “All” di sisi kiri. Tindakan ini menampilkan semua opsi template yang tersedia di Webs.com.

Step 3

Geser ke sisi kanan daftar template dan klik kotak “Custom CSS”. Klik tab “Advanced CSS” untuk membuka kotak teks tempat Anda memasukkan aturan gaya.

Step 4

Masukkan kode CSS kustom untuk mendesain template Webs.com Anda. Misalnya, tentukan warna latar belakang tubuh, yang mengontrol tampilan keseluruhan halaman, seperti contoh berikut:

body { background-color: #cccccc; }

Klik tombol “Save” di kanan atas. Tekan “See My Site” pada jendela dialog yang muncul untuk melihat hasil CSS yang diterapkan.

Tips Styling

• Sesuaikan tinggi header (banner atas) dengan menulis #fw-head { height: 300px; }.
• Ubah warna item menu navigasi: #fw-nav-menu li { color: #c0c0c0; }.
• Atur ukuran judul di atas area konten: .fw-title { font-size: 18px; }.
• Desain latar belakang sidebar: #fw-sidebar { background-color: #ffff00; }.
• Personalisasi warna hyperlink: a:link { color: #00ffff; }.