Membuat Daftar Isi/Sitemap Blog Otomatis dengan Tampilan CSS

Post by Unknown on Monday, August 22, 2011 | 1:57 AM


Assalamu’alaikum wr. wb.
Kali ini blog Horier akan membahas trik Blogger tentang Cara Membuat Daftar Isi/Sitemap Blog Otomatis dengan Tampilan CSS. Membuat Daftar Isi sangatlah penting bagi para pengunjung blog kita, sebab dengan adanya daftar isi maka semua artikel yang ada di blog kita akan terpampang layaknya kita pergi ke restoran dan melihat menu-menu yang disajikan. Nah, bila masih penasaran cara membuat daftar isi sangatlah gampang koq. Untuk live demo-nya ada di daftar isi blog ini. Trik ini aku peroleh dari web-nya Om Abu Farhan.

Cara Membuat Daftar Isi/Sitemap Blog Otomatis dengan Tampilan CSS :
1.     Login ke Blogger – New Post.
2.     Pilih opsi Edit HTML dan masukkan kode berikut.

<link href="http://abu-farhan.com/script/acctoc/acc-toc.css" media="screen" rel="stylesheet" type="text/css"></link>
<script src="http://abu-farhan.com/script/acctoc/daftarisiv2-pack.js"></script>
<script src="http://horier.blogspot.com/feeds/posts/summary?max-results=1000&amp;alt=json-in-script&amp;callback=loadtoc"></script>
<script type="text/javascript">
var accToc=true;
</script>
<script src="http://abu-farhan.com/script/acctoc/accordion-pack.js" type="text/javascript"></script>

3.     Ganti “horier.blogspot.com” dengan alamat temen-temen blogger.
4.     Setelah selesai, tinggal di Post deh.


Mudahkan untuk Membuat Daftar Isi/Sitemap Blog dengan Tampilan CSS, jika teman-teman suka dengan artikel  Cara Membuat Daftar Isi/Sitemap Blog Otomatis dengan Tampilan CSS. Mohon  untuk klik tombol Share ya yang ada dibawah artikel ini.

Blog ini sedang mengukuti Kontes SEO, jadi bila teman-teman tidak keberatan mari kunjungi artikel’ku Top 1 Oli Sintetik Mobil-Motor Indonesia dan mohon dukungannya ya dengan meng-klik tombol Share dibawah artikel tersebut. Terima kasih kepada teman-teman yang mau untuk berpartisipasi, Salam Blogger . . . ^^

Selamat menikmati dan semoga berhasil . . . Alhamdulillah ^^


