Browse » » » Table of Content ( ToC )

Table of Content ( ToC )

Post by: Denny on Senin, Mei 17, 2010
Category: |
Table of Content ( ToC ). Mungkin bagi beberapa blogger istilah ini sudah dipahami dan dimengerti, namun bagi yang belum familiar dengan TOC bisa dibaca-baca lagi. TOC atau bisa disebut daftar content kalo di wordpress bisa di artikan sitemap blog. Karena di blogger tidak terdapat fasilitas untuk menyuguhkan semua konten yang tertata rapi, maka diperlukan modifikasi yang bisa digunakan untuk menampilkan semua artikel menurut label atau categorinya. Kita bisa memanfaatkan Static Page pada blogger untuk membuat halaman static untuk menampilkan content dari blog.

Table of Content
Tidak jauh-jauh kita mencari orang yang membuat scripts Auto TOC dengan menggunakan Javascripts, salah satu teman blogger kita Abu Farhan sudah membuat beberapa versi sitemap khusus untuk blogger dengan berbagai kelebihannya.

Versi 1
Versi ini adalah versi standard dan pertama yang dikeluarkan oleh Abu untuk menampilkan daftar isi dari blog yang ditata berdasarkan Label, dengan menggunakan javascripts dan pemanggilan feeds menggunakan json maka jadilah sebuah sitemap untuk blog blogger. Penggunaannya cukup mudah, hanya dengan memasukan 1 buah scripts dan 1 buah script lagi untuk memanggil feeds. Kita bisa menggunakannya dalam postingan atau pada static pages, lebih disarankan menggunakan halaman static karena tidak akan mempengaruhi feeds reader.

Code untuk Versi 1
<script style="text/javascript" src="http://www.abu-farhan.com/script/daftarisiblogger/blogtoc-min.js"></script>
<script src="http://www.abufarhan.co.cc/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>
Ganti www.abufarhan.co.cc dengan alamat blog anda.

DEMO Table of Content Versi 1

Versi 2
Pada versi 2 ada perbedaan mencolok pada TOCnya yang tidak lagi diurutkan berdasarkan label, namun digunakan untuk archive blog. Sehingga artikel yang tampil diurutkan berdasarkan tanggal posting. Cara hampir sama dengan versi 1 cukup menambahkan code pada postingan atau dengan menggunakan static pages.

Code untuk Versi 2
<script style="text/javascript" src="http://abu-farhan.com/script/daftarisibloggerarchive/tocbyarchivemin.js"></script>
<script src="http://audio.assunnah.web.id/feeds/posts/default?max-results=500&alt=json-in-script&callback=loadtoc"></script>
Ganti audio.assunnah.web.id dengan alamat blog anda

DEMO Table of Content Versi 2

Versi 3
Untuk versi 3 tidak ada perubahan mendasar, masih menggunakan feeds dan scripts yang sudah disempurnakan. Kali ini menggunakan style dari google feeds, dengan tampilan yang lebih segar.

Code untuk Versi 3
<link rel="stylesheet" href="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.css" type="text/css" media="screen" />
<script style="text/javascript" src="http://scriptabufarhan.googlecode.com/svn/trunk/daftarisiv2.js"></script>
<script src="http://deconstructioncode.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
Ganti deconstructioncode.blogspot.com dengan alamat blog anda

DEMO Table of Content Versi 3

Versi 4 ( Accordion )
Penyempurnaan dari Table of Content sebelumnya, kali ini ditambahkan scripts accordion untuk mempermudah mencari suatu artikel didasarkan pada label atau category. Penambahan Accordion scripts sendiri dirasa perlu pada blog dengan artikel yang banyak, sehingga halaman tidak berubah menjadi terlalu panjang.

Code untuk Versi 4 ( Accordion )
<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://www.oblo.web.id/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>
Ganti www.oblo.web.id dengan alamat blog anda

DEMO Table of Content Versi 4 ( Accordion )

