Membuat Daftar Isi Blogger

Diposkan oleh Madie Zha on 05 February 2013 at 10:02 PM

Membuat Daftar Isi Blogger | Tutorial Blog

Sebenarnya untuk tutorial Membuat Daftar Isi Blogger sudah pernah saya bikin, cuma kali ini saya buat beberapa macam jadi tinggal sobat pilih mau menggunakan yang mana, Daftar Isi Berdasarkan Tanggal Postingan, berdasarkan artikel terbaru atau berdasarkan label.
Untuk tutorialnya saya bikin jadi dua biar lebih jelas, pertama untuk halaman / page dan kedua untuk widget / gadget.

Yang pertama kita membuat sebuah halaman yang berisi daftar isi, berikut tutorialnya :
  • Login ke blogger.
  • Klik Laman > Laman Baru > Laman Kosong.
  • Beri judul Daftar Isi atau Sitemap atau apalah terserah Anda.
  • Kemudian klik pada tab Edit HTML.
    membuat daftar isi blog
  • Lalu letakkan kode berikut pada area artikel.
    <div style="overflow:auto;width:480px;height:450px;padding:10px;border:1px solid #eee">
    <script src="https://html-scripts.googlecode.com/files/feeds.js"></script>
    <script src="http://wadahtutorial.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
    </script>
    </div>
    Keterangan :
    • Ganti Alamat wadahtutorial.blogspot.com dengan url / alamat blog Sobat.
    • width:480px : Lebar area, ganti dengan ukuran yang sobat inginkan.
    • height:450px : Tinggi area, ganti sesuai keinginan sobat.
    • Untuk tidak menggunakan text area atau scroll hapus tulisan yang saya beri latar kuning.
    • https://html-scripts.googlecode.com/files/feeds.js : ganti dengan alamat daftar isi yang anda inginkan. Berikut beberapa kodenya :
      1. Berdasarkan Label :
        https://html-scripts.googlecode.com/files/feeds-labels.js
      2. Berdasarkan Tanggal :
        https://html-scripts.googlecode.com/files/feed-dates.js
      3. Berdasarkan Artikel terbaru :
        https://html-scripts.googlecode.com/files/feeds.js
  • Klik tombol Preview / Pratinjau untuk melihat hasilnya, jika sudah benar klik Publish Page / Tayangkan Laman. Lalu buka Blog Sobat dan lihat hasilnya…
Yang kedua kita Membuat Widget Daftar Isi, berikut tutorialnya :
  • Pada dashboard blogger, klik Tata Letak.
  • Klik Tambah Gadget.
  • Pilih HTML/Javascript.
  • Silakan beri judul pada widget. Lalu letakkan kode berikut :
    <div style="overflow:auto;height:250px;padding:10px;border:1px solid #eee">
    <script src="https://html-scripts.googlecode.com/files/feeds.js"></script>
    <script src="http://wadahtutorial.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
    </script>
    </div>
    • Ganti Alamat wadahtutorial.blogspot.com dengan url / alamat blog Sobat.
    • Ganti https://html-scripts.googlecode.com/files/feeds.js dengan kode daftar isi dibawah ini :
      1. Berdasarkan Label :
        https://html-scripts.googlecode.com/files/feeds-labels.js
      2. Berdasarkan Tanggal :
        https://html-scripts.googlecode.com/files/feed-dates.js
      3. Berdasarkan Artikel terbaru :
        https://html-scripts.googlecode.com/files/feeds.js
  • Klik tombol SAVE. Lalu lihat hasilnya di Blog Sobat.
Jika sobat ingin menampilkan daftar isi berdasarkan salah satu label di blog sobat silakan baca postingan Membuat Daftar Isi Label Tertentu.

Selamat mencoba dan semoga berhasil Membuat Daftar Isi Blogger.

