Cara Mengganti Judul Blog dengan Logo atau Gambar pada Template Contempo, Terkemuka, Emporio dan Soho
Seo v6 - Halo sobat blogger semua kali ini saya akan memberikan tutorial cara membuat judul blog bergambar logo pada template terbaru blogger contempo, terkemuka (notable), emporio dan soho.
Pada template bawaan blogger kali ini saya melihat pada CSS bawaan nya untuk menampilkan gambar atau logo pada judul blog menggunkan lebar maksimal atau 100%, ini mengakibatkan kalau kita hendak menganti title blog dengan gambar maka akan ditampilkan lebar yang maksimal dan menurut saya menjadi kan desain template itu sendiri menjadi tidak bagus.
Pada tutorial kali ini saya akan membagikan trik untuk memaksimalkan ukuran gambar dan logo menjadi lebih pas dengan ukuran header, sehingga gambar dan logo yang ditampilkan menjadi seimbang pada template terbaru kali ini.
Kenapa judul blog harus diganti menjadi gambar atau logo?
Ini untuk memberikan kesan profesional yang lebih tinggi pada blog tersebut, namun tentunya kesan ini juga harus diimbangi dengan desain logonya yang bagus, tidak asal jadi, harus penuh dengan perhitungan dan memiliki nilai seni yang tinggi.
Berapa ukuran logo atau gambar yang diperlukan?
Untuk code CSS yang saya sematkan nantinya menggunakan tinggi maksimal 50px dan lebar yang otomatis mengikuti tinggi logo, jadi untuk membuat logo gunakan ukuran tinggi yang mendekati 50 px, namun kalau pun lebih dari 50 px maka tidak mengapa karena nantinya logo pada ukuran berapa pun akan ditampilkan dengan tinggi maksimal 50px - Seo v6.
Masukkan logo png kamu pada choose file lalu pilih setelan selain judul dan keterangan lalu simpan, pada proses ini kamu sudah berhasil memasukkan logo pada header, namun pada template terbaru blogger kali ini masih menggunkan lebar masimal.
Baca: Cara mengganti background template
Untuk membuat logo memiliki size yang baik maka masukkan code dibawah ini pada css template pada menu tema > edit html. Lalu masukkan code CSS dibawah ini tepat diatas ]]></b:skin>
Untuk template Contempo
Untuk template Terkemuka (Notable)
Untuk template Soho dan Emporio
Setelah di copy paste code diatas lalu simpan. Selesai.
Jika dirasa logo pada header terlalu kecil atau terlalu besar, code 50 px pada CSS diatas bisa kamu sesuaikan sendiri, jika mau logo agak besaran maka masukkan nilai lebih dari 50px jika mau kecil maka kebalikkannya.
Jika ada pertanyaan atau eror bisa langsung komen saja, semoga berhasil - Seo v6
Pada template bawaan blogger kali ini saya melihat pada CSS bawaan nya untuk menampilkan gambar atau logo pada judul blog menggunkan lebar maksimal atau 100%, ini mengakibatkan kalau kita hendak menganti title blog dengan gambar maka akan ditampilkan lebar yang maksimal dan menurut saya menjadi kan desain template itu sendiri menjadi tidak bagus.
Pada tutorial kali ini saya akan membagikan trik untuk memaksimalkan ukuran gambar dan logo menjadi lebih pas dengan ukuran header, sehingga gambar dan logo yang ditampilkan menjadi seimbang pada template terbaru kali ini.
Kenapa judul blog harus diganti menjadi gambar atau logo?
Ini untuk memberikan kesan profesional yang lebih tinggi pada blog tersebut, namun tentunya kesan ini juga harus diimbangi dengan desain logonya yang bagus, tidak asal jadi, harus penuh dengan perhitungan dan memiliki nilai seni yang tinggi.
Berapa ukuran logo atau gambar yang diperlukan?
Untuk code CSS yang saya sematkan nantinya menggunakan tinggi maksimal 50px dan lebar yang otomatis mengikuti tinggi logo, jadi untuk membuat logo gunakan ukuran tinggi yang mendekati 50 px, namun kalau pun lebih dari 50 px maka tidak mengapa karena nantinya logo pada ukuran berapa pun akan ditampilkan dengan tinggi maksimal 50px - Seo v6.
Begini cara membuat judul blog bergambar logo pada blogger
Pertama tama masuk ke menu tata letak pada dasbord blogger lalu pilih widget tajuk (header)
Masukkan logo png kamu pada choose file lalu pilih setelan selain judul dan keterangan lalu simpan, pada proses ini kamu sudah berhasil memasukkan logo pada header, namun pada template terbaru blogger kali ini masih menggunkan lebar masimal.
Baca: Cara mengganti background template
Untuk membuat logo memiliki size yang baik maka masukkan code dibawah ini pada css template pada menu tema > edit html. Lalu masukkan code CSS dibawah ini tepat diatas ]]></b:skin>
Untuk template Contempo
.centered-top-container img, .centered-top-placeholder img {
margin: auto;
height: 50px;
display: block;
}
@media screen and (max-width: 800px){
body.item-view .widget.Header, body.item-view #header {
margin: auto;
}}
.widget.Header img {
height: 50px;}
Untuk template Soho dan Emporio
.centered-top-container img, .centered-top-placeholder img {
height: 50px;
}
Setelah di copy paste code diatas lalu simpan. Selesai.
Jika dirasa logo pada header terlalu kecil atau terlalu besar, code 50 px pada CSS diatas bisa kamu sesuaikan sendiri, jika mau logo agak besaran maka masukkan nilai lebih dari 50px jika mau kecil maka kebalikkannya.
Jika ada pertanyaan atau eror bisa langsung komen saja, semoga berhasil - Seo v6
Comments
Post a Comment