Cara Pasang Daftar Isi Manual Di Blogspot

0 komentar

daftar isi pada website/blog berfungsi sebagai alat navigasi bagi pemilik maupun pengunjung untuk menjelajahi isi dari website/blog dan bicara soal alat navigasi sebetulnya juga pernah dibahas pada posting saya yang berjudul Cara Mudah Membuat Menu Navigasi pada Blogspot, namun posting ini akan membahas khusus soal alat navigasi berupa Daftar Isi seperti pada Blog Serba Tersedia ini, contohnya seperti di bawah ini:




























Pada umumnya jenis daftar isi ada 2 (dua) macam yaitu daftar isi manual dan daftar isi otomatis. Perbedaan dari kedua daftar isi tersebut adalah jika daftar isi manual sesuai dengan namanya dipasang dan diatur secara manual sesuai keinginan pemilik blog, sedangkan jika daftar isi otomatis akan secara otomatis menampilkan isi blog berdasarkan urutan abjat pada lable dan judul postingan.

Baiklah saya rasa penjelasan singkat tentang fungsi daftar isi pada blog sudah cukup dan sekarang mari mulai bahas sesuai judul posting ini Cara Pasang Daftar Isi Manual Di Blogspot, silahkan ikuti langkah-langkahnya sebagai berikut :
  1. Login ke Blogger, Klik Rancangan/Design;
  2. Pada Elemen Halaman, klik Add Gadget/Tambah Gadget di lokasi yang Anda inginkan;
  3. Cari dan pilih HTML/Javascript;
  4. Copy paste kode di bawah ini ke dalam Content yang telah tersedia, berikut ini kodenya :
    <style>
    .list {
    background: url("http://i977.photobucket.com/albums/ae258/SPN_photo/iconbullet.gif") no-repeat left center;border-bottom:1px dotted #ddd;line-height:1.2em;padding:3px 0px 0px 20px;
    }
    </style>

    <div style="overflow:auto; padding:3px; margin:0px 0px 0px 0px; width:300px; height:180px; background-color: #ffffff; border:1px solid #ffffff;">

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-menampilkan-kotak-komentar-di.html">Cara Menampilkan Kotak Komentar di Bawah Postingan Blog</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-membuat-teks-berjalan-atau-efek.html">Cara Membuat Teks Berjalan Atau Efek Marquee</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-membuat-teks-berjalan-di-menu-bar.html">Cara Membuat Teks Berjalan di Menu Bar</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-mudah-membuat-menu-navigasi-pada.html">Cara Mudah Membuat Menu Navigasi pada Blogspot</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/menampilkan-huruf-besar-pada-awal.html">Menampilkan Huruf Besar Pada Awal Posting</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-membagi-postingan-menjadi-2-dua.html">Cara Membagi Postingan Menjadi 2 (dua) Kolom</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-menampilkan-kode-html.html">Cara Menampilkan Kode HTML</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-membuat-page-number-navigasi.html">Cara Membuat Page Number-Navigasi Halaman</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/daftar-social-bookmark-indonesia.html">Daftar Social Bookmark Indonesia</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-setting-blog-menjadi-dofollow_21.html">Cara Setting Blog Menjadi Dofollow</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-cepat-dan-benar-memasang-iklan.html">Cara Cepat dan Benar Memasang Iklan</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/pasang-iklan-cara-meningkatkan.html">Pasang Iklan Cara Meningkatkan Pengunjung</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/05/cara-membuat-blog-di-multiply.html">Cara Membuat Blog di Multiply</a></div>

    <div class="list">
    <a href=" http://www.serba-tersedia.co.cc/2010/05/panduan-membuat-blog.html">Panduan Membuat Blog</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/04/cara-mengetahui-pengunjung-yang-online.html"> Cara Mengetahui Pengunjung Yang Online</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/04/cara-mengganti-header-blog-versi-2.html"> Cara Mengganti Header Blog Versi 2</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/04/cara-meningkatkan-traffic-situs-dan.html"> Cara Meningkatkan Trafic Situs dan Blog</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/03/cara-memperpendek-alamat-blog-dengan.html"> Cara Memperpendek Alamat Blog Dengan Domain Gratis</a></div>

    <div class="list">
    <a href="http://www.serba-tersedia.co.cc/2010/03/cara-membuat-email-di-google-lengkap.html">Cara Membuat Email</a></div>

    <div class="list">
    <a href="http://serba-tersedia.blogspot.com/2010/03/cara-membuat-kotak-text-area.html">Cara Membuat Kotak Text Area</a></div>

    <div class="list">
    <a href="http://serba-tersedia.blogspot.com/2010/03/menyembunyikan-title-dan-description.html">Cara Menyembunyikan Title dan Description pada Blogspot</a></div>

    <div class="list">
    <a href="http://serba-tersedia.blogspot.com/2010/03/cara-mengganti-header-blog-pada-blogger.html">Cara Mengganti Header Blog</a></div>

    <div class="list">
    <a href="http://serba-tersedia.blogspot.com/2010/03/cara-membuat-artikel-terkait-related.html">Cara Membuat Artikel Terkait (Related Post) pada Blogspot</a></div>

    <div class="list">
    <a href="http://serba-tersedia.blogspot.com/2010/03/cara-pasang-readmore-otomatis.html">Cara Pasang Read More Otomatis</a></div>

    <div class="list">
    <a href="http://serba-tersedia.blogspot.com/2010/03/cara-sembunyikan-navbar-blogger.html">Cara Sembunyikan NavBar Blogger</a></div></div>
  5. Klik Tombol Save/Simpan.
Keterangan :
Link dan Teks, silahkan diganti dengan link dan teks Anda;
width: 230px; adalah merupakan lebar dari kotak daftar isi manual dan boleh anda sesuaikan;
height: 180px; adalah merupakan tinggi dari kotak daftar isi manual dan boleh anda sesuaikan.

komentar (0)

Posting Komentar

Tukeran Link

affiliate program

EARN INCOME FROM YOUR WEBSITE

Turn your valuable webpage traffic into income. Work online and join our free money making affiliate program. We offer the most payment rate to help maximize your money stream.

Join our cash making program absolutely no charge and 100% risk free.

Sign Up...

0 (ZERO) INVESTMENT PROGRAM

We designed this free money program specially for NO SETUP FEE methods, to make hundreds, if not millions of dollars, without spending money.

Get revenue after you not working

Create multiple new revenue incomes each and every minute. Get revenue after you stop working or even retire at an early age with a powerful income stream. Do this one time and get paid over and over again. It's best time to create mind-blowing new levels of profit and success on the Internet.Income while you sleep

REVENUE WHILE YOU SLEEP

Earn $100... $200... $500...

Turn your blog traffic into cash!
You get paid for every visitor that clicks on our advertizing. Our goal is to help you to receive as much as possible from your web site. We pay monthly, either by check, or using PayPal.

ItShrunk Short URL Service : Itshrunk.com Simple Shrink URL and ItShrunk Short URL Service - Shrink URL - Professional short URL cloaking service with bulk URL submission, password-protected URLs, temporary URLs, marketing, tinyURL, bit.yl, affiliate, sales, market, brand, twitter, shrink URL twitter, redirect, webmast

Total Pageviews

kosong

gg

Slidershow

You can replace this text by going to "Layout" and then "Page Elements" section. Edit " About "


Shoutbox

Mau punya buku tamu seperti ini?
Klik di sini (Info Blog)