Cara Membuat Footnote Catatan Kaki Blogger dengan CSS

Mungkin anda sering membaca buku, laporan penelitian dan sebagainya, nah..! dari yang anda baca pasti tidak terlepas dari footnote / catatan kaki, yaitu adanya angka / huruf kecil pada akhir kalimat tertentu, dimana angka / huruf kecil tersebut menunjukkan suatu keterangan.

Dan bagi anda yang dekat dengan MS. Word dan sering membuat Catatan kaki atau footnote di Microsoft Word, itu adalah langkah mudah dalam pembuatannya, tapi bagaimana jika anda sedang menulis artikel di blogger?, berikut sedikit penjelasan tentang bagimana membuat footnote pada blogspot:

Caranya tidak begitu sulit cuman kita harus agak sedikit memahami langkah-langkah berikut. Akan tetapi saya yakin anda sanggup dan bisa untuk melakukannya, Yang harus anda lakukan adalah:

1. Login ke akun Blogger.
2. Kemudian klik menu Tata Letak > Edit HTML.
3. Backup dulu template anda dengan mendownload template lengkap buat jaga-jaga jika terjadi kesalahan.
4. Centang Expand Template Widget.
5. Cari kode ]]></b:skin>.
6. Copy paste kode berikut tepat di atas kode ]]></b:skin> tadi.
   

   /* Footnote CSS Code */
     .footnote{
     border-top:1px dashed #333;
     padding:0 0 10px 0;
     margin:10px 0 0 0;
     font-size:smaller;
     }

7. Kemudian Simpan Template.
8. Klik tab Posting dan pilihlah Buat Entri Baru.
9. Pilih penulisan Edit HTML
10. Perhatikan kode berikut:

    <sup><a href="#1">[1]</a></sup>
    <sup><a href="#2">[2]</a></sup>
    <sup><a href="#3">[3]</a></sup>

    Tiga Kode diatas merupakan kode yang akan kita pasang pada tiga akhir kata / kalimat yang akan kita terangkan sebagai footnote.

    Misalnya kita punya tiga kata / kalimat yang ingin dijadikan footnote, contoh:

    Muhammad utusan Alloh

    Kakeknya memanggilnya Ahmad

    Julukannya Al-Amin

    Nah sekarang pasanglah tiga kode diatas pada akhir tiga kalimat tersebut sehingga menjadi:

    Muhammad utusan Alloh <sup><a href="#1">[1]</a></sup>

    Kakeknya memanggilnya Ahmad <sup><a href="#2">[2]</a></sup>

    Julukannya Al-Amin <sup><a href="#3">[3]</a></sup>

11. Kemudian pada akhir postingan ketik kode berikut:

    <div class="footnote">
      <p><a name="1">[1]</a> penjelasan footnote 1</p>
      <p><a name="2">[2]</a> penjelasan footnote 2</p>
      <p><a name="3">[3]</a> penjelasan footnote 3</p>
    </div>

---

Dan hasilnya kira-kira bisa dilihat sendiri.

Lanjut ke Link Tujuan

Anda mungkin tertarik artikel ini :

Terima kasih telah membaca artikel kami yang berjudul: Cara Membuat Footnote Catatan Kaki Blogger dengan CSS, jangan lupa + IKUTI website kami dan silahkan bagikan artikel ini jika menurut Anda bermanfaat. Simak artikel kami lainnya di Google News.

Dukung kami dengan memilih salah satu metode donasi di bawah ini:

Donasi via Saweria Donasi via Trakteer Donasi via PayPal

Dana / OVO / GoPay 0858 6878 6809