Membuat Widget Label Blog Tampilan Metro Flat
Membuat Widget Label Blog Tampilan Metro Flat. Saat ini, mungkin sudah sering anda melihat banyak blog / web yang mengubah penampilannya menjadi flat. Seperti blog ini, beberapa hari lalu telah menyempurnakan desainnya supaya terkesan datar tanpa ada efek 3d, shadow ataupun inset outset. Desain flat memiliki ciri seperti warna yang cerah, padding yang tebal, efek hover animasi dan CSS3 serta beberapa web ada juga yang menerapkan tampilan metro. Sama seperti widget kategori / label Cloud yang akan blog Jona Rendra berikan sebentar.
Berbicara sedikit tentang widget kategori. Apabila anda menggunakan platform blogger/blogspot, pastinya sudah tahu gadget ini. Apalagi anda yang senang mengedit blog. Itu karena widget label memang sudah di vasilitasi atau disediakan oleh pihak Blogger. Kita cukup mengambilnya dan berikan sedikit sentuhan CSS. Sekarang saya akan jelaskan lebih lengkap.
Membuat Widget Label Blog Tampilan Metro Flat Simple
1. Login ke blogger
2. Pada dashboard, pilih blog yang akan diedit
3. Selanjutnya masuk ke Tata Letak, dan klik tambah gadget pada kolom yang sudah anda sesuaikan dengan layout blog anda
4. Di halaman Add gadget tersebut cari lalu pilih gadget yang bernama Label, yang logonya seperti ini
5. Lalu atur penampilan widget dengan mengedit judul, dan tampilkan Cloud dan klik Simpan
6. Tahap ini belum selesai. Sebab, jika hanya segitu tampilan widget ter setting default (biasa). Supaya lebih menarik, mari tambahkan CSS.
7. Caranya, masuk ke Template, Edit HTML
8. Masukkan CSS berikut ini di atas kode
]]></b:skin>
atau </style>
.label a{background:#1ABC9C;color:#fff!important;font-size:13px;padding:0 10px;height:26px;lineheight:26px;text-decoration:none;border:none !important;margin:1px;-webkit-transition:all .2s ease-in-out !important;}
.label a:hover{background:#16A085;}
9. Terakhir klik Simpan Template dan selesai.
Akhirnya widget sudah terpasang diblog. Ini merupakan salah satu upaya kita untuk mendesain sebuah template. Kalau anda ternyata sama seperti saya yang senang desain datar ini, coba pakai template magazine yang saya bagikan di post Template Magazine Responsive K44-White. Dan jangan lupa untuk membaca Cara Menambah Jenis Font Baru Ke Blog karena ada beberapa font style yang bagus tidak disediakan blogger.
Sampai disini dulu postingan Jona Rendra kali ini yang berjudul Membuat Widget Label Blog Tampilan Metro Flat, semoga dapat mempercantik blog anda. Jika ada pertanyaan mengenai tutorial diatas, silahkan kirim lewat form komentar dibawah.
Pertama gak ya ?? hehehe
ReplyDelete~BW~
Wah cantik banget blognya..metro design juga
ReplyDeletehaha, iya
Deletemakasih ya sudah berkunjung
Kalau yang beginian sih emang Jona Rendra jagonya....
ReplyDeletehaha, cuma belajar dari blog blog lain kok :D
Deleteblog kang sun juga punya konten yang menarik
Wah kreen nih,,, aku bookmark dulu blognya,,, nanti aku mampir lagi...
ReplyDeleteok, makasih atas kunjungannya
Deletesekedar mampir smbil baca2.......
ReplyDelete