Informasi Teknologi Membongkar Template Blogger teknomediatama.blogspot.com - Hallo sahabat Info Teknologi Terbaru, Pada Artikel yang anda baca kali ini dengan judul Informasi Teknologi Membongkar Template Blogger teknomediatama.blogspot.com , kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel Blog, Artikel Tutorial Blog, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Informasi Teknologi Membongkar Template Blogger teknomediatama.blogspot.com
link : Informasi Teknologi Membongkar Template Blogger teknomediatama.blogspot.com

Informasi Teknologi Membongkar Template Blogger teknomediatama.blogspot.com

Pada tutorial kali ini saya akan batasi pada customize CSS background-background pada template bawaan blogger khususnya simple template. bisa dilihat pada gambar di bawah:

simple template

Sebenarnya pada simple template ini terbagi menjadi beberapa background, tapi karena semuanya dominan putih sehingga kita tidak bisa membedakan bagian-bagian tersebut. Sekarang coba lihat template berikut ini :

klik untuk memperbesar

Template ini sudah dimodifikasi dari simple template. Sekarang jelas bahwa background-background tersebut terpisah satu sama yang lain. Pada contoh gambar terdapat 4 bagian background tapi
sebenarnya ada 5 karena satunya saya buat transparan ( nanti akan saya tunjukkan ).

Perhatikan background no.1 untuk mengganti warna bagkground ini yang perlu Anda lakukan adalah masuk ke Edit HTML blog kemudian cari kode CSS :




.main-inner {
  padding-top: $(main.padding.top);
  padding-bottom: $(main.padding.bottom);
  background-color:#dfeaed;
  margin-top:5px;
}

Pada background-color ganti kode warna #dfeaed. Perlu saya jelaska kepada pembaca yang belum tahu kode #dfeaed merupakan kode warna pada web. Untuk mencari kode warna web yang lain Anda dapat mencarinya dengan mengunjungi tabel warna web atau lihat di situs: colorhexa.com.

Selanjutnya untuk mengganti background no.2 cari kode CSS:


.main {
  background-color:#ffffff;
  padding:10px;
}

Sama dengan cara pertama ganti pada background-color ganti kode warna #ffffff

Background no.3 CSS :


.fauxcolumn-right-outer .fauxcolumn-inner {
  border-left: 1px solid $(body.rule.color);
  background-color:#ffffff;
  width:300px;
}

Background no.4 CSS :


.post {
  margin: 0 0 $(post.margin.bottom) 0;border:0px #ddd solid;padding:10px;
  background-color:#e1f4f7;

}

Catatan :
- kemungkinan berbeda untuk template yang lain
- keuntungan menggunakan template bawaan adalah blog terbebas dari script-script tak dikenal
- blog menjadi lebih ringan dan cepat sehingga orang nyaman membuka tiap halaman

Untuk mengetahui kecepatan halaman saat dibuka. PageSpeed Insights dari google bisa membantu
kunjungi : https://developers.google.com/speed/pagespeed/insights

screenshot:

Tips!: klik untuk memeperbesar

Copy paste halaman web/blog Anda lalu ANALYZE
nanti akan muncul seperti ini :

Tips!: klik untuk memperbesar

Pada contoh ini PageSpeed Insights adalah 88. 
Keterangan: semakin besar skornya maka  halaman web/blog semakin cepat dibuka.

Demikian Artikel Informasi Teknologi Membongkar Template Blogger teknomediatama.blogspot.com

kami buat

dan sekian artikel Informasi Teknologi Membongkar Template Blogger teknomediatama.blogspot.com kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Informasi Teknologi Membongkar Template Blogger teknomediatama.blogspot.com dengan alamat link Informasi Teknologi Membongkar Template Blogger teknomediatama.blogspot.com