Pemblokir Iklan Terdeteksi

Matikan adBlock anda untuk dapat mengakses situs ini.

translate to english
LOADING...
Website Masih Dalam Proses Pengembangan. Download Template Jika Anda Berminat.
Download

Modifikasi template blog dengan "Teknik Background"

4 min read
Membuat tampilan blog menarik membutuhkan teknik CSS yang rumit, Saya menemukan cara baru membuat tampilan blog menarik  tanpa perlu pengaturan CSS yang rumit. Teknik ini bagus untuk anda yang tidak mengerti code CSS. Teknik ini saya beri nama teknik background.

Teknik background sesuai namanya teknik ini menjadikan background sebagai tampilan utama blog. Agar teknik ini berhasil anda harus punya sedikit pengetahuan corel, photoshop atau program desain gambar lainnya. Teknik ini saya gunakan pada template blog ini.


 *catatan teknik ini berlaku untuk "simple template bawaan blogger"


simple template
Tutorial kali ini kita akan mengubah tampilan header blog. Dengan teknik background anda hanya perlu menyiapkan background seperti dibawah ini



background ini sudah disesuikan dengan margin simple template. Sehingga jika digabungkan maka hasilnya akan seperti di bawah ini.


Tampilan nya akan jauh lebih bagus jika anda punya kemampuan desain grafis. Anda hanya perlu menyesuikan magin-magin pada template aslinya. Ukuran background di atas dapat anda jadikan acuan untuk membuat bakgground lainnya.

Cara menambahkan background pada template blog
cari kode css berikut :


.body-fauxcolumn-outer .cap-top {
  position: absolute;
  z-index: 1;
  height: 400px;
  width: 100%;
  background: $(body.background);
  $(body.background.override)  background:  url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZEMNJhAdUMqRCVYkK9qngAvFgIghpV8Ea3p2u0w5ihPJ6IzgHkpncaMbmJafevaYqesSQiulnWyoOObDvrAqL6MtYMzj-PUSygpoVUrpoXJgRiSM-QyfMcyMnaW8u_qfGiOyci5Cum40/s0/wrapper.jpg") no-repeat  center 0px;
}


keterangan: kode warna hitam adalah kode pada template anda
                  kode merah dan biru adalah kode yang anda tambahkan
                  kode biru adalah url gambar backgrund anda

Jika sudah semua save template anda.

Langkah selanjutnya anda masuk ke template > pilih sesuaikan


selanjutnya akan muncul seperti di bawah ini

klik untuk memperbesar

pilih tingkat lanjut (advance) > latar > layar utama> pilih transparan dan Terapakan pada blog

selesai selamat mencoba

Anda juga dapat mengubah warna-warna background lainnya lihat  Cara mengubah warna background pada template blogger.
Help!
Baca juga :
Semangat berkarya mekipun hasil copy paste!

Blogger : Cerdasin62+

Mau donasi keh?

Paypal
Dana - 0887435373103
Jika dana kalian terlalu banyak bisa beri admin sedikit banyak dana sesuka hati. klik icon panah di atas

You may like these posts

  • Apakah itu Author Rank, Author Rank adalah suatu gagasan google untuk memberikan peringkat pada hasil pencarian google. Namun hingga di kenalkannya google+ tidak ada platform yang …
  • 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 te…
  • Membuat tampilan blog menarik membutuhkan teknik CSS yang rumit, Saya menemukan cara baru membuat tampilan blog menarik  tanpa perlu pengaturan CSS yang rumit. Teknik ini bagu…
  • Percaya ga percaya dalam waktu kurang dari tiga bulan pagerank blog ini sudah mendapat ranking dua. Pada awal membuat blog ini memang saya maksudkan sebagai ujicoba teknik-teknik d…
Apakah artikel ini bermanfaat? Silahkan klik bintang di bawah.
Jangan lupa beri komentar.
Komentar.

Post a Comment

Tinggalkan komentar sesuai topik tulisan, centang Notify me untuk mendapatkan notifikasi via email ketika komentar kamu di balas.
Masukkan URL Gambar atau Potongan Kode, atau Quote, lalu klik tombol yang kamu inginkan untuk di-parse. Salin hasil parse lalu paste ke kolom komentar.


image quote pre code
CaraTech.

Mampir Juga Ke Blogger caratech.my.id