141 Comments:

  • uda pernah buat sob, efek jquery kan?
    btw : PERTAMAXXX visitback kwan

  • mksih bnget gan izin copy kode html nya,,sukses selalu

  • keren ane cuma sedot Js' nya...
    untuk dihosting sendiri biar ndk lemot..

  • mksih bnyak scriptnya ..
    kebetulan saya baru mulai pke blog.
    sangat bermanfaat

  • thnaks mas.. keren bentuknya.. :D

  • daftar isi memang penting sob biar pengunjung mudah mencari artikel yg di cari apalagi kalo tersusun seperti yg ada digambar, bagus!

  • Terima Kasih Banyak Mas Atas Tutorial Blognya...
    Sangat Membantu...

  • ok gan info nya sangat menarik banget,,,
    salam kenal ya,,,,

  • letak edit htpm di wordpres dimana mohon bantuan di
    agro_buah@yahoo.com

  • Informasi dari horier, selalu bermanfaat buat blogger lain, salam sukses buat Anda.

    Smoga sukses juga buat kontesnya ya mas....

  • @cek-info : iya sob pake jquery nih, oke kawan thanks ya ^^

    @baju : oke sob, moga berhasil ya

    @suwardi : siip sob

  • @xamthone : iya sob sama", selamat bergabung ya ke dunia blogspot ntar

    @boy : lebih siip kan mas aris, klo butuh trik lain ada di om abu farhan itu bagus"

    @peluang : uda dicoba kan sob? lebih hemat bandwith klo seperti itu

  • @klik : iya sob sama" ya ^^

    @surabaya : iya kawan, salam kenal juga ya

    @agrobuah : aduh klo untuk WP aku tidak sepenuhnya tahu sob coz gag pernah pake WP? maaf ya

  • @pelita : ahh biasa aja sob aku jadi tersandung nih, hehehehe..makasih banyak ya ^^

  • siip,, dengan ada'y daftar isi kita bisa mencari artikel ya mungkin kita butuhkan dengan mudah...
    makasih tas informasinya

  • Udah pernah aku terapin sob,,tapi sekarang ganti lagi..
    thanks infonya.

  • keren, ane praktekin dulu sob

  • wah keren ya mas tampilan CSS nya, tapi saya tetep pake yang biasa saja. :)

  • wong ndeso numpang pinarak BOSS,, hehe

  • oh iya, kiranya sempet mampir dong ke blog saya. thnks

  • berkelana mencari singahan-singahan yang kiranya diperkenankan.. salam smuanya :)

  • Nich yang dari jaksel, nyimak blognya aja ya,,, hee

  • blog aku bahas tentang tanaman

  • cara ini biar menghjemat tampilan juga ya mas..
    mksih bnyak scriptnyaa

  • makasih banyak infonya Bang. keren.

  • assalamualaikum

    wah keren mas daftar isinya, ini nih yang dicari buat yang lagi belajar ngeblog, langsung dicoba deh

  • @jelly : oke sama"

    @gamat : iya sob bener banget..oke sama"

    @black : yg dulu gag menarik ya sob, coba yg ini deh dijamin mantebs

  • @jelly : oke sama"

    @gamat : iya sob bener banget..oke sama"

    @black : yg dulu gag menarik ya sob, coba yg ini deh dijamin mantebs

  • @xaon : iya sob, moga berhasil ya ^^

    @daw-xp : iya sob gpp itu'kan hak pribadi, hehehe..cuman klo ini lebih hemat bandwith

    @emping : iya sob, tunggu ya ^^

  • @jabon : monggo silakan wae panjenengan pinarak ^^

    @bibit : insyallah sob, coz ini limit bandwith

    @ekspedisi : silakan aja sobat singgah disini asal tidak melakukan komentar aktif coz SPAM

  • @jaksel : iya sob gpp, thanks ya uda mampir jauh-jauh, hehehehehe

    @jabon : iya sob

    @tanaman : makasih aja ke om abu farhan coz aku cuma share koq sob ^^

  • @pawana : iya sama" sob ^^

    @niam : iya sob sama" juga ya, moga berhasil di dunia blogging

  • Ntar tak coba mas...bagus kayaknya...
    memberatkan loading blog ndak mas itu...?

  • bisa penghematan tampilan nihh,.
    mancapp !!

  • saya baru2 nie buat blog,, jadi kurang paham masalah nie....
    v saya coba dlu deh...
    makasih y...

  • nih dia yang kucari ketemu disini makasih ya infonya

  • @ferry : gag koq mas, klo untuk trik yg ini daftar isinya rapi jadi gag butuh bandwith banyak

    @depok : yoi sob

    @tangerang : moga berhasil ya sob, sukses deh ^^

  • @amazingers : langsung dicoba dunk sob, sukses yah

  • @luka : iya sob, salam kenal juga deh

  • mantap nie info nya ............

  • thanks ats infonya gan bermanfaat..

  • ok juga nih tutorialnya,,
    aku akan langsung coba ke tkp nih

  • Terimakasih buat om Google, saya nyasar sampai sini. THanks yah infonya

  • Waduh dapat info baru nih. Saya bikin secara manual pake ilmu kopas. Agak lama sih dan ribet. Tapii efektif buat SEO dan SEF. Thansk

  • tips yang simple dan bermanfaat untuk para blogger, khususnya saya sendiri :)

    saya juga sudah menerapkan hal semacam ini, dan hasilnya menggembirakan karena selain mudah penerapannya dan maksimal kontribusi atas penerapan daftar isi yang ada di blog kita.

    jadi web kita gampang di crawl oleh search engine.. dan keberadaan web kita semakin jelas.. :)

    thanks atas sharingnya, sukses selalu

    salam sahabat :)

  • oh gitu ya gan caranya .
    thanks buat infonya

  • klo untuk di wordpress gimna caranya??/

  • nah ini yang ane cari" dari dulu gan,
    kirain blogspot gag bisa dikasih sitemap kayak WP :D
    thx gan . . .

  • buat wordpress yang simple kodenya ada gak bro?
    ada beberapa skrip, dah tak coba ggal mulu

  • ntar diprakteklah,,,,thanks banyak2,,

  • Gan Makasih Banyak yah,. Keep Posting Gan,. Ane Setuju+Sudah dipraktekan sama Ane.,

  • Waaaahhh, ini say saya cari-cari sudah lama sampai lupa, Terimakasih banyak atas ilmunya, semoga bermanfaat dan mendapat balasan yang setimpal dr YME..

  • gampang banget gan triknya..
    makasih deh atas sgalanya...

  • thanks ya , sangat membantu infonya ..

  • Bentuk tampilannya seperti apa ya?

  • bisa buat platform mana aja ni gan ?blogspot, wordpress?

  • Sitemap is useful for maximizing SEO

  • It would be useful for blogpreneur

  • thanks for the info. Work on it right away

  • thanks gan. infonya bermanfaat. Ini bisa buat wordpress?

  • Thanks for the trik. Tapi buat wordpress bisa gak ya? contoh tampilannya mana ya?

  • o begitu yaa terima kasih banyak ya gan atas infonya

  • mantabb sekali pertamax
    di tunggu sekali kunjungan baliknya yaa mas brow

  • wah sip makasih... moga berhsail saya coba

  • kebetulan saya baru belajar blogspot gan..
    makasih yah..

  • dengan adanya daftar isi memudahkan pengunjung untuk mencari artikel yang sudah kita tulis

  • blm ngerti banget nih tentang CSS

  • topmarkotop sob
    http://callygraphycenter.blogspot.com/

  • mksih ya smoga saja bermafaat untuk smua nya

  • Memang mantap sih menu akordeon ini tapi membuat loading blog menjadi berat.

  • mmh kayanya mesti dicoba tuuhh diblog saya..makasih infonya gan..ditunggu info2 selanjutnya..

  • hari ini sya cek dah gak bisa gan
    error..

    Detect malware
    aa yang laen gak?
    makasih

    http://androidappmarkets.blogspot.com/#

  • langsung jadi gak nih min. . apa perlu setttingan lagi lainnya.

  • Terima Kasih Banyak Mas Atas Tutorial Blognya...
    Sangat Membantu...

  • dengan tampilan seperti ini bisa membuat visitor blog betah berlama-lama di blog kita

  • Mantap sob...
    terimakasih atas infonya gan...
    di tunggu kunjungannya

  • trimakasih atas ilmunya sob...
    n dalam kenal
    jangan lupa berkunjung sob......

  • info yang sangat bermanfaat. maju & sukses selalu gan..

  • Terimakasih gan sharenya,, artikelnya sangat bermanfaat sekali ,menarik ,artikelnya juga sangat bagus
    sukses ya

  • itu bisa langsung update sendiri gak gan klo ada posting baru?
    makasih infonya semoga bermanfat

  • Terimakasih bnayak atas informasinya :)

  • terimakasih atas informasinya sangat bermanfaat

  • terimakasih informasi dan tutorial lengkapnya,, hampir semua ada di blog sini..

  • complit bgt infonya,moga bermanfaat makasi

  • terimakasih atas infonya! mantap dan berguna buat saya!

  • makasih infonya, saya lagi belar banyak..
    semoga bermanfaat, sukses buat admin..

  • Fungsi sitemap memang termasuk salah satu yang penting dalam seo,, mantap infonya sob

  • TERIMAKASIH INI MEMBANTU
    SALAM KENAL :)

  • Sangat inofatif gan infonya.. sukses sllu.

  • smga brmanfaat sllu gan infonya bagus.

  • postingnya sangat bagus bermanfaat semoga sukses slalu

  • Ayo segera bergabung bersama kami di serasiqq Agen Poker & Domino QQ Online TERBAIK dan TERPERCAYA Se-ASIA
    Nikmati promo-promo menarik dari kami ;
    -BONUS CASHBACK TERBESAR mencapai 0.5% TANPA SYARAT
    -BONUS REFERRAL 10% SEUMUR HIDUP
    -EXTRA BONUS REFERRAL 10%
    Kelebihan serasiqq :
    * Minimal Deposit sangat TERJANGKAU, Hanya Rp. 10.000,-
    * Minimal Wd Rp. 20.000,-
    * Tidak ada maksimal Withdraw (menang berapa aja pasti di bayar)
    * Jackpot hingga Ratusan JUTA rupiah
    * Proses Depo dan WD SUPER CEPAT
    * Bisa dimainkan di Android, Iphone dan Ipad
    * CS yang Ramah dan Profesional siap melayani 24jam Online
    * Dalam 1 ID dapat memainkan 7 Games : Aduq, bandarQ, Domino QQ, Poker, capsa, BandarPoker dan sakong
    * Transaksi via BCA, MANDIRI, BRI dan BNI
    * 100% TANPA ROBOT Real Player vs Player
    Mari bergabung dengan kami "serasiqq"
    Agen Poker dan Domino Terbaik dan Terpercaya
    Penasaran mau daftar ?
    Untuk info selengkapnya silahkan hubungi kami di :
    - PIN BB : 22BE23ERD
    - YMail : cs_serasiqq@yahoo.com
    - LINE : serasiqq

  • Selamat Datang di BandarLotus4D

    Situs Agen Togel Online dan Live Dingdong Terlengkap.
    Mainkan 8 Pasaran Togel & 5 Jenis Live Dingdong Ball Hanya dengan 1 (SATU) USER ID.

    Dapatkan Promo & Bonus BandarLotus4D !!
    - Bonus 10% New Member
    - Bonus 2% Deposit Harian
    - Bonus 1% Cashback Mingguan
    - Bonus Referral 1% Mingguan

    Hadiah Pembayaran TOGEL
    4D X 9.500
    3D X 980
    2D X 98

    agen togel sgp

    Website kami : Bandarlotus4d.net

  • Post a Comment

    Mari kita saling voting dan berkomentar. Jika kalian suka dengan artikel ini, ayo kita "Share" untuk membagikan informasi ini kepada teman yang lain agar lebih bermanfaat. Terima kasih banyak saya ucapkan, Salam Blogger teman . . .