Cara Mengatur Lebar Template Blogspot Dengan Edit HTML | Googelio - Blog yang rapi tampilan dan desainnya tentu memberikan kenyamanan bagi visitor. Lebar blog adalah salah satu hal yang perlu diperhatikan agar desain blog terlihat menarik. Kali ini kami akan mengulas bagaimana mengedit template blogger pada bagian lebar halaman dengan cara edit CSS/HTML.
Manfaat Mengatur Lebar Halaman Blog
Tampilan blog yang menarik merupakan daya tarik tersendiri bagi para pengunjung blog agar betah berlama-lama di sebuah web. Lebar template blog merupakan salah satu aspek yang perlu dipertimbangkan para blogger pemula, agar bisa menyesuaikannya dengan web browser di perangkat.
Hal ini sangat beralasan, karena web browser punya coding tertentu yang akan menampilkan konten sebuah web atau blog, termasuk lebar halaman. Banyak sekali manfaat yang diperoleh bila mengelola lebar halaman template blog dengan baik, yaitu :
- Memberikan Kesan Kerapian
- Meningkatkan Visitor
- Kesesuaian Dengan Platform Gadget (Responsive)
- Memberikan Ruang Untuk Widget Maupun Iklan
- Bisa Menjadikan Blog Sebagai Media Yang Menguntungkan Secara Bisnis
Tampilan blog yang rapi menjadi salah satu faktor ketertarikan visitor agar mau mengunjungi blog kita. Kalau tampilannya sudah awut-awutan, orang malas berkunjung ke website tersebut.
Tidak ada aturan khusus yang menyatakan lebar blog dan tampilan blog berpengaruh terhadap visitor, tapi berdasarkan pengalaman orang lebih suka mengunjungi situs yang rapi, teratur dan enak dilihat serta template memenuhi kaidah SEO. Hal ini sejalan dengan poin 1 di atas. Baca juga : Contoh SEO Onpage Blog
Website atau blog sekarang sudah bisa diakses di smartphone. Oleh karena itu, sangat penting untuk mengatur lebar blog agar tampilannya sesuai dengan web browser di komputer/laptop (versi desktop) maupun versi mobile.
Blog merupakan salah satu jenis web yang bisa dimonetisasi, misalnya sebagai media penayangan iklan dari Google atau biasa juga disebut Google Ads Publisher. Dengan mengedit lebar halaman blog, sobat bisa memasang kode iklan Google Ads dan tampilan iklan yang muncul terkesan rapi.
Blog yang punya tampilan rapi, dengan lebar halaman yang responsive di berbagai platform gadget berpotensi menarik minat para publisher, atau marketing perusahaan tertentu untuk menjadikan blog sobat sebagai media rekanan. Menjadi rekanan dari perusahaan memberikan banyak keuntungan, salah satunya keuntungan finansial dimana blog sobat akan diberikan honor tertentu untuk mempublish konten milih perusahaan, atau menayangkan iklan mereka.
Nah, sampai di sini sobat sudah tahu mengapa mengedit lebar blog di blogspot untuk versi desktop maupun versi mobile itu penting.
Lalu bagaimana caranya mengedit lebar blog ?
Cara Mengatur Lebar Template Blogspot Dengan Edit Kode CSS/HTML
Blogspot.com atau sering juga disebut blogger.com adalah sebuah media website gratisan yang dipunyai oleh Google. Meningkatnya kebutuhan akan aneka informasi yang bisa diakses lewat website, menginisiasi Google untuk menyediakan platform web gratis yang bisa digunakan untuk berbagai kebutuhan. Dan salah satu yang menarik, yaitu dengan menyediakan fitur monetisasi blog sehingga weblog bisa menjadi media penayang iklan dari para advertiser.
Tapi setiap blogger punya selera masing-masing tentang tampilan blognya. Ada yang ingin punya blog dengan tampilan lebar yang maksimal, ada juga yang ingin lebar tampilan blognya minimalis. Secara umum, beberapa blog gratisan seperti blogspot.com atau blogger.com punya settingan masing-masing, misalnya 720 pixel, atau 960px, atau lebih lebar lagi, 1080px misalnya. Dengan settingan otomatis di dashboard blogger.com, sobat bisa mengatur lebar blog tersebut sesuai keinginan sobat.
Sobat harus sudah punya akun email di Gmail, sehingga bisa mendaftar blogspot.com. Kalau sobat punya akun lain sudah barang tentu tidak bisa mengakses blogger.com. Kalau belum punya, sobat mesti buat dulu akunnya. Sobat bisa mengikuti panduannya dari awal sampai selesai.
Baca Juga : Cara Membuat Akun Gmail Baru
Karena kita sedang mengulas trik mudah mengatur lebar blog di blogspot.com atau blogger.com, maka sobat tentunya sudah punya blog sendiri di blogspot/blogger. Bagaimana memulai cara edit HTML lebar halaman blog di blogspot kalau sobat sendiri belum punya blog, ya toh ?
Langkah 1 : Masuk Dashboard Blogspot Sebelum Mengedit
Masuk Ke Dashboard Blogger Dengan Sign Ini Terlebih Dahulu. Kalau sobat sudah punya email Gmail dan sudah punya blogspot sendiri, sobat cukup "Sign In" agar bisa masuk ke tampilan dashboard blogspot. Langkah-langkahnya seperti ini :
- "Sign in" terlebih dahulu di blogger.com agar bisa masuk ke dashboard blog.
- Setelah sign in masuk ke opsi "Design" pada bilah kiri dashboard blogger
- Kemudian pilih "Template", lalu klik edit HTML.
- Setelah masuk dalam editor template yang berisi kode-kode permograman HTML, CSS, javascript dan jQuery, terlebih dahulu centang tanda expand template widget.
- Lakukan Back Up Template terlebih dahulu, agar sewaktu-waktu terjadi error anda bisa kembali ke template semula.
Setelah melakukan back up, maka cara edit HTML lebar blog di blogger sudah bisa dimulai.
Langkah 2 : Edit Kode CSS/HTML Blog
Selanjutnya pada editor template, cari kode yang akan di lebarkan, yaitu : #Outer-Wrapper. Bila anda mengedit blog di browser Mozilla tekan Shift+F3 agar lebih mudah dalam pencarian. Hasilnya tampak seperti ini.
#outer-wrapper {background:#000;width:960px;margin:0 auto;padding:0;text-align:left;border:2px solid #1A1A1A;}
Keterangan :
#outer-wrapper : kode lebar halaman total
width : besarnya satuan lebar halaman
margin : jarak antar sisi
padding: celah antar sisi
text-align: arah awal text/tulisan
border:garis sisi
Lihat tulisan yang dicetak miring di atas, ada kode width:960px. Kode inilah yang mempengaruhi lebar #outer-wrapper.
Ganti angka tersebut sesuai keinginan anda, apakah ingin diperlebar atau diperkecil/dipersempit. Tidak semua orang memiliki selera yang sama terhadap tampilan blog khususnya lebar halaman template.
Bila ingin tampilan mobilenya responsive sesuai dengan lebar gadget, ganti 960px dengan 100%, sehingga hasilnya menjadi width:100%.
Pastikan dulu apakah lebarnya sudah sesuai keinginan. Anda bisa melihat tampilan blog anda dengan lebar yang diperbarui dengan klik Pratinjau./
Bila lebar halaman blog sudah sesuai dengan selera sobat, silakan simpan template melalui opsi save template.
Baca Juga: Cara Membuat Blog Yang Menghasilkan Uang di Blogspot
Nah, bagaimana, mudah kan menerapkan cara mengatur lebar halaman di blogspot ? Saran Googelio, sobat bisa banyak bertanya di group-group blogger di media sosial, supaya lebih cepat mahir mengedit kode HTML.