Demikian 4 buah versi dari TOC atau biasa kita kenal dengan sitemap untuk blogger yang telah dikembangkan oleh Abu-farhan. Keempat-empatnya tentu dapat digunakan dengan baik, namun kita harus bisa menyesuaikan kebutuhan sitemap untuk blog kita.

78 Comments for Table of Content ( ToC ):

rudy azhar write.. 17 Mei, 2010 Delete

versi yang ke empat keren juga, hasil utak atik sendiri tuh....

Denny write.. 17 Mei, 2010 Delete

@rudy .: kagak bos, tetep punya si abu kok ide dan kreativitasnya. cuman nampang doank :D

Rudy Azhar write.. 17 Mei, 2010 Delete

@Denny, kalau cssnya dirubah bisa nggak ya?

Denny write.. 18 Mei, 2010 Delete

@rudy .: bisa2 aja kan, tergantung kreativitas. mungkin diCSSnya terlalu banyak efek jadi kurang pas dipaletakan di blog yang simple, jadi tinggal disesuaikan saja. Pemakaian CSS bisa dimasukan kedalam skin atau di buat sendiri pada halaman TOCnya.

Septian write.. 22 Mei, 2010 Delete

Wah... patut dicoba...

ArdianZzZ write.. 22 Mei, 2010 Delete

Wah, udah nggak pake Blogspot gan heheh

Denny write.. 23 Mei, 2010 Delete

@Ardianzzz .: wah selamat2 untuk rumah barunya, semoga makin bisa berkreasi :D

Beben Koben write.. 25 Mei, 2010 Delete

kira2 choen & ardianz kemana tuh mencloknya yak...kekekekekkk

HAPIA Mesir write.. 25 Mei, 2010 Delete

mantaaff...

kibagus write.. 25 Mei, 2010 Delete

makasih... infonya...!!

kharis sulistiyono write.. 27 Mei, 2010 Delete

peran sitemap emang penting untuk blog.. katanya sih lebih search engine friendly. Betul gak mas?

O, iya.. orang kudus ya mas? Perkenalkan aku orang Karanganyar - Demak

- Salam -

akhatam write.. 01 Juni, 2010 Delete

Hmm kerennn!!! perlu di cobaa..

Hostgathel write.. 04 Juni, 2010 Delete

Aku kok gagal pake TOc ini versi 3 yach???

Rizqy write.. 06 Juni, 2010 Delete

Boleh jg tutornya...
Salam kenal...:)

isher write.. 10 Juni, 2010 Delete

thanks's tutorialnya bro....

mas doyok write.. 14 Juni, 2010 Delete

wah aku juga pake nggon mas abu
tapi namamu nampang di yg terbaru mantappp

akhatam write.. 18 Juni, 2010 Delete

Akuu dah pernahh coba nih gan.. Tx buat triknya..

secangkir teh dan sekerat roti write.. 19 Juni, 2010 Delete

mantap gila templatenya...

ArdianZzZ write.. 20 Juni, 2010 Delete

Gila, hiatuse suwe bangeti :p

MisterXWebz write.. 21 Juni, 2010 Delete

Wah lengkap deh gallery TOCnya,,, ijin berguru master ...

yuya indou write.. 23 Juni, 2010 Delete

bisa ngirit tempat di sidebar n tambah kaya
akan konten klo pake toc.

visit back ya mas,

http://yuyaindou.blogspot.com
http://melodacomputer.blogspot.com

XD write.. 27 Juni, 2010 Delete

artikelnya bagus

visit back
http://www.majalahbara-smaga.co.cc/

Richard Rondonuwu write.. 29 Juni, 2010 Delete

Waduh.., Tutorial dewa dan komentatornya dewa semua!!!
Sebenarnya malu mau komen, tapi niggalin jejak diblog sekeren ini kayaknya...hmmm...hihihi

aLamathuR d'hileudjapanist II write.. 01 Juli, 2010 Delete

Ane sih lebih suka dengan table yang versi 4.. cuman ane masih penasaran dengan efeknya buat loading halaman blog ane.. nambah berat ga yah ??? tolong pencerahannya gan..

