Slide Daftar Isi Plus Summary

Slide Daftar Isi Plus Summary yang  akan saya bahas sekarang hampir sama dengan yang sebelumnya, cuma yang ini punya kelebihan ada Summary [beberapa suku kata isi] :o Berjalan , sekarang saya akan lanjutkan lagi berbagi dengan Artikel yang hampir sama, cuma bedanya kalau yang ini model slide :y
Model ini di publish oleh System of Blog  dan sekarang saya akan publish di Blog ini dengan sedikit pengeditan tentunya.
Okey cukup sekian ceritanya, mari kita lanjutkan ke »

Cara membuatnya : 
» Masuk Account Blogger dengan ID kawan 
» Pada Dasbor pilih Template
» Cari   ]]></b:skin>  
» Copas script berikut dibawahnya




<style>
#blogbegowrapper{
width: 300px;
height: 110px;
border: 2px solid black;
background-color:  #CED0D1;
padding: 10px;
-moz-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.16);
-webkit-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.16);
-box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.16);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -border-radius: 5px;
}
.billcontent{
width: 100%;
display:block;
}
</style>

» Simpan Template kawan 
Selanjutnya kawan pilih Tata Letak untuk memanggilnya  :r 

  • Pilih Tambah Gadget
  • Pilih tanda Plus [+] pada HTML / JavaScript
  • Copas Script berikut kedalamnya

<script type="text/javascript">
var billboardeffects=["GradientWipe(GradientSize=1.0 Duration=0.7)", "Inset", "Iris", "Pixelate(MaxSquare=5 enabled=false)", "RadialWipe", "RandomBars", "Slide(slideStyle='push')", "Spiral", "Stretch", "Strips", "Wheel", "ZigZag"]
//var billboardeffects=["Iris"] //Uncomment this line and input one of the effects above (ie: "Iris") for single effect.
var tickspeed=5000 //ticker speed in miliseconds (2000=2 seconds)
var effectduration=500 //Transitional effect duration in miliseconds
var hidecontent_from_legacy=1 //Should content be hidden in legacy browsers- IE4/NS4 (0=no, 1=yes).
var filterid=Math.floor(Math.random()*billboardeffects.length)
document.write('<style type="text/css">\n')
if (document.getElementById)
document.write('.billcontent{display:none;\n'+'filter:progid:DXImageTransform.Microsoft.'+billboardeffects[filterid]+'}\n')
else if (hidecontent_from_legacy)
document.write('#blogbegowrapper{display:none;}')
document.write('</style>\n')
var selectedDiv=0
var totalDivs=0
function contractboard(){
var inc=0
while (document.getElementById("billboard"+inc)){
document.getElementById("billboard"+inc).style.display="none"
inc++
}
}
function expandboard(){
var selectedDivObj=document.getElementById("billboard"+selectedDiv)
contractboard()
if (selectedDivObj.filters){
if (billboardeffects.length>=2){
filterid=Math.floor(Math.random()*billboardeffects.length)
selectedDivObj.style.filter="progid:DXImageTransform.Microsoft."+billboardeffects[filterid]
}
selectedDivObj.filters[0].duration=effectduration/1000
selectedDivObj.filters[0].Apply()
}
selectedDivObj.style.display="block"
if (selectedDivObj.filters)
selectedDivObj.filters[0].Play()
selectedDiv=(selectedDiv<=totalDivs-2)? selectedDiv+1 : 0
setTimeout("expandboard()",tickspeed)
}
function startbill(){
while (document.getElementById("billboard"+totalDivs)!=null)
totalDivs++
if (document.getElementById("billboard0").filters)
tickspeed+=effectduration
expandboard()
}
if (window.addEventListener)
window.addEventListener("load", startbill, false)
else if (window.attachEvent)
window.attachEvent("onload", startbill)
else if (document.getElementById)
window.onload=startbill
</script>
<script>
function rp(json) {
document.write('<div id="blogbegowrapper">');
for (var i = 0; i <= json.feed.openSearch$totalResults.$t - 1; i++) {
document.write('<div id="billboard' + i + '" class="billcontent">');
var entry = json.feed.entry[i];
var posttitle = entry.title.$t;
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k <= entry.link.length - 1; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
posttitle = posttitle.link(posturl);
var readmorelink = "(more)";
readmorelink = readmorelink.link(posturl);
var postdate = entry.published.$t;
var cdday = postdate.substring(0,4);
var cdmonth = postdate.substring(5,7);
var cdyear = postdate.substring(8,10);
var monthnames = new Array();
monthnames[1] = "Jan";
monthnames[2] = "Feb";
monthnames[3] = "Mar";
monthnames[4] = "Apr";
monthnames[5] = "May";
monthnames[6] = "Jun";
monthnames[7] = "Jul";
monthnames[8] = "Aug";
monthnames[9] = "Sep";
monthnames[10] = "Oct";
monthnames[11] = "Nov";
monthnames[12] = "Dec";
if ("content" in entry) {
var postcontent = entry.content.$t;
} else if ("summary" in entry) {
var postcontent = entry.summary.$t;
} else
var postcontent = "";
var re = /<\S[^>]*>/g;
postcontent = postcontent.replace(re, "");
document.write(posttitle);
if (showpostdate == true)
document.write('<br/>');
document.write(cdyear + ' ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
if (showpostsummary == true) {
document.write('<br><br/>');
if (postcontent.length <= numchars -1) {
document.write(postcontent);
} else {
postcontent = postcontent.substring(0, numchars);
var quoteEnd = postcontent.lastIndexOf(" ");
postcontent = postcontent.substring(0,quoteEnd);
document.write(postcontent + '...' + readmorelink);
}
}
document.write('</div>');
}
document.write('</div>');
}
</script>
<script>
var showpostdate = true;
var showpostsummary = true;
var numchars = 150;
</script>
<script src="http://blogbego-creation.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rp"></script>

Ganti URL saya dengan URL Blog kawan
Simpan Blog kawan dan lihat hasilnya :z 


Kalau ada yang kurang jelas pada Artikel
» Slide Daftar Isi Plus Summary
diatas atau seandainya ada Link yang rusak bisa disampaikan lewat Komentar
mudah-mudahan saya bisa segera memperbaiki


0 komentar

Posting Komentar


KREASI KOLOM - © Copyright 2012 - All rights reserved
Powered by Blogger