5 Langkah Membuat Template Responsive Pada Blog

Cara Membuat Template Responsive Pada Blog - Assalamu'alaikum sobat blogger, kali ini saya akan membahas tentang membuat template blog menjadi responsive. Apa itu responsive???, Responsive adalah template yang mampu menyusaikan dengan tampilan - tamplian pada handphone.

Responsive juga dapat meningkatkan SEO, jadi sangat di rekomendasikan dehh... Sebagai contoh sobat bisa lihat template Responsive yang satu ini Material Clean sangat bagus bukan??? hehehehe.

Langkah - Langkah Membuat Template Responsive

1. Langkah pertama yaitu sobat Login seperti biasa ke Blog Sobat.

2. Masuk ke Template => Edit HTML.

3. Lalu tambahkan Meta Tag berikut dengan Meta Tag yang lainnya

<meta name="viewport" content="width=device-width, initial-scale=1.0">

4. Nah sekarang Blogger sobat sudah support untuk membuat Responsivenya, Sobat bisa menambahkan kode di bawah ini tepat diatas kode </head>

<style type='text/css'>
@media only screen and (max-width:683px){
.post-outer {width:100%;}
#sidebar-wrapper {display:none;}
}
</style>

Saya akan menjelaskan fungsi funsinya. Kode di atas berarti jika tampilan handphone dengan lebar 683px maka lebar class post-outer akan menjadi 100% dan akan membuat Sidebar menjadi hilang.

5. sobat bisa merubahnya sesuka hati sobat.

Nah itulah cara membuat template responsive, mudah kan??? kalau ada kesulitan atu ada masalah sobat bisa bertanya di kotak komentar, Keep Pusing & Keep Ngoprek, Sekian tutorial dari saya. sampai bertemu di tutorial berikutnya... :D