jurug write.. 07 Juli, 2010 Delete

lihat demo nya keren... apalagi yang versi terbaru, nice deh pokoknya. nungguin versi berikutnya ah..

tapeketan.com write.. 11 Juli, 2010 Delete

keerreennn... nice pokoknya

bangros write.. 22 Juli, 2010 Delete

wow.. kereeenn... aq udah nyoba untuk ToC versi 4 di Blog aq, ngomong - ngomong bisa ga' yach tulisan "widget by abu farhan" letaknya paling bawah di list di hilangin...??

gunawan write.. 23 Juli, 2010 Delete

thanks to the information,
because it is very helpful especially in making and messing work on bloggers who I have today

http://dijaminpintar.totalh.com write.. 07 Agustus, 2010 Delete

Thanks infonya
Kursus internet secara online yang di jamin bisa belajar internet secara cepat
dan dijamin pintar menguasai internet untuk pemula dan pendaftaran member memakai pulsa 25rb .
Buruan Daftar!!! http://dijaminpintar.totalh.com
thanks to this blog

mhmdtq write.. 20 Agustus, 2010 Delete

oh semacam index page gitu yah :)

Mardee W write.. 25 Agustus, 2010 Delete

udah lama pake yg pertama itu..
jadi kepengen yg terahir,keknya seru tuh..

indo-komputer write.. 15 September, 2010 Delete

mantap infonya sangat bermanfaat

Surga Kenari write.. 05 Oktober, 2010 Delete

yg ke empat kok ga bisa di buka tutup sich..

padahal di demonya bisa..

kesalahan dimana tuh.. ??

mohon koreksinya para master..

Mengembalikan Tampilan Facebook Seperti Semula write.. 22 November, 2010 Delete

thanks infonya..salam kenal..

Agus Demak write.. 23 Desember, 2010 Delete

Wah... wis selangkah lebih maju ki... aku nggolek contoh ToC nggo projectku malah nemu blogmu... wkwkwkkwkw

Keep Rocking Brotha!

komunitas blogger write.. 10 Februari, 2011 Delete

lengkap sekali... :top:
yang komen juga master semua... :)

saya mengajak teman2 blogger untuk ngumpul disini http://komunitasblogger.tk , baru dibuat, jadi musti dipromoin dulu... thanks buat pemilik blog. :)

bd write.. 24 Februari, 2011 Delete

langsung dicoba ah...terima kasih :)

Anonim write.. 02 Maret, 2011 Delete

Semua Script TOC di atas tidak dapat menampilkan daftar isi lebih dari 500 artikel :(

Angga Judistia Pradana write.. 05 Juni, 2011 Delete

Wah makasih mas.. udah share

Taufik Nurrohman write.. 11 Agustus, 2011 Delete

Saya telah menerbitkan tabel konten buatan abu farhan yang telah saya indonesiakan. Apakah itu melanggar aturan? Mohon jawabannya.

Taufik Nurrohman write.. 11 Agustus, 2011 Delete

@anonim:untuk menampilkan lebih dari 500 artikel Anda tinggal menambahkan nilai maxresultnya seperti ini:

http://hompimpaalaihumgambreng.blogspot.com/feeds/posts/summary?max-results=9999&alt=json-in-script&callback=loadtoc

Denny write.. 11 Agustus, 2011 Delete

@Tukang Pos .: saya rasa tidak akan keberatan om, selama tetap menampilkan sumber.. :D

happy blogging, thanks dah dibantu jawab. saya rasa ada alasan di angka 500, beliau pernah ngomong tapi saya lupa :D

oem software write.. 26 September, 2011 Delete

E 'semplicemente incredibile tema:)

sepatu kerja write.. 10 Oktober, 2011 Delete

wah ana belu nyoba nih gan...

satria baja hikam write.. 20 Januari, 2012 Delete

thanks tipsnya gan, ane mau coba.

Satria Baja Hikam write.. 20 Januari, 2012 Delete

sippp.berhasil.kalau biar jd arsip blog caranya gimana gan?con ni punyaku jadinya label.tlg bntuannya.

Adi Bagus Indrianto write.. 01 April, 2012 Delete

thank's infonya

Fahmi Athailla write.. 26 April, 2012 Delete

mantappss. thank's infonya :D

Даниел write.. 09 Agustus, 2012 Delete

The article is very interesting and I learned things I did not know until now. Thanks for the detailed information you have posted.

Unknown write.. 05 November, 2012 Delete

oh kyak daftar isi gitu ya?

Supercoolzz

Supercoolzz write.. 05 November, 2012 Delete

makasih nih komplit banget..:)

