Friday, May 2, 2025

Membuat Tambahan Footer di Blogger



📘Sekilas Tentang Footer di Blogger

Footer adalah bagian paling bawah dari tampilan blog di Blogger. Biasanya muncul di setiap halaman blog, setelah isi artikel dan sidebar. Footer bisa terdiri dari satu atau beberapa kolom, tergantung template yang digunakan.


Fungsi dan Manfaat Footer di Blogger

1. Menampilkan Informasi Tambahan

Footer digunakan untuk menampilkan elemen penting seperti:
  • Hak cipta (copyright)
  • Nama pemilik atau desainer
  • Tahun aktif blog
  • Disclaimer atau kebijakan privasi
2. Navigasi Tambahan

Footer bisa diisi dengan:

  • Menu navigasi sekunder (Tentang, Kontak, Sitemap)
  • Link ke kategori atau arsip penting
  • Widget label atau daftar artikel populer

3. Media Sosial & Widget Tambahan

Biasanya footer juga digunakan untuk:

  • Ikon media sosial
  • Newsletter atau form berlangganan
  • Widget jam, statistik, atau badge verifikasi
4. Membantu SEO dan Struktur Situs
Link internal di footer membantu mesin pencari memahami struktur blog, terutama untuk halaman statis seperti “Kebijakan Privasi” atau “Disclaimer”.

🧱 Contoh Isi Footer yang Umum:

  • © 2025 Nama Blog. All rights reserved.

  • Template by [Nama Template] – Powered by Blogger

  • Link: Tentang | Kontak | Disclaimer | Privacy Policy


📘Langkah Kerjanya

1. Buka google chrome
2. Ketik alamat : https://blogger.com
3. Silahkan anda login dengan email gmail
4. Akan tampil menu blogger


5. Klik menu Tata Letak


6. Klik menu Tambahkan Gadget


7. Klik menu HTML/Javascript
8. Copykan script footer dibawah ini kedalam HTML/Javascript

    Ket : ini scriptnya

<style>
  .site-footer {
    background-color: #222;
    color: #ddd;
    padding: 20px 0;
    font-size: 14px;
    text-align: center;
  }

  .site-footer .footer-links {
    display: inline-block;
  }

  .site-footer a {
    color: #ddd;
    text-decoration: none;
    margin: 0 10px;
    transition: color 0.3s;
  }

  .site-footer a:hover {
    color: #00bcd4;
  }

  @media screen and (max-width: 600px) {
    .site-footer .footer-links {
      display: block;
    }

    .site-footer a {
      display: block;
      margin: 8px 0;
    }
  }
</style>

<footer class="site-footer">
  <div class="footer-links">
    <a href="diganti link yang mengarah ke disclaimer">Disclaimer</a>
    |
    <a href="diganti link yang mengarah ke Privacy Police">Privacy Policy</a>
    |
    <a href="diganti link yang mengarah ke Terms & Conditions">Terms & Conditions</a>
    |
    <a href="diganti link yang mengarah ke About">About</a>
    |
    <a href="diganti link yang mengarah ke Contact">Contact</a>
  </div>
</footer>

    Hasilnya seperti dibawah ini 




Ket : Yang berwarna merah anda isi dengan link yang mengarah ke tujuan.

Lihat hasil akhir dibawah ini 


Demikian cara membuat tambahan footer, semoga bermanfaat, terima kasih

Jika ada yang ditanyakan silahkan isi komentar atau contact

Salam Hangat
Jaenudin Kreatif

No comments:

Post a Comment

Berikan pesan yang bijak dan santun

POPULAR POST

Disclaimer