Cara Membuat Daftar Isi Blog Dengan JQuery. Daftar isi pada blog merupakan salah satu fasilitas tambahan yang kita pasang pada blog dengan tujuan untuk memudahkan pengunjung blog dalam mencari informasi-informasi yang ada pada blog bersangkutan. Selain untuk maksud tersebut, daftar isi juga bisa memberikan penilaian tersendiri dari para pengunjung terhadap pengaturan-pengaturan tata letak informasi pada blog tersebut.
Share With Agung Talaga sebelumnya sudah pernah share artikel tentang tips memasang daftar isi pada blog. Sedikit saya review mungkin tentang artikel tersebut. Cara memasang daftar isi pada blog sebelumnya, lebih pas menurut saya jika dipasang pada sidebar blog dan cara pemasangannyapun cukup sederhana. Kalau berkenan untuk mengunjunginya, langsung saja ke artikel tersebut. Untuk daftar isi yang akan saya share pada postingan kali ini berbeda dengan sebelumnya. Sebagai gambaran awal dari dafta isi yang akan saya infokan pada postingan ini, silakan lihat daftar isi blog ini. Cara membuatnya pun menurutku tidak terlalu sulit juga. Untuk itu silakan praktekkan langkah-langkah berikut :
kode http://www.agungtalaga.com/ ganti dengan alamat blog Anda.
Demikian informasi saya tentang cara membuat daftar isi Blog dengan JQuery dan semoga bermanfaat. Jangan lupa setelah membaca informasi ini untuk menuliskan komentarnya.
Share With Agung Talaga sebelumnya sudah pernah share artikel tentang tips memasang daftar isi pada blog. Sedikit saya review mungkin tentang artikel tersebut. Cara memasang daftar isi pada blog sebelumnya, lebih pas menurut saya jika dipasang pada sidebar blog dan cara pemasangannyapun cukup sederhana. Kalau berkenan untuk mengunjunginya, langsung saja ke artikel tersebut. Untuk daftar isi yang akan saya share pada postingan kali ini berbeda dengan sebelumnya. Sebagai gambaran awal dari dafta isi yang akan saya infokan pada postingan ini, silakan lihat daftar isi blog ini. Cara membuatnya pun menurutku tidak terlalu sulit juga. Untuk itu silakan praktekkan langkah-langkah berikut :
- Silakan login ke akun blogger anda. Pada halaman akun blogger, silakan klik nama blognya.
- Pada halaman overview silakan pilih menu template kemudian klik edit HTML dan klik lagi Proceed lalu aktifkan pilihan Expand Widget Template.
- Pada halaman edit HTML blog anda, silakan cari kode ]]></b:skin> atau silakan tekan tombol ctrl + f untuk memudahkan pencarian kode. Kemudian copy kode di bawah ini dan letakkan di atas kode ]]></b:skin>.
- Langkah selanjutnya silakan cari kode </head> lalu letakkan kode di bawah ini tepat di atas kode </head>.
- Kemudian simpan templatenya dan close halaman edit HTML tersebut
- Langkah terakhir, silakan buat postingan baru dan copy paste kode di bawah ini pada bagian mode HTML postingan baru Anda tersebut. Untuk judulnya, terserah Anda mau kasih judul apa.
#dafis-acc{ font-family:"Trebuchet MS", Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#333; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwrJsTdiIEBKflqQh3b7_X1WEmfK-G6keh17s0mTOmjzEyWoDivdM_LHN_5Mx7H5iYgmRwaIYLruAf0qzZGsGmODvekzkxzHUEJ_wPgJTbhq_PxBzIrX4X-AtSuZLLb5X295n7wXk17Nw/s320/bg5.gif) repeat-y scroll left center #E7F7FB; padding:2px 0; border:1px solid #339DC6; } .dafis-label{ background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvLnf0ngz_8YKrCURx2CNF64-CmkQAXWm-NtZM2KCGhVwP8bnSn9Htv9hy-2FKScagVZo6SHh2ts7nepts3sYmoM_Mj6-OpIU7ealuVmq1Did0OXzE4_80zRuZbCwKbzLWLrlea6dYLKI/s1600/bg4.gif) repeat-x scroll 0 0 #E1F4FB; font-weight:bold; line-height:1.4em; overflow:hidden; white-space:nowrap; vertical-align: baseline; margin: 1px 3px; outline: none; cursor: pointer; text-decoration: none; padding: 2px 10px; color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.3); border:1px solid #2F94BA; } .dafis-label:hover{ background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh42UqXTyCexPEH8wzNjD9GfRwHRM2zDAEP5u671nWOKrUggoNcYjLvm_arHCnjgOGeGZG1OXzaNHhjqKYHe1_Bp3wIlBR3MxFzEHKrlJTLPhuziHEnitcCRD2zV8atzTPr7tjxhW84no4/s320/bg2.gif) repeat-x scroll 0 0 #E1F4FB; color:#003366; } .dafis-daf ol{ margin:0 0 0 30px !important; padding:0 !important; } .dafis-daf ol li{ background-color:#C9E9F4; line-height:1.5em; margin:1px 3px !important; white-space:nowrap; text-align:left; border:1px solid #339DC6; } .dafis-daf ol li a{ text-decoration: none !important; color:#333 !important; display:block; padding-left:10px; } .dafis-daf ol li a:hover{ background: #7BC4DF; border-left: 5px #333 solid; padding-left: 5px; text-shadow: 0 1px 1px rgba(0,0,0,.3); }
<script src='http://share-with-agung-talaga.googlecode.com/files/daftar-isi-jquery.js' type='text/javascript'/>
<script type="text/javascript" src="http://share-with-agung-talaga.googlecode.com/files/daftar-isi-jquery3.txt"></script> <script src="http://www.agungtalaga.com/feeds/posts/summary?max-results=1000&alt=json-in-script&callback=loadtoc"></script>
kode http://www.agungtalaga.com/ ganti dengan alamat blog Anda.
Demikian informasi saya tentang cara membuat daftar isi Blog dengan JQuery dan semoga bermanfaat. Jangan lupa setelah membaca informasi ini untuk menuliskan komentarnya.
Bagikan :
Jika Anda menyukai informasi yang ada di blog ini, silahkan daftarkan email Anda untuk berlangganan informasi terbaru via email dengan begitu Anda akan mendapat kiriman informasi setiap ada postingan terbaru yang terbit dari blog Tips Trik Komputer. Sebelum berlangganan artikel terbaru dengan blog ini, silakan baca dulu Cara Berlangganan Artikel Blog. Terima kasih sudah berlangganan postingan terbaru dari blog ini.
 |