Belajar SEO dan Blog Untuk Pemula write.. 02 Januari, 2013 Delete

makasih banyak atas infonya, sangat bermanfaat dan menarik untuk disimak

Tips Trik SEO Blogger Pemula write.. 02 Januari, 2013 Delete

tes

OBAT HERBAL ASAM URAT write.. 07 Februari, 2013 Delete

Terima kasih atas penjelasannya.

Unknown write.. 19 Juli, 2013 Delete

Alhamdulilah, terima kasih...

Toko Busana Muslimah Online write.. 31 Juli, 2013 Delete

terima kasih kang :)

jasa seo semarang write.. 19 Maret, 2014 Delete

http://www.kangtri.my.id/2014/03/jasa-seo-dan-jasa-konsultan-seo.html
http://tokoserbamurah01.wordpress.com/2014/03/13/jasa-seo-murah-semarang-indonesia/
http://www.maxmancentre.com
http://jasaseopejwan.blogspot.com/

pusat gamis terbaru write.. 23 Oktober, 2014 Delete

Mantap artikelnya, nambah ilmu nih. Makasih banget gan,,,

obat penghilang bekas jerawat write.. 21 Februari, 2015 Delete

mantep kang abu farhan.. makasih ilmunya suhu..

tf organik write.. 21 Februari, 2015 Delete

blogger new be... ikut menyimak aj :)

penghilang komedo write.. 21 Februari, 2015 Delete

kang abu belajar dimana yah.. bisa ampe bgtu.. :) makasih ilmunya kang

Unknown write.. 10 Maret, 2015 Delete

Perkenalkan, saya dari tim kumpulbagi. Saya ingin tau, apakah kiranya anda berencana untuk mengoleksi files menggunakan hosting yang baru?
Jika ya, silahkan kunjungi website ini www.kumpulbagi.com untuk info selengkapnya.

Oh ya, di sana anda bisa dengan bebas mendowload music, foto-foto, video dalam jumlah dan waktu yang tidak terbatas, setelah registrasi terlebih dahulu. Gratis :)

Pengertian Etika Bisnis write.. 06 April, 2015 Delete

peran sitemap emang penting untuk blog.. katanya sih lebih search engine friendly.
Script-script yang dibuat membuat seorang newbie pun dapat dengan mudah untuk menggunakannya...

obat jerawat write.. 23 Mei, 2015 Delete

wahh menarik juga infonya nih... boleh dicoba.. makasih ya gan.. ane masih new be blogger

harga tiang pancang write.. 11 Juli, 2015 Delete

Selain search engine friendly, sitemap juga memudahkan bagi pengunjung untuk mengetahui garis besar isi dari sebuah blog, nice sharing my brow...!

beli grosir sprei di bedibedi aja write.. 13 Agustus, 2015 Delete

peran sitemap emang penting untuk blog. katanya sih lebih search engine friendly. makasih banyak atas tulisannya

Rok Panjang Terbaru write.. 12 November, 2015 Delete

artikel ini berisi informasi yang sangat bermanfaat untuk smeua pembaca khususnya saya sendiri. Saya tunggu lagi informasi-informasi lainnya yang tidak kalah menarik.

Serum Jerawat write.. 08 Desember, 2015 Delete

Sangat suka saya dengan blog ini.

