Modifikasi Cantik, Sitemap Blog ala Abu Farhan

Modifikasi Cantik, Sitemap Blog ala Abu Farhan merupakan sarana suatu blog untuk menyajikan seluruh url/link postingannya kepada pengunjung blog, atau bisa disebut juga sebagai daftar isi dari blog tersebut. Saya sebut Modifikasi Cantik, Sitemap Blog ala Abu Farhan karena memang menurut saya sitemap ini cantik untuk diaplikasikan ke blog, seperti gambar di bawah ini:

Modifikasi Cantik, Sitemap Blog ala Abu Farhan

Atau untuk melihat demo Modifikasi Cantik, Sitemap Blog ala Abu Farhan silahkan lihat sitemap blog saya

Untuk membuat Modifikasi Cantik, Sitemap Blog ala Abu Farhan cukup mudah, silahkan buat postingan baru dengan judul apa saja, seperti Sitemap atau Daftar Isi. Kemudian pastekan kode di bawah ini di postingan HTML.

<style type="text/css">
/*Outer Border
------------------*/
#toc{width:99%;margin:5px auto;border:1px solid #2D96DF;
-webkit-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
-moz-box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);
box-shadow:4px 4px 8px 2px rgba(0,0,0, 0.2);}

/*Label Color and Background
------------------*/
.labl{color:#FF5F00;font-weight:bold;margin:0 -5px;padding:1px 0 2px 11px;
background:-moz-linear-gradient(right,#C2EAFE 0%,#055A85 40%);
background:-webkit-gradient(linear,left 10,right 80,color-stop(0.20,#055A85),color-stop(1,#C2EAFE));
border:1px solid #2D96DF;border-radius:4px;-moz-border-radius:4px;
-webkit-border-radius:4px;box-shadow:3px 3px 1px #bbb;
-moz-box-shadow:3px 3px 1px #bbb;-webkit-box-shadow:3px 3px 1px #bbb;display:block;}
.labl a{color:#fff;}
.labl:first-letter{text-transform:uppercase;}

/*Latest Post Info
------------------*/
.new{color:#FF5F00;font-weight:bold;font-style:italic}

/*Post Title List
------------------*/
.postname{font-weight:normal;background:-moz-linear-gradient(right,#C2EAFE 0%,#fff 40%);
background:-webkit-gradient(linear,left 80,right 10,color-stop(0.60,#fff),color-stop(1,#C2EAFE));}
.postname li{border-bottom: #ddd 1px dotted;margin-right:5px}
</style>
<div id="toc"><script type="text/javascript" src="http://dvslabs.googlecode.com/files/customizable-TOC.js"></script>
<script src="http://yourblogname.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script></div>

Ganti yourblogname.blogspot.com dengan nama blog Anda.

Kemudian silahkan publish postingan Anda, dan terakhir silahkan buat link untuk mengakses ke postingan sitemap tersebut seperti pada menu header.

Demikian postingan Modifikasi Cantik, Sitemap Blog ala Abu Farhan tersebut, mudah-mudahan bermanfaat.

Sumber: Rohis Facebook