Tips Cara Membuat Tampilan Background Page Web Dan Blog Tema Warna Gradient Tampilan Keren Web

Membuat website baik via Wordprees Maupun blogger,  bagi anda tentu ingin website stay blog and terlihat cantik Dan keren agar pengunjung menyukai website dan betah untuk  dikunjungi

Mempecantik warna di blog dengan warna gradien

Dalam bahagian website ada eleman body postingan , head dan ada juga elemen footer, sebahagian pembuat website tentu ingin menampilkan body postingannya atau footer websitenya dengan tampilan warna berpadu baik 2 atau lebih warna seperti gambar di bawah ini. 

 
Contoh lainnya Padang variasi warna


Nah kali ini, kebetulan saya sedang belajar membangun website dimana template premium dan gratis dari blogger yang dapat saya upload, saya modifikasi, Alhamdulillah, saat oprek oprek HTML edit Dan mencoba Di halaman postingan untuk membuat table tombol ketemu tipsnya dimana yg mesti kita ubah adalah kode backgroud di tema tersebut dgn kode untuk warna keren. Alhamdulillah, berhasil. 

Tips ini saya coba berbagi semoga berhasil dan bermanfaat bagi yang kebetulan ingin memiliki tema background warna nya gradien. 

Dimana warna gradien merupakan gradasi warna adalah konsep penggabungan dua warna atau lebih menjadi satu karakter dengan transisi warna yang sangat lembut dan halus. 

Pemakaian warna gradient ini memang biasa kita temui pada suatu website atau blog untuk menciptakan efek warna yang keren dan cantik pada web atau blog tersebut. Yuk kita langsung saja kepada tips di bawah ini

Sebelum memulai, perlu terlebih dahulu kita mencari bahasa kode untuk warna, untuk kode warna di kenalkan atau bisa di lihat disini. Warna gradien seperti yang telah disampaikan diatas, yaitu perpaduan konsep warna, baik 2 atau lebih dalam meciptakan suatu efek warna yang cantik dan keren sesuai pilihan kita untuk menampilkan efek warna yang keren di website kita.

Setelah merencanakan efek warna dan menyimpan kode warna yg ingin di padukan , saatnya anda salin kode di bawah ini. 


Perlu di ingat bahasa dari kode ini dapat di gunakan halaman elemen dimana saja anda ingin terapkan. Seperti di body postingan, di footer atau di kotak yang ingin anda gradienkan warna nya. untuk kode warna dapat anda kreasikan sendiri dengan pilihan warna lainnya dari anda

Anda hanya perlu di setting CSS nya di terapkan kode diatas tadi ya. Contoh kali ini kita coba diterapkan di footer. Kali ini kita coba kita terapkan pada elemen footer. 

Memberi warna gradien Pada tema footer

Langkah langkah sbb : 

Masuk pada dasboard blog anda. Pilih menu Edit HTML. Saat sudah pada halaman edit html, anda scroll terus kebawah, cari kode untuk html kodenya berupa #footer.wrapper

Untuk footer contoh nya dapat di lihat disini. 

Jika sudah ketemu, hapus background dari tema footer nya dan ganti kode yang sudah di persiapkan. Tampilan akan terlihat seperti ini, lalu klik Save. 

Perlu di ingat, untuk arah warna efeknya bisa di ganti jika anda ingin arah efeknya ke kanan tinggal ubah to right, jika efeknya ke kiri tinggal ubah left, sesuai pilihan kreasi kita sendiri.

Memberi warna gradien Pada table postingan

Selanjutnnya kita ingin mencoba, efek warna pada tulisan berkotak atau table. Kode ini dapat anda terapkan kode postingan anda misalnya untuk membuat table yang memiliki warna. Langkah langkah nya sbb :

Buka halaman posting baru anda. Buatlah html table. Untuk table contoh seperti di bawah ini table promo anda

Disini kode nya bisa di coba,  untuk warna background dapat anda coba cari kode warna pilihan yang ber kode rgb nya. 

Hasil nya akan terlihat seperti dibawah ini 

hot sale
Promo Terkini test warna post saja

Kita misalnya ingin memberikan warna gradient pada kolom table dasar diatas. Pada kode tulisan kode tinggal di ganti dengan kode kreasi warna gradient anda. Lalu coba di save. Dan lihat hasilnya.

Nah. Cukup mudah bukan.? Silahkan di test kreasi web anda dengan kode yang telah di share. Semoga bermanfaat


0 Komentar