SBO Etnica write.. 23 April, 2016 Delete

Ilmu baru yang patut dicoba nih.. bagus banget artikelnya dan mudah dipahami.

Harga Beton Ready Mix write.. 16 Mei, 2016 Delete

Terima kasih infonya, ijin nyimak ya...?

keceprek melinjo write.. 18 Mei, 2016 Delete

I really like this website, Thanks for sharing this information. Keep posting more. [:))] zell v phytogreen

Nice information, many thanks to the author. It is incomprehensible to me now, but in general, the usefulness and significance is overwhelming. Thanks again and good luck! zell v

OK good to see- interesting blogs are always sweet! Peace. sabun herbal hawa

Nice information, many thanks to the author. It is incomprehensible to me now, but in general, the usefulness and significance is overwhelming. Thanks again and good luck! makanan ringan melinjo

dedi haryono write.. 18 Mei, 2016 Delete


I really like this website, Thanks for sharing this information. Keep posting more. [:))] zell v phytogreen

Nice information, many thanks to the author. It is incomprehensible to me now, but in general, the usefulness and significance is overwhelming. Thanks again and good luck! zell v

OK good to see- interesting blogs are always sweet! Peace. sabun herbal hawa

Nice information, many thanks to the author. It is incomprehensible to me now, but in general, the usefulness and significance is overwhelming. Thanks again and good luck! makanan ringan melinjo

dedi haryono write.. 18 Mei, 2016 Delete


I really like this website, Thanks for sharing this information. Keep posting more. [:))] zell v phytogreen

Nice information, many thanks to the author. It is incomprehensible to me now, but in general, the usefulness and significance is overwhelming. Thanks again and good luck! zell v

OK good to see- interesting blogs are always sweet! Peace. sabun herbal hawa

Nice information, many thanks to the author. It is incomprehensible to me now, but in general, the usefulness and significance is overwhelming. Thanks again and good luck! makanan ringan melinjo

dedi haryono write.. 13 Agustus, 2016 Delete



Nice information, many thanks to the author. It is incomprehensible to me now, but in general, the usefulness and significance is overwhelming. Thanks again and good luck!
phytogreen | zell v platinum | zell v phytogreen | zell v | placenta domba | zell v price | zell v placenta | zell v sheep placenta | zell v product | cream pemutih |suntik stem cell | plasenta rusa | placenta kosmetik | suntik placenta | produk placenta | injeksi placenta | kosmetik placenta | placenta injeksi | suntik placenta domba | suntik placenta di wajah | pemutih wajah placenta | placenta pemutih wajah |pemutih placenta | terapi stem cell

Natalie write.. 15 Agustus, 2018 Delete


Nice information, many thanks to the author. It is incomprehensible to me now, but in general, the usefulness and significance is overwhelming. Thanks again and good luck!
zell v | placenta domba | zell v price | zell v placenta | zell v sheep placenta | zell v product | cream pemutih |suntik stem cell | plasenta rusa | placenta kosmetik | suntik placenta | produk placenta | injeksi placenta | kosmetik placenta | placenta injeksi | suntik placenta domba | suntik placenta di wajah | pemutih wajah placenta | placenta pemutih wajah |pemutih placenta | terapi stem cell | tanam benang | zell v platinum plus| phytogreen | zell v phytogreen | zell v phytogreen | zell v phytogreen

OBLO write.. 28 Februari, 2020 Delete

Kren salam kenal ya mas bro...

Salt City write.. 16 November, 2020 Delete

Kalau untuk wordpress sudah ada pluginnya ya gan? btw thanks sudah sharing

Arun Sharma write.. 31 Juli, 2023 Delete

Its really wonderful and watchable. I like to share it with all my friends and hope they will definitely like it.

Posting Komentar

Spam is not Good for your Body :)

Langganan: Posting Komentar (Atom)
 
© Blogger Tutorial | Powered by Blogger | Valid X/HTML (Home Page)
Framework: Choen Design: Denny
Back To Top