Kamis, 31 Maret 2011 | By: Faris Setiawan Bastomi

Buku tamu

Assalamu'alaikum teman-teman, wah, sudah lama banget yah gag ngepos artikel? maklum, kan lagi persiapan buat ngadepin unas nieh, ni mumpung lagi suntuk dan jenuh banget buat belajar, sedikit mau bagi ilmu tentang biki buku tamu, buku tamu tu kaya' yang dulu pernah saya post, yaitu Cara membuat kotak Shoutbox, ya sejenis itulah, nah tapi kali ini pengen saya buat jadi lebih menarik, disembunyiin dikit gitu, biar keren, hehehe,,,
langsung aja yah ke caranya, , ,

  1. Masuk ke tab Rancangan
  2. kemudian tambah gadget
  3. lalu pilih html/javascript
  4. masukkan kode html berikut

    <style type="text/css">
    #gb{
    position:fixed;
    top:50px;
    z-index:+1000;
    }
    * html #gb{position:relative;}

    .gbtab{
    height:100px;
    width:30px;
    float:left;
    cursor:pointer;
    background:url('http://lh4.ggpht.com/_jn57XA2jLxY/SmCHl1YEsxI/AAAAAAAAAXQ/HshHClEVcvY/tabs.png') no-repeat;
    }
    .gbcontent{
    float:left;
    border:2px solid #A5BD51;
    background:#F5F5F5;
    padding:10px;
    }
    </style>

    <script type="text/javascript">
    function showHideGB(){
    var gb = document.getElementById("gb");
    var w = gb.offsetWidth;
    gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
    gb.opened = !gb.opened;
    }
    function moveGB(x0, xf){
    var gb = document.getElementById("gb");
    var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
    var dir = xf>x0 ? 1 : -1;
    var x = x0 + dx * dir;
    gb.style.right = x.toString() + "px";
    if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
    }
    </script>

    <div id="gb">

    <div class="gbtab" onclick="showHideGB()">   </div>

    <div class="gbcontent">

    (kode buku tamu kamu)

    Mau punya buku tamu seperti ini?<br/>
    Klik di
    http://bastomi.blogspot.com/2011/03/buku-tamu.html

    </a>

    <div style="text-align:right">
    <a href="javascript:showHideGB()">
    [tutup]
    </a>
    </div>

    </div>

    </div>

    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.right = (30-gb.offsetWidth).toString() + "px";
    </script>

  5. Simpan
pada bagian (kode buku tamu kamu), ganti dengan kode yang kamu peroleh saat kamu membuat shoutboxmu, , ,
sekarang lihat blogmu dan, , ,

