Skip to main content

Cara Membuat Warna Gradasi pada Menu Navigasi Blogger

Cara Membuat Warna Gradasi pada Menu Navigasi Blogger - Hallo sahabat Gadgetplus, Pada Artikel yang anda baca kali ini dengan judul Cara Membuat Warna Gradasi pada Menu Navigasi Blogger, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel Blogger, Artikel HTML, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Cara Membuat Warna Gradasi pada Menu Navigasi Blogger
link : Cara Membuat Warna Gradasi pada Menu Navigasi Blogger

Baca juga


Cara Membuat Warna Gradasi pada Menu Navigasi Blogger

Cara Membuat Warna Gradasi pada Menu Navigasi Blogger
Cara Membuat Warna Gradasi pada Menu Navigasi Blogger - Akhir-akhir ini para blogger Indonesia diramaikan dengan pewarnaan gradasi pada pada Blog. Hal ini juga menjadi trend baru saat ini, tak sedikit juga blogger Indonesia mencoba serta mengaplikasikan pewarnaan gradasi pada situs mereka, bahkan Blogger terkenal seperti Adhi Suryadi (kompiajaib.com) dan Arlina Fitriyani (arlinadzgn.com) juga mengaplikasikan efek warna gradasi pada situs mereka.

Warna gradasi sendiri merupakan corak warna yang bisa dikembangkan/dipadukan dari dua atau lebih warna, sehingga membuat tingkatan warna tertentu dengan tidak merusak dan mengubah warna itu sendiri, dengan kata lain warna gradasi adalah perkembangan warna atau perubahan warna yang terjadi ketika dua warna atau lebih digabungkan.

Memang tampilan warna gradasi lebih terlihat bagus dibanding warna HTML yang biasa digunakan oleh para blogger, apalagi bila sobat pandai memilih paduan warnanya, tidak hanya itu sobat dapat menambahkan animasi pada warna gradasi. Keumuman blogger mengaplikasikan warna gradasi pada navigasi atau header blog, seperti Arlina Design atau Kompi ajaib. Dan saya sendiri menggunakan gradasi warna pada blog ini, dengan tambahan animasi.

Oleh karenanya pada kesempatan ini saya akan memberikan tutorial singkat Cara membuat warna gradasi pada menu navigasi blogger, berbeda pada gradasi warna yang dipakai keumuman blogger, saya akan menambahkan animasi perpindahan warnanya, seperti yang digunakan oleh Arlina Design. Saya sendiri terispirasi dari Arlina Design(www.arlinadzgn.com) yang menggunakan Gradasi warna dengan animasi.

Cara Membuat Warna Gradasi pada Menu Navigasi Blogger

Langkah Pertama
Masuk ke Blogger, lalu pilih Tema >> Edit HTML

Langkah Kedua
Kemudian tambahkan style berikut pada class menubar atau header blog, contohnya class menubar yaitu #main-wrap
#mainwrap{width:1010pxmargin:0 auto;}
Setelah ditambahkan seperti berikut
#mainwrap{width:1010pxmargin:0 auto;background:#f24a4a;background:linear-gradient(-50deg,#ee5952,#ea3a7e,#20aadb,#23e0b3);background-size:320% 200%;animation:Gradient 15s ease infinit;display:block;}

Langkah Ketiga
Selanjutnya, menambahkan css animasi supaya animasi gradsi warna berjalan, silahkan letakan kode berikut sebelun ]]></b:skin>
/* Animation */
@keyframes Gradient{0%{background-position:0 50%}50%{background-position:100% 50%}100%{background-position:0 50%}}

Langkah Keempat
Smpan Template, lihat hasilnya

Mudah bukan? Semoga tampilan blog sobat menjadi lebih menarik, selain itu dengan menggunakan warna gradasi pada blog, berarti sobat telah mengikuti trend blogger kekinian.

Baca Juga: Waktu yang Tepat Untuk Menulis di Blog

Nah demikian artikel mengenai tutorial Cara Membuat Warna Gradasi pada Menu Navigasi Blogger seperti pada blog Arlina Design, semoga dapat bermanfaat.



Demikianlah Artikel Cara Membuat Warna Gradasi pada Menu Navigasi Blogger

Mudah-mudahan tutorial Cara Membuat Warna Gradasi pada Menu Navigasi Blogger Kali ini, bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya. Dan jangan lupa share tutorial ini agar semakin berguna bagi orang banyak.

Anda sekarang membaca artikel Cara Membuat Warna Gradasi pada Menu Navigasi Blogger dengan alamat link https://www.gadgetplus.my.id/2018/07/cara-membuat-warna-gradasi-pada-menu_27.html
Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui.
Buka Komentar
Tutup Komentar