Friday, 11 October 2013

Cara Membuat Background di Halaman Posting

Cara membuat atau memasukan gambar yang akan dijadikan background dihalaman posting blog, background bisa kita gunakan dengan gambar yang berbeda, disetiap posting. Sebelumnya saya sudah membuat artikel tentang cara membuat background berbeda dihalaman berbeda, yaitu dengan cara memasukan background berdasarkan URL halaman.

Dan kali ini background di halaman posting, langsung dari artikelnya. Jadi kita memasukan gambar ke artikel untuk dijadikan background. Untuk lebih jelasnya silakan lihat background gambar dibagian akhir artikel ini. Atau lihat halaman profil dan halaman Contact di blog ini.

Langsung saja, cara membuat background disetiap postingan blog, ikuti langkah-langkah dibawah ini.
  1. Login ke blogger, lalu buatlah entri baru. Atau edit artikel yang lama.
  2. Selanjutnya copy kode dibawah ini.
  3. <div dir="ltr" style="text-align: left;" trbidi="on">
    <div style="background: url(&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS3KJm1ccx9m5ZG-UASRie8oIpi2ZXnhYbetBAcd5L-dnePb55duLWKKy3b3CeEm6_3wC4Ww94KYGUjzDnJN1rr4Y4xcg12AkV1frheFq3OGw0MDOyeoBOZvrj1gNhnJEut3n_gNJXvC19/s1600/Fandra+Juani+copy.png&quot;) no-repeat right bottom;">
  4. Dan pastekan di awal tulisan blog, pada bagian HTML. Contoh Gambar.
  5. background dihalaman posting blog
  6. Setelah itu masukan kode </div> diakhirtulisan blog, masih pada bagian HTML.
  7. Selanjutnya, pratinjau gambar, untuk memastikan apakah background sudah ada atau belum.
  8. Jika sudah baru publikasikan(untuk artikel baru), atau Perbarui(untuk artikel lama). Selesai.
Keterangan Kode langkah 2:
  •  https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgS3KJm1ccx9m5ZG-UASRie8oIpi2ZXnhYbetBAcd5L-dnePb55duLWKKy3b3CeEm6_3wC4Ww94KYGUjzDnJN1rr4Y4xcg12AkV1frheFq3OGw0MDOyeoBOZvrj1gNhnJEut3n_gNJXvC19/s1600/Fandra+Juani+copy.png ini url gambar yang akan dijadikan background. Silakan diganti dengan URL gambar kalian sendiri.
  •  no-repeat berfungsi agar background gambar tidak berulang. untuk mengubah background gambar berulang, ganti menjadi repeat-x;
  • right bottom ini posisi background, bisa diganti dengan.
  • left top
    left center
    left bottom
    center top
    center center
    center bottom
    right top
    right center
    right bottom
Jika belum tau cara membuat dan mengambil URL gambar sendiri, kamu bisa baca di cara cara upload dan ambil url gambar. Disitu ada cara upload dan ambil url sendiri dengan mudah. Background pada artikel ini saya letakan dibagian paling bawah, yaitu dibagian center bottom. Karena warna background nya terang, jadi tulisannya tidak terlihat.
Kalian bisa gunakan background dengan warna yang gelap, agar tulisan artikel bisa terlihat.

contoh background dengan gambar.  Tulisan ini sengaja saya blog, karenga tidak terlihat.         Semoga Bermanfaat.

No comments:

Post a Comment