Voila, ada sesuatu yang baru?
Enjoy!!!
(^_^)

    Read more >> >
    Selasa, 01 Maret 2011 | By: Faris Setiawan Bastomi

    Slide Show Recent Posts

    Kali ini, mbahas tentang gadget favorit saya, hehehe, ,
    Bikin postingan terbaru, tapi d buat slide show, keren kan? hehehe, , ,
    Gini nieh caranya,

    1. Masuk ke Rancangan
    2. Tambah gadget
    3. pilih HTML/Javascripts
    4. Copast kode berikut


      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
      <style type="text/css" media="screen">
      <!--

      #spylist {
      overflow:hidden;
      margin-top:5px;
      padding:0px 0px;
      height:350px;
      }
      #spylist ul{
      width:220px;
      overflow:hidden;
      list-style-type: none;
      padding: 0px 0px;
      margin:0px 0px;
      }
      #spylist li {
      width:208px;
      padding: 5px 5px;
      margin:0px 0px 5px 0px;
      list-style-type:none;
      float:none;
      height:70px;
      overflow: hidden;
      background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
      border:1px solid #ddd;
      }

      #spylist li a {
      text-decoration:none;
      color:#4B545B;
      font-size:11px;
      height:18px;
      overflow:hidden;
      margin:0px 0px;
      padding:0px 0px 2px 0px;
      }
      #spylist li img {
      float:left;
      margin-right:5px;
      background:#EFEFEF;
      border:0;
      }
      .spydate{
      overflow:hidden;
      font-size:10px;
      color:#0284C2;
      padding:2px 0px;
      margin:1px 0px 0px 0px;
      height:15px;
      font-family:Tahoma,Arial,verdana, sans-serif;
      }

      .spycomment{
      overflow:hidden;
      font-family:Tahoma,Arial,verdana, sans-serif;
      font-size:10px;
      color:#262B2F;
      padding:0px 0px;
      margin:0px 0px;
      }

      -->
      </style>

          <script language='JavaScript'>

      imgr = new Array();

      imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

      imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

      imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

      imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

      imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
      showRandomImg = true;

      boxwidth = 255;

      cellspacing = 6;

      borderColor = "#232c35";

      bgTD = "#000000";

      thumbwidth = 70;

      thumbheight = 70;

      fntsize = 12;

      acolor = "#666";

      aBold = true;

      icon = " ";

      text = "comments";

      showPostDate = true;

      summaryPost = 40;

      summaryFontsize = 10;

      summaryColor = "#666";

      icon2 = " ";

      numposts = 10;

      home_page = "http://www.bastomi.blogspot.com/";

      limitspy=4
      intervalspy=4000

      </script>

      <div id="spylist">
          <script src='http://scriptabufarhan.googlecode.com/svn/trunk/recentpostthumbspy-min.js' type='text/javascript'></script>
      </div>
    5. Simpanlah!!

    Ganti  http://www.bastomi.blogspot.com/ dengan alamat blog kamu, dan , ,
    Voila!!!
    Enjoy, , ,
    (^_^)
    Read more >> >

    Salju pada pointer

    Wah, lagi kena demam salju nieh yang punya blog, hahaha, gara-gara requestnya banyak saljunya sieh, jadi ketularan nieh,,,
    Kali ini saljunya ada di pointer, waktu di gerakin, pointermu akan bersalju dan akan semakin dingin, hahaha,,,
    Langsung aja, gini caranya,,,
    1. Sama kaya yang sebelumnya, ke Rancangan
    2. Tambah Gadget
    3. HTML/Javascripts
    4. Copast deh kode di bawah nie,,,
      <script type='text/javascript'>
      // <![CDATA[
      var colour="black";
      var sparkles=100;

      var x=ox=400;
      var y=oy=300;
      var swide=800;
      var shigh=600;
      var sleft=sdown=0;
      var tiny=new Array();
      var star=new Array();
      var starv=new Array();
      var starx=new Array();
      var stary=new Array();
      var tinyx=new Array();
      var tinyy=new Array();
      var tinyv=new Array();
      window.onload=function() { if (document.getElementById) {
      var i, rats, rlef, rdow;
      for (var i=0; i<sparkles; i++) {
      var rats=createDiv(3, 3);
      rats.style.visibility="hidden";
      document.body.appendChild(tiny[i]=rats);
      starv[i]=0;
      tinyv[i]=0;
      var rats=createDiv(5, 5);
      rats.style.backgroundColor="transparent";
      rats.style.visibility="hidden";
      var rlef=createDiv(1, 5);
      var rdow=createDiv(5, 1);
      rats.appendChild(rlef);
      rats.appendChild(rdow);
      rlef.style.top="3px";
      rlef.style.left="0px";
      rdow.style.top="0px";
      rdow.style.left="3px";
      document.body.appendChild(star[i]=rats);
      }
      set_width();
      sparkle();
      }}
      function sparkle() {
      var c;
      if (x!=ox || y!=oy) {
      ox=x;
      oy=y;
      for (c=0; c<sparkles; c++) if (!starv[c]) {
      star[c].style.left=(starx[c]=x)+"px";

      star[c].style.top=(stary[c]=y)+"px";
      star[c].style.clip="rect(0px, 5px, 5px, 0px)";
      star[c].style.visibility="visible";
      starv[c]=50;
      break;
      }
      }
      for (c=0; c<sparkles; c++) {
      if (starv[c]) update_star(c);
      if (tinyv[c]) update_tiny(c);
      }
      setTimeout("sparkle()", 40);
      }
      function update_star(i) {
      if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
      if (starv[i]) {
      stary[i]+=1+Math.random()*3;
      if (stary[i]<shigh+sdown) {
      star[i].style.top=stary[i]+"px";
      starx[i]+=(i%5-2)/5;
      star[i].style.left=starx[i]+"px";
      }
      else {
      star[i].style.visibility="hidden";
      starv[i]=0;
      return;
      }

      }
      else {
      tinyv[i]=50;
      tiny[i].style.top=(tinyy[i]=stary[i])+"px";
      tiny[i].style.left=(tinyx[i]=starx[i])+"px";
      tiny[i].style.width="2px";
      tiny[i].style.height="2px";
      star[i].style.visibility="hidden";
      tiny[i].style.visibility="visible"
      }
      }
      function update_tiny(i) {
      if (--tinyv[i]==25) {
      tiny[i].style.width="1px";
      tiny[i].style.height="1px";
      }
      if (tinyv[i]) {
      tinyy[i]+=1+Math.random()*3;
      if (tinyy[i]<shigh+sdown) {
      tiny[i].style.top=tinyy[i]+"px";
      tinyx[i]+=(i%5-2)/5;
      tiny[i].style.left=tinyx[i]+"px";
      }
      else {


      tiny[i].style.visibility="hidden";
      tinyv[i]=0;
      return;
      }
      }
      else tiny[i].style.visibility="hidden";
      }
      document.onmousemove=mouse;
      function mouse(e) {
      set_scroll();
      y=(e)?e.pageY:event.y+sdown;
      x=(e)?e.pageX:event.x+sleft;
      }
      function set_scroll() {
      if (typeof(self.pageYOffset)=="number") {
      sdown=self.pageYOffset;
      sleft=self.pageXOffset;
      }
      else if (document.body.scrollTop || document.body.scrollLeft) {
      sdown=document.body.scrollTop;
      sleft=document.body.scrollLeft;
      }
      else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
      sleft=document.documentElement.scrollLeft;
      sdown=document.documentElement.scrollTop;
      }
      else {
      sdown=0;
      sleft=0;
      }
      }
      window.onresize=set_width;
      function set_width() {
      if (typeof(self.innerWidth)=="number") {
      swide=self.innerWidth;
      shigh=self.innerHeight;
      }
      else if (document.documentElement && document.documentElement.clientWidth) {
      swide=document.documentElement.clientWidth;
      shigh=document.documentElement.clientHeight;
      }
      else if (document.body.clientWidth) {
      swide=document.body.clientWidth;
      shigh=document.body.clientHeight;
      }
      }
      function createDiv(height, width) {
      var div=document.createElement("div");
      div.style.position="absolute";
      div.style.height=height+"px";
      div.style.width=width+"px";
      div.style.overflow="hidden";
      div.style.backgroundColor=colour;
      return (div);
      }
      // ]]>
      </script>
    5. Simpan
    Lihatlah blogmu sekarang, gerakkan sedikit pointermu dan, , ,
    Voila!!! brrr, dingin!!!
    Enjoy!!!
    (^_^)


    Read more >> >

    Efek salju second version

    Kali ini efek salju khusus warna putih, semoga lebih memuaskan dan bisa lebih bermanfaat, karena script yang lama sepertinya sudah agak bermasalah, hehehe, , ,

    1. Masuk ke Rancangan
    2. Tambah Gadget
    3. Pilih HTML/JavaScripts
    4. Copast aja kode berikut
      <script type="text/javascript" src=" http://www.geocities.com/furhan3476/furhan.snow.js"><br />/***********************************************<br />* Diambil dari furhanm.blogspot.com<br />* Snow Effect without images-by Kurt Grigg at http://www.btinternet.com/~kurt.grigg/javascript<br />* Script featured & available at Dynamic Drive at http://www.dynamicdrive.com/<br />* Please keep this notice intact<br />***********************************************/</script>
    5. Simpan
    Sekalian minta maaf dengan script yang lama, semoga yang kali ini tidak mengecewakan, dan lihatlah blogmu sekarang, ,
    Voila!!
    Enjoy!!!
    (^_^)



    Read more >> >

    Cara Membuat Komentar Terbaru

    Pengen gag artikel kamu komentarnya rame? Pasti pengen kan,,,
    Nah,biar orang-orang tau siapa aja n artikel mana aja di blog kamu,
    gimana kalo di kasih komentar terbaru jadi salah satu widget di blog kamu?
    Gini caranya, , ,




    1. Masuk ke Rancangan
    2. Tambah Gadget
    3. Masukkan kode di bawah ini
      <ul><script style="text/javascript">
      function showrecentcomments(json) {
      for (var i = 0; i < 5; i++) {
      var entry = json.feed.entry[i];
      var ctlink;
      if (i == json.feed.entry.length) break;
      for (var k = 0; k < entry.link.length; k++) {
      if (entry.link[k].rel == 'alternate') {
      ctlink = entry.link[k].href;
      break;
      }
      }
      ctlink = ctlink.replace("#", "#comment-");
      var ptlink = ctlink.split("#");
      ptlink = ptlink[0];
      var txtlink = ptlink.split("/");
      txtlink = txtlink[5];
      txtlink = txtlink.split(".html");
      txtlink = txtlink[0];
      var pttitle = txtlink.replace(/-/g," ");
      pttitle = pttitle.link(ptlink);
      if ("content" in entry) {
      var comment = entry.content.$t;}
      else
      if ("summary" in entry) {
      var comment = entry.summary.$t;}
      else var comment = "";
      var re = /<\S[^>]*>/g;
      comment = comment.replace(re, "");
      document.write('<li>');
      document.write('<a href="' + ctlink + '">' + entry.author[0].name.$t + '</a>');
      document.write(' on ' + pttitle);
      document.write('<br/>');
      if (comment.length < 100) {
      document.write(comment);
      }
      else
      {
      comment = comment.substring(0, 100);
      var quoteEnd = comment.lastIndexOf(" ");
      comment = comment.substring(0, quoteEnd);
      document.write(comment + '...<a href="' + ctlink + '">(more)</a>');
      }
      }
      document.write('</li>');
      document.write('<div style="font-size:75&percnt;;text-align:center"><a href="http://blogtutormaster.blogspot.com/2009/02/How-to-make-recent-comment.html">Get this Widget</a></div>');
      }
      </script>
      <script src=http://URLblogkamu.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments>
      </script></ul>

    4. Simpan

    ganti http://URLblogkamu.blogspot.com dengan alamat blog kamu sendiri
    Lihat blog kamu sekarang dann,
    Voila!! Enjoy, , ,
    (^_^)
    Read more >> >