.:. 219 komentar .:.Post a Comment

  1. makasih bnyk sob, langsung ane coba

    ReplyDelete
  2. mirip kaya blog agan ya ? yang dihalaman home nya, mantep nih ! bloh di coba gan !

    ReplyDelete
    Replies
    1. makasih Banget sangat bermanfaat

      Delete
    2. mas waktu aku coba pratinjau di laman kok gak ada tulisan apa2.. isinya kosong...cuma kotak aja..

      Delete
  3. trimakasih atas infonya yang bermanfaat

    ReplyDelete
  4. nice share
    berkunjung silaturahim
    keep blogging

    ReplyDelete
  5. nice post sob.
    kunjungi blog ku sob http://antok-cyber.blogspot.com

    ReplyDelete
  6. Mas Admin, berguna sekali ilmunya bagi perkembangan dan kemajuan para blogger, terima kasih telah berbagi, jika sudi mampi ya ke :
    www.frekzoom.blogspot.com

    ReplyDelete
  7. Waini, harus dicoba ni!
    Sip sip..

    ReplyDelete
  8. thank's bgt .. sngat membantu..

    ReplyDelete
  9. sudah dicoba.....
    berhasil, gampang banget buatnya :)
    makasih gan :)

    ane klik plus atu nya di laman ini :)

    ReplyDelete
  10. Bisa di ilangin gak tulisan "baru!!!" nya ?

    ReplyDelete
  11. Thanks mas bro...triksnya akan dicoba

    ReplyDelete
  12. tarima kasih infonya, sudah dicoba dan berhasil...

    ReplyDelete
  13. Keren Sob!

    Kunjungan baliknya di darkmetaland.blogspot.com

    ReplyDelete
  14. mantap udah ane coba dan berhasil!! kunjung balik yah http://toutorial.info masih baru kok websitenya :D

    ReplyDelete
  15. makasih gan buat informasinya semoga bermanfaat buat kita semua salam kenal aja dari aku

    ReplyDelete
  16. Contoh daftar isinya gimana sob?

    ReplyDelete
  17. Tutorial semuanya yg ada di sini sangat2 membantu..., Thanks...n lam kenal ... thx..!

    ReplyDelete
  18. Replies
    1. ini baru jelas info detail ,blog yg lain kurang jelas
      mksh info nya

      Delete
  19. siip, ane paham, makasih nih gan ! ☺

    ReplyDelete
  20. Terima kasih informasinya. Bagi saya yang masih sangat hijau dalam perblogan, informasi ini sangat penting dan berguna. Sudah saya coba, ternyata berhasil. Makasih banget sekali lagi.
    belajar-fisika-online1.blogspot.com

    ReplyDelete
  21. informasinya luar biasa sangat bermanfaat sekali...
    Banyak sekali ilmu pengetahuan yang saya dapatkan
    Terimakasih banyak atas informasinya ...
    Semoga semakin sukses

    ReplyDelete
  22. informasinya luar biasa sangat bermanfaat sekali...
    Banyak sekali ilmu pengetahuan yang saya dapatkan
    Terimakasih banyak atas informasinya ...
    Semoga semakin sukses

    ReplyDelete

  23. informasi yang sangat menambah wawasan saya makasih ga,.

    ReplyDelete
  24. Her posts are very dance gan,,

    ReplyDelete
  25. cool article, thanks gan his info .

    ReplyDelete

  26. information is very interesting to observe, hopefully useful,

    ReplyDelete
  27. gan cool info, thanks gan broaden my

    ReplyDelete
  28. success continues to sob, wait again next article,,

    ReplyDelete
  29. Informasinya sangat bermanfaat sekali...
    Banyak pengetahuan saya dapatkan setelah saya menyimak artikel di blog ini...
    Ditunggu postingan selanjutnya...
    Semoga semakin suksesnya....

    ReplyDelete
  30. Hanya berbeda alamat script nya saja :D

    ReplyDelete
  31. waah infonya kangat kereeennn gan :p

    ReplyDelete
  32. ditunggu ea gan artikel slanjutnya :)

    ReplyDelete

  33. informasi yang sangat menambah wawasan saya makasih ga,.

    ReplyDelete
  34. Her posts are very dance gan,,

    ReplyDelete
  35. cool article, thanks gan his info .

    ReplyDelete
  36. thanks for the info may be useful gan

    ReplyDelete
  37. terimakasih banyak sob atas informasinya yang menarik

    ReplyDelete
  38. lumayan nih informasinya membntu

    ReplyDelete
  39. artikel yang sangat bagus sekali ddan tentunya sangat bermanfaat untuk pembacakhususnya saya pribadi, terima kasih salam kenal dan sukses selalu.

    ReplyDelete
  40. setelah saya baca seluruh artikel dan akhirnya saya menemukan apa yang saya cari selama ini. saya ucapkan terima kasih ini semua berkat anda. salam kenal dan salam sukses

    ReplyDelete
  41. artikel yang patut di acungkan jempol, kata-kata yang tersusun rapi jelas dan mudah di mengerti, banyak di butuhkan orang teruma saya pribadi, terima kasih atas segala kebaikan anda yang anda berikan melalui tulisan ini.

    ReplyDelete
  42. setelah saya menyimak smua isi artikel anda dan saya ucapkan beribu terima kasih, berkat artikel ini, ilmu dan pengetahuan saya jadi bertambuah, semoga bermanfaat. salam kenal gan dari saya.

    ReplyDelete
  43. terima kasih banyak atas imformasinya ini sangat bermanfaat khususnya untuk saya pribadi, sukses ya gan..

    ReplyDelete
  44. artikel yang sangat menarik dan tentunya sangat membantu saya dalam belajar, makasih banyak ya lam sukses selalu

    ReplyDelete
  45. terima kasih informasinya langsung di praktekkin, salam

    ReplyDelete
  46. stelah sayan baca artikelnya sangat menarikkk thanks gan

    ReplyDelete
  47. stelah saya baca memang artikelnya sangat menarik untuk disimak, sukses terus gan

    ReplyDelete
  48. setelah saya menyimak smua isi artikel anda dan saya ucapkan beribu terima kasih, berkat artikel ini, ilmu dan pengetahuan saya jadi bertambuah, semoga bermanfaat. salam kenal gan dari saya.

    ReplyDelete
  49. terima kasih banyak atas imformasinya ini sangat bermanfaat khususnya untuk saya pribadi, sukses ya gan..

    ReplyDelete
  50. artikel yang sangat menarik dan tentunya sangat membantu saya dalam belajar, makasih banyak ya lam sukses selalu

    ReplyDelete
  51. artikel yang sangat bagus sekali dan tentunya sangat bermanfaat untuk pembaca khususnya saya pribadi, terima kasih salam kenal dan sukses selalu.

    ReplyDelete
  52. setelah saya baca seluruh artikel dan akhirnya saya menemukan apa yang saya cari selama ini. saya ucapkan terima kasih ini semua berkat anda. salam kenal dan salam sukses

    ReplyDelete
  53. kwalitas yang penting dalam suatu artikel dan itu ada dalam artikel anda ini, hebat gan. lam kenal dari saya.

    ReplyDelete
  54. artikel yang patut di acungkan jempol, kata-kata yang tersusun rapi jelas dan mudah di mengerti, banyak di butuhkan orang teruma saya pribadi, terima kasih atas segala kebaikan anda yang anda berikan melalui tulisan ini.

    ReplyDelete

  55. infonya sangat menarik banget gan :)

    ReplyDelete
  56. ok dech artikelnya sangat menarikkk gan

    ReplyDelete
  57. waah infonya kangat kereeennn gan :p

    ReplyDelete
  58. infonya benar-benar sangat menarik gan thanks

    ReplyDelete
  59. ditunggu ea gan artikel slanjutnya :)

    ReplyDelete
  60. infonya sangat menariiik banget gan

    ReplyDelete

  61. artikelnya sangat menarik untuk dibaca gan sukses terus ea..

    ReplyDelete


  62. informasi yang sangat menarik dan bermanfaat bagi saya thanks gan

    ReplyDelete
  63. ditunggu ea gan artikel slanjutnya :)

    ReplyDelete

  64. infonya sangat menarik gan untuk disimak thanks :)

    ReplyDelete
  65. stelah sayan baca artikelnya sangat menarikkk thanks gan

    ReplyDelete

  66. stelah saya baca memang artikelnya sangat menarik untuk disimak, sukses terus gan

    ReplyDelete
  67. artikel yang sangat bagus sekali dan tentunya sangat bermanfaat untuk pembaca khususnya saya pribadi, terima kasih salam kenal dan sukses selalu.

    ReplyDelete

  68. makasih infonya semoga dapat bermanfaat untuk semua orang..

    ReplyDelete
  69. artikel yang patut di acungkan jempol, kata-kata yang tersusun rapi jelas dan mudah di mengerti, banyak di butuhkan orang teruma saya pribadi, terima kasih atas segala kebaikan anda yang anda berikan melalui tulisan ini.

    ReplyDelete
  70. ditunggu ea gan artikel slanjutnya :)

    ReplyDelete


  71. makasih infonya semoga dapat bermanfaat untuk semua orang..

    ReplyDelete
  72. artikel yang patut di acungkan jempol, kata-kata yang tersusun rapi jelas dan mudah di mengerti, banyak di butuhkan orang teruma saya pribadi, terima kasih atas segala kebaikan anda yang anda berikan melalui tulisan ini.

    ReplyDelete
  73. stelah saya baca memang artikelnya sangat menarik untuk disimak, sukses terus gan

    ReplyDelete

  74. infonya sangat menarik gan untuk disimak thanks :)

    ReplyDelete
  75. thanks tutorial daftar isi langsung saya pake

    ReplyDelete
  76. ikut komentar ea gan infonya sangat bagus

    ReplyDelete

  77. infonya sangat menarik gan

    ReplyDelete

  78. kreatif skali bikin artikelnya gan,

    ReplyDelete

  79. ikut saran ea gam menurut saya artikelnya sangat berkualitas dan menarik

    ReplyDelete

  80. makasin infonya bermanfaat

    ReplyDelete

  81. sangat menarik sekali infonya untuk saya simak,,

    ReplyDelete

  82. wiih menarik gan artikelnya

    ReplyDelete

  83. makasih infonya semoga bermanfaat gan

    ReplyDelete

  84. makasih ea gan infonya :P kereenn bangettt

    ReplyDelete
  85. artikel yang sangat bagus sekali dan tentunya sangat bermanfaat untuk pembaca khususnya saya pribadi, terima kasih salam kenal dan sukses selalu.

    ReplyDelete

  86. Artikelnya sangat menarik gan

    ReplyDelete
  87. setelah saya baca artikelnya sangat menarik dan menambah pengetahuan saya, sukses terus gan ditunggu artikel selanjutnya

    ReplyDelete
  88. siiipppp,,
    http://moeclazh.blogspot.com/

    ReplyDelete
  89. informasi yang menakjubkan dan sangat menarik
    terimakasih info nya sangat bermanfaat
    semoga sukses

    ReplyDelete
  90. Terimakasih banyak atas info nya
    sangat bermanfaat sekali
    kini pengetahuan saya semakin bertambah
    semnoga semakin sukses nya

    ReplyDelete
  91. terimakasih banyak atas informasinya sangat luar biasa sekali bermanfaat

    ReplyDelete
  92. informasi yang sangat luar biasa sekali menakjubkan
    banyak pengetahuan yang saya dapat
    teimakasih salam sukses

    ReplyDelete
  93. infonya sangat menarik untuk saya simak,, nice infonya gan. sukses terus!!!!

    ReplyDelete
  94. sangat luar biasa informasi yang saya dapatkan
    banyak sekali pengetahuan yang saya dapatkan
    sangat bermanfaat sekali

    ReplyDelete
  95. menakjubkan sekali informasi nya
    pengetahuan saya semakin bertambah
    sanagt bermanfaat sekali

    ReplyDelete
  96. terimakasih banyak atas informasi nya
    semoga bermanfaat dan sukses

    ReplyDelete
  97. terima kasih banyak atas imformasinya ini sangat bermanfaat khususnya untuk saya pribadi, sukses ya gan..

    ReplyDelete
  98. artikel yang anda tulis di blog ini, sungguh sangat memotivasi diri saya untuk trus berkarya, terima kasih semoga kebaikan anda mendapatkan balasa yang lebih baik.

    ReplyDelete
  99. makasih buat tutorial membuat daftar isinya, salam kenal

    ReplyDelete
  100. . setelah saya menyimak dari awal hingga akhir, banyak sekali ilmu yang saya terima dari artikel yang anda tulia, semoga tambah bermanfaat ya lam kenal dan sukses selalu

    ReplyDelete
  101. terima kasih banyak atas imformasinya ini sangat bermanfaat khususnya untuk saya pribadi, sukses ya gan..

    ReplyDelete
  102. makasih banyak info nya
    bermanfaat

    ReplyDelete
  103. makasih banyak info nya
    bermanfaat

    ReplyDelete
  104. makasih infonya sangat menarik

    ReplyDelete
  105. . artikel yang anda tulis di blog ini, sungguh sangat memotivasi diri saya untuk trus berkarya, terima kasih semoga kebaikan anda mendapatkan balasa yang lebih baik.

    ReplyDelete
  106. informasi nya menakjubkan sekali
    sangat bermanfaat...
    semoga sukses

    ReplyDelete
  107. Thank you for such an honest and informative post! This is the first time I've stumbled upon your blog, and I am so happy that I did  Online Travel Agencies

    ReplyDelete
  108. sangat menarik infonya gan,,

    ReplyDelete

  109. Thanks infonya sangat bermanfaat sekali buat saya, di tunggu ea artikel selanjutnya :D

    ReplyDelete
  110. Terima Kasih infonya, sangat bermanfaat sekali buat saya.

    ReplyDelete

  111. Informasinya sangat keren....

    ReplyDelete
  112. Informasinya sangat bermanfaat makasih gan,,,

    ReplyDelete
  113. wah infonya kerennnnn sob suksek selalu ea,,,

    ReplyDelete
  114. Mantappppp infonya gan thankas ea :D

    ReplyDelete
  115. terima kasih banyak atas imformasinya ini sangat bermanfaat khususnya untuk saya pribadi, sukses ya gan..

    ReplyDelete
  116. informasi yang sangat menambah wawasan saya makasih ga,.

    ReplyDelete

  117. thanks ea, kerennn bangettt infonya.... sukses selalu ea sob

    ReplyDelete
  118. nice infonya.... sukses terus ea ditunggu artikel selanjutnya!!!

    ReplyDelete
  119. gan, punyaku kok muncul kotaknya doang tp gak ada isinya, padahal blogg nya udah ada artikelnya.. help me plissss

    ReplyDelete
  120. Alhamdulillah... ketemu juga cara bikin Daftar Isi yang mantap! Thanks gan...

    ReplyDelete
  121. Ini yang saya butuhkan gan, thanks dah share ya, semoga makin sukses :)

    ReplyDelete
  122. ok work 100%
    tapi gmna caranya supaya daftar isi itu menurut abjad

    ReplyDelete
  123. bagus om, langsung ijin pasang di blog sy neh. makasi ya. ditunggu artikel lainnya.

    ReplyDelete
    Replies
    1. Bagus artikel anda gan.

      Silahkan kunjungi balik di www.infobagusnih.blogspot.com
      Gratis Download Ebook Spesial :
      CARA MERAWAT LAPTOP
      CARA MERAWAT HP LAYAR SENTUH
      ASMAUL HUSNA
      KUMPULAN HADITS NABI
      TIPS-TIPS BERWIRAUSWAHA
      CARA MENGHILANGKAN STRES TANPA BIAYA
      dan lain-lain.

      Gratis untuk anda semua.
      terima kasih.

      Delete
  124. Mantap tuh ,,,
    agan agan [pada mampir yah ..
    bioskop-ane.blogspot.com atau kawasansobang.blogspot.com

    ReplyDelete
  125. mantap sob tutorialnya, ane coba dan langsung berhasil. thanks. :D

    ReplyDelete
  126. Replies
    1. Bagus artikel anda gan.

      Silahkan kunjungi balik di www.infobagusnih.blogspot.com
      Gratis Download Ebook Spesial :
      CARA MERAWAT LAPTOP
      CARA MERAWAT HP LAYAR SENTUH
      ASMAUL HUSNA
      KUMPULAN HADITS NABI
      TIPS-TIPS BERWIRAUSWAHA
      CARA MENGHILANGKAN STRES TANPA BIAYA
      dan lain-lain.

      Gratis untuk anda semua.
      terima kasih.

      Delete
  127. Bagus artikel anda gan.

    Silahkan kunjungi balik di www.infobagusnih.blogspot.com
    Gratis Download Ebook Spesial :
    CARA MERAWAT LAPTOP
    CARA MERAWAT HP LAYAR SENTUH
    ASMAUL HUSNA
    KUMPULAN HADITS NABI
    TIPS-TIPS BERWIRAUSWAHA
    CARA MENGHILANGKAN STRES TANPA BIAYA
    dan lain-lain.

    Gratis untuk anda semua.
    terima kasih.

    ReplyDelete
  128. bleh dicoba ni tips,
    mau maen game flash cba,
    aliealwayson.blogspot.com/search/label/Flash%20Game

    ReplyDelete
  129. kok gak muncul gan daftar isinya? tolong dibantu.

    ReplyDelete
  130. sekarang sepertinya wiget feed atau untuk tampilan daftar isi banyak menggunakan kode baru ya

    ReplyDelete
  131. izin simak ya admin buat artikelnya, postingan yg bermanfaat sekali. terimakasih atas informasinya sangat bermanfaat.

    ReplyDelete
  132. sangat membantu om buat newbie kaya saya, thanks... mampir ya :)

    indegi.blogspot.com

    ReplyDelete
  133. Siip akhirnya ktemu jga artikel yang saya cari. Saya baru belajar ngeblog gan, alias newbie. jadi masih bingung cara membuat blog yang bagus. mudah2an denga artikel agan ini blog saya juga bisajadi lebih bagus seperti blognya agan. Intip2 blog saya ya gan : negeriku-indah.blogspot.com

    ReplyDelete

 
Alexa Certified Traffic Ranking for http://wadahtutorial.blogspot.com
Follow
back to top
Home
back to bottom