CARA MUDAH MENAMBAHKAN FOOTER KE TEMPLATE CONTEMPO

Kekurangan Contempo hampir setiap penggunanya setuju: Tidak memiliki footer atau ciri ciri footer yang dapat dimanfaatkan sebagai tempat untuk menempatkan widget atau Navigasi tambahan web blogger pada bagian paling bawah halamannya.

Tetapi kita akan merobahnya menjadi lebih keren: Membuat sebuah footer yang "fixed" alias tetap akan terlihat beberapa saat pada saat halaman atau konten blog di scroll ke atas dan kebawah.
Dan bagaimanapun saya telah mencari cara yang paling tepat menambahkan footer ke template contempo. Saya mengunjungi Google Help Discussion, tidak ada jawaban expert. 

Akhirnya saya mencari triknya dengan cara mengutak atik CSS melalui tempat belajar pavorite saya yakni W3School ternyata sangat sederhana dan hasilnya terbilang cukup gemilang.
Bagaimanapun pada dasarnya Contempo dan template klasik biasa itu sama saja. Baiklah jika sobat pengguna template contempo sobat bisa menggunakan trik ini, cara ini ini memiliki kelebihan lain yakni footer dimana atribusi dan hal lain dapat dipasang merupakan footer yang "fixed" walaupun tidak sticky, namun dia tetap bisa tampil walaupun konten di scroll keatas, footer ini tetap berada dibawah postingan.

LANGKAH PERTAMA:

Sobat masuk ke pengaturan blogger>>pilih "Tema">>Pilih edit HTML. Lalu cari kode </head> dan letakan kode yang telah saya edit dibawah ini tepat diatasnya:

<style>
.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: rgb(239, 255, 255);
color: white;
text-align: center;
}
</style>


Keterangan: Kode warna yang saya sorot warna merah bisa sobat ganti untuk merobah warna latar atau background footer: Cobalah hapus: rgb(239, 255, 255) dan ganti dengan tulisan black saja jadinya sebagai berikut:

background-color: black;

Maka footer contempo sobat sudah jadi hitam, sobat juga bisa menuliskan perintah warna background atau warna latar lain, misal blue, yellow dst.

Lalu Save template Contempo sobat. Sekarang masuk kepengaturan tetapi kali ini pilih "tataletak" lalu pilih tambahkan "gagdet" dan pilih widget atau gagdet "Atribusi"

Tulis atribusi atau hak cipta sobat pada kolom yang tersedia lalu geser atau drag gagdet menggunakan mouse kebawah lay out atau pengaturan blogger dan save template.

Sobat juga bisa meletakan berapa "stuff" widget atau gagdet lagi dibagian bawah footer atau dibagian bawah atribusi tersebut.

MEROBAH FOOTER JADI RELATIVE

sayangnya dengan trik ini saya dalam beberapa waktu tidak bisa menerapkan hasil temuan saya diatas ke dalam tema contempo hybrid karena perbedaan strukturnya akan menjadikan kolom komentar menjadi fixed atau sticky, Jadi memperbaiki hal ini dalam waktu yang terpisah.

Perhatikan kembali kode:

<style>
.footer {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color: rgb(239, 255, 255);
color: white;
text-align: center;
}
</style>

Saya memindahkan posisinya dari tag </head> ke atas </body> dan mengganti position: fixed; menjadi position: relative; Perhatikan aba aba CSS yang saya sorot merah:

<style>
.footer {
position: relative;
left: 0;
bottom: 0;
width: 100%;
background-color: rgb(239, 255, 255);
color: white;
text-align: center;
}
</style>

Hasilnya sedang dipakai pada blog editblogtema ini. 

Artikel ini milik editblogtema.net

4 Komentar

Silahkan berkomentar sesuai dengan topik kita ya...

  1. wah lumayan cerdik nih Mas Admin, selama ini saya kurang lihay soal otak otik tema blog Mas....apa lagi nambahain fitur di fotter di TEMPLATE CONTEMPO

    BalasHapus
    Balasan
    1. Ya karena bingung akhirnya coba coba meramu kodenya melalui w3school

      Hapus
  2. kalau footer kayak blog ini gimana mas?

    BalasHapus
    Balasan
    1. sudah saya posting juga pada blog ini:

      https://www.editblogtema.net/2019/07/cara-membuat-footer-stylist-untuk.html?showComment=1566831608589#c9089112093944092179

      Hapus
Lebih baru Lebih lama

Formulir Kontak