Cara Membuat Daftar Isi Keren dan Otomatis Pada Blogger

Assalamu'alaikum Wr.Wb

Kali ini saya akan membagikan tutorial menambahkan DAFTAR ISI pada blogger sobat semua, karena saya fikir daftar isi juga sangat penting bagi para pengunjung blog karena keuntungan adanya daftar isi pada blog dapat mempermudah pengunjung untuk mencari artikel yang dibutuhkan tanpa harus membuang waktu yang lama. maka saya ingin membagikan sedikit ilmu bagi sobat blogger semua.
Saya sekarang membagikan daftar isi yang dibilang cukup keren dan membuat pengunjung betah di blog sobat semua, :D karena daftar isi ini menggunakan efek ACCORDION yaitu efek dimana semua sub files pada label akan di sembunyikan dan akan muncul apabila label tersebut kita klik, jadi kita tidak perlu menghabiskan banyak tempat untuk melihat daftar isi ini.
ini saya mempunyai screenshot dari daftar isi yang saya maksud diatas

itu tadi screenshot.nya. untuk ingin tahu lebih jelasnya silahkan buka daftar isi pada blog ini yang ada pada bagian menu diatas. pada sceenshot dan blog ini saya memakai daftar isi yang berwarna hitam, tapi tenang saja bagi sobat yang menginginkan warna yang lain saya menyediakan 4 warna yakni:

• HITAM

• BIRU

• MERAH

• HIJAU

BERIKUT Step By Step nya

Step-1

Sobat login ke akun google sobat dan menuju ke blogger

Step-2

Kemudian sobat buat laman baru dengan cara, klik menu Laman/Page.

Step-3

klik Laman baru/New Page.

Step-4

Kemudian kita akan menuju Page editor yang didalamnya, ada judul (kita isikan Daftar Isi) dan hal yang wajib kita lakukan adalah Kita disediakan 2 pilihan yakni Compose & HTML, kita pilih yang HTML.

Step-5

Kemudian kita Copy-Paste script dibawah ini :

<script 

src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" 

type="text/javascript"></script><link 

href="https://googledrive.com/host/0B6nuu-1cS17iM1U3M080SEdKT0E" 

media="screen" rel="stylesheet" type="text/css"></link>

<script type="text/javascript">

var showNew    = true,

    accToc     = true,

    openNewTab = true,

    maxNew     = 2,

    baru       = "New!",

    sDownSpeed = 600,

    sUpSpeed   = 600;

</script>

<script src="https://googledrive.com/host/0B6nuu-1cS17iYWdXQm5CdEowYTQ"></script>

<script src="http://www.galaxymous.blogspot.com//feeds/posts/summary?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>

PENTING

• Text yang berwarna biru adalah link (alamat) blog saya sendiri, jadi silahkan ganti text tersebut dengan link (alamat) blog sobat masing-masing
• seperti yang saya janjikan tadi saya menyediakan 4 warna untuk daftar isi ini, script diatas adalah script untuk warna hitam. Dan untuk warna yang lain silahkan sobat ganti script yang berwarna MERAH diatas dengan salah satu script dibawah ini
• Untuk daftar isi berwarna Merah silahkan gunakan Script dibawah ini

https://googledrive.com/host/0B6nuu-1cS17iRmthbUNqd3JOU1E

• Untuk daftar isi berwarna Biru silahkan gunakan Script dibawah ini

https://googledrive.com/host/0B6nuu-1cS17iTXE1NF9UZ0ppd1k

• Untuk daftar isi berwarna Hijau silahkan gunakan Script dibawah ini

https://googledrive.com/host/0B6nuu-1cS17iSGhLNUtpNmxETkU

Step-6

Yang terakhir sobat klik SAVE dan kemudian sobat PUBLISH (Publikasikan), dan sobat lihat hasilnya!!

TARAAA !!! KEREN KAN :D

Nah cukup itu dulu ILMU tutorial dari saya hari ini, semoga bermanfaat kawan.

SAMPAI JUMPA LAGI !!!

WASSALAMU'ALAIKUM WR.WB

Share this post