Cara Menambah/Mengganti Background Pada Blogspot

Diposting oleh MaulanaSide on Rabu, 07 Desember 2011

Beberapa hari ini banyak komentar dari sobat yang nongol di Maulana-Site tentang bagaimana cara mengganti warna backroundmenambah gambar background blog? Tips mudah belajar edit html blogspot, Belajar Kode CSS, bahkan ada yang pengen membuat template blog sendiri. Semua request sobat pasti akan Maulana-Site jawab asal follow Toko Blog dulu zaw he… :P Kali ini saya coba jawab pertanyaan pertama tentang cara merubah warna background blog dan disambung cara menambah gambar latar belakang di blogspot tentunya.


untuk Langkah mudah belajar edit html sobat bisa mulai aja dengan coba-coba edit template blog sobat sendiri dengan menambah pernak-pernik blog dari tutorial blog yang ada. Maka lama-lama sobat akan memahami maksud kode CSS ataupun html blogspot dan mungkin juga sobat bisa memahami maksud kode lain seperti Php, java script , wordpress, jomla dll. Untuk cara ganti warna Background template blogspot silahkan lihat tutorial di bawah ini ;

1. Sobat Login dulu ke halaman blog di blogger.com

2. Pilih menu Layout → Edit Html
3. Centang dulu kolom Expand Template yaw.
4. Cari Kode body (klik CTRL+F untuk pencarian cepat)

Disini saya contohkan kode css di template blogspot saya lain lihat sebentar zaw [Kunci Kord Guitar]
Terlihat warna backGroundnya hitam, bagaimana mengganti warna latar belakang menjadi putih contohnya lihat kode dibawah ini yang juga ada di template sobat ;

body{
background:#0000;
width:960px;
color:#000000;
font-size:11px;
font-family:Verdana,Arial,Helvetica,sans-serif;
margin:0px auto 0px;
padding:0px}


Sobat perhatikan kata tebal background:#0000; yang maksud kode Css tersebut ialah kata sintak background mengartikan background/latar belakang template anda. Titik dua (:) berarti sama dengan (=). Dan yang terpenting ialah kode Merah #0000 ini adalah kode warna yang akan sobat rubah sesuai keinginan tentunya. Kode #0000 ialah menunjukkan code warna hitam seperti template Blog Chord Choosy tadi. Untuk mengetahui kode warna silahkan lihat kode warna html. Sedang kode titik koma (;) adalah sebagai perintah kode penutup, jangan sampai salah edit zaw sob.

Saya contohkan sobat ingin mengganti warna background hitam dengan color putih dengan kode (#ffff), maka code Css blog sobat berubah seperti dibawah ini;

body{
background:#ffff;
width:960px;
color:#000000;
font-size:11px;
font-family:Verdana,Arial,Helvetica,sans-serif;
margin:0px auto 0px;
padding:0px}

Terakhir pilih pratinjau dulu untuk melihat perubahan template sobat. Jika telah yakin dengan keinginannya bisa langsung disave aja. Dan lihat hasil perubahan template blogspot yang sobat miliki, saya jamin berubah kalau gak terjadi kesalahan edit Cssnya tentunya.:)

Oke tutorial kali ini Maulana-Site harapkan sobat blogger bukan hanya bisa mengganti warna tampilan background template, tetapi memahami struktur dasar Css tentunya. Yang perlu sobat perhatikan kode Css ini adalah kode perintah yang tersusun body{}. Kode { sebagai pembuka dan } sebagai penutup. Jadi diantara/didalam kode { dan } kode perintah/sintak juga seperti kode background diatas. Jadi seandainya sobat menemukan template html seperti ini ;

body{ background:#ffff; width:960px; color:#000000; font-size:11px; font-family:Verdana,Arial,Helvetica,sans-serif; margin:0px auto 0px; padding:0px}

Mungkin kalau yang baru pertama edit /coba edit html blogspotnya akan bingung, kok kodenya gak sama seperti yang di contohkan di tutorial Toko Blog ya?:) Gak usah bingung zaw sob, kan ada obat sakit gigi :P…??? Kode diatas tuh sama Cuma dibuat tanpa spasi (supaya loading blog lebih cepat), lihat yang detail tuh dan bandingkan yang kode paling atas tadi. Strukturnya tidak berbeda kan, ada kata utama width (panjang body) terus titik dua (:) terus ada angka 960px (menunjukkan ukurannya 960 pixel) dan tentunya ditutup dengan titik koma (;). Tuh ngerti kan dan selanjutnya sobat gak akan bingung lagi jika mengedit kode cSS karena dah Maulana-Site obatin he :-D...

Gak terasa udah jawab request edit warna background dan kasih dikit tips mudah belajar html blogspot tuh sob.. :-) Tips ringan dari Maulana-Site ialah coba sobat belajar desain sendiri pasti lama-lama ngerti maksud kode html yang pertama kita anggap rumit. oh iya jadi lupa kasih tips ganti gambar backgroundnya nih. Sayangnya tulisan toko blog dah penuh nih jadi saya lanjutin di tutorial blog selanjutnya zaw... :-P sabar-sabar biar pantatnya lebar... xixixi. Sekian tutorial cara ganti warna background/latar belakang template blogspot.

Posting Komentar