28 Cara Membuat Background Pada Titel Footer

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ الرَّحِيم

Melengkapi postingan sebelumnya. Berikut langkah langkah membuat background pada titel atau judul footer seperti pada contoh gambar berikut atau lihat

disini dan disini 

membuat background titel footer  

membuat background titel footer

Membuat background pada titel atau judul footer

  • Log in ke blogger=> pada dasbor=> klik tata letak=> edit HTML=> cari kode berikut:

#bottom h2 {
padding:7px 0 2px 0;
margin:0 0 10px 0;
border-bottom:1px dotted #cccccc;
font-size:12px;
font-weight:bold;
color:#0000FF;
text-align:center;
line-height:1.4em;
text-transform:uppercase;
}

  • kalau sudah dapat sisipkan kode berikut

background: url(alamat image anda)repeat-x;

  • Sehingga keselurahannya menjadi seperti ini:

#bottom h2 {
padding:7px 0 2px 0;
margin:0 0 10px 0;
border-bottom:1px dotted #cccccc;
font-size:12px;
font-weight:bold;
color:#0000FF;
text-align:center;
line-height:1.4em;
text-transform:uppercase;
background:url(alamat image anda)repeat-x;
}

  • Terakhir klik save/ simpan.

Nah benar mudah bukan? Kalau hanya ingin mengganti background judul footer dengan warna cukup sisipkan kode warna pada background seperti contoh berikut:

background: #5FB404;

Untuk melihat macam macam kode warna klik disini


ٱلْحَمْدُ لِلَّهِ رَبِّ ٱلْعَٰلَمِين

Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Tips Trik Blogging

28 komentar :

  1. mengamankan pertamax...... aman wes.... blog q belum tak pasang yang d bawah

    BalasHapus
  2. pertamax aman.... blog q masih elum ada sob

    BalasHapus
  3. kalau mau pasang atau tambah elmen halaman diatas footer lihat disini

    BalasHapus
  4. ada kue d rumah q kalau mau d ambil yach....

    BalasHapus
  5. wah terlambat lagi nich, soalnya baru bangun pagi nich, hehehee :D

    BalasHapus
  6. meski dicoba nih, terima kasih ya udah bagi2 ilmu

    BalasHapus
  7. @ rumah blogger dan sabirin net: terimaksh apresiasinya!

    BalasHapus
  8. mantab nih... makasih kag ilmunya...


    Dukung dengan Vote ina DISINI yah.
    Dukungan kalian sangat berarti buat ina... thanks before :)

    BalasHapus
  9. sama2, iya anaa sgra dtg de'...

    BalasHapus
  10. mampir cari tutorial...
    salam kenal sobat.

    BalasHapus
  11. semoga ada postingan yg dicari dan bisa membantu!

    BalasHapus
  12. Makasih banyak sobat... saya sudah berhasil membuat Scrool pada kotak komentar setelah membaca artikel anda.

    Moga sukses selalu.
    Izin follow...

    BalasHapus
  13. Alhamdulillah, terimakasih apresiasinya!

    BalasHapus
  14. Keren. Thanks infonya sob.

    BalasHapus
  15. hmmm...kalo' untuk di wordpress bisa gak ya...

    BalasHapus
  16. u/wordpress maaf anaa blm tau caranya. u/smua trimksh komentarx!

    BalasHapus
  17. hadir d sini bagikan award jika sahabat berkenan

    disini

    BalasHapus
  18. thanks artikelnya...
    langsung ane praktekin..

    BalasHapus
  19. expand widgetnya di centang atau tidak. . . ?

    BalasHapus
  20. masih sharenya...aku lagi cari cara member warna pada area kolom yang ada di footer berwarna abu-abu...kalo ada tolong saya

    BalasHapus
  21. Masya Allah, terima kasih infonya bermanfaat,

    BalasHapus
  22. terimakasih sharingnya gan

    BalasHapus
  23. wah.. artikel yang bermanfaat :D
    Disini templatenya bagus & Artikelnya juga Berkualitas :D
    kalau diberi umur panjang aku akan datang lagi kesini :)



    #Semoga Rezekinya Lancar :D

    BalasHapus
  24. Terimakasih banyak atas tips dan triknya
    -------
    anfilem.blogspot.com

    BalasHapus

Catatan:
Untuk menyisipkan kode, gunakan tag <i rel="pre">KODE ANDA DI SINI...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR ANDA DI SINI...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">CATATAN ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Khusus untuk membalas komentar disarankan menggunakan tombol balas di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur. Karena mungkin, apa yang Anda tanyakan/katakan saat ini akan sangat bermanfaat bagi pembaca lain.

NB:Sebelum menyisipkan kode silahkan gunakan tool konversi kode terlebih dahulu untuk menampilkan kode tersebut pada kolom komentar
Konversi Kode di Sini!