cara membuat poluler post berjalan kebawah

     malam sob,, Popular post merupakan artikel yang sering dibaca para pembaca pada sebuah blog. popular post ini biasanya ditampilkan di sebelah kanan atau kiri atau di bawah sebuah postingan sesuai keiginan kita. ada beberapa fmodel widget popular post yang sering ditampilkan adalah dengan memasang kode HTML/Java Scipt agar popular post bisa berjalan kebawah seperti pada blog saya ini. Hal ini tentu akan meambah tampilan blog kita menjadi lebih menarik.

langsung saja ikuti langkah dibawah bila ingin mencoba :

Berikut caranya :

1. Masuk ke Blog
2. Pilih Rancangan
3. Tambah Gadget "Entri Popular" ( Jika gadget entri popular/ popular post sudah ) langsung saja menuju>
4. Tambah Gadget "HTML java scrip"
5. Copy kode di bawah ini dan paste pada gadget HTML java scrip tadi

<style type="text/css" media="screen">

#PopularPosts1 {
 overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:600px;
    
}

#PopularPosts1 ul {
width:342px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}

#PopularPosts1 li {
 width:334px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:80px;
overflow: hidden;
background:#fff url() repeat-x;
border:1px solid #ddd;
}

#PopularPosts1 li .item-title {
    color:#A5A9AB;
    font-size:1em;
    margin-bottom:0.5em;
}

#PopularPosts1 li .item-title a {
 text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}

#PopularPosts1 li img {float:left;margin-right:5px;background:#EFEFEF;border:0;}

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

#PopularPosts1 .item-snippet a,
#PopularPosts1 .item-snippet a:visited {color:#3E4548;text-decoration: none;}

#PopularPosts1 .spyWrapper {height: 100%;overflow: hidden;position: relative;}

#PopularPosts1 {-webkit-border-radius: 5px; -moz-border-radius: 5px;}

.tags span,
.tags a {-webkit-border-radius: 8px; -moz-border-radius: 8px;}

a img {border: 0;}
-->
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(function () {
    $('.popular-posts ul').simpleSpy();
});
</script>
<script src="http://bangjefri-code.googlecode.com/files/popularpost.js" type="text/javascript"></s

6.  Gadget "HTML java scrip  jangan di kasih nama sob, lagsung saja klik simpan

Read More

memubuat iklan melayang menutupi post dengan klik 2x close

malem sob, saya akan ngepost sebah cara jitu untuk meningkatakn penghasilan PPC, yaitu dengan cara memasang iklan melayang menutupi artikel atau posting, tapi dampak melakuan cara ini adalah pengunjung menjadi malas berkunjung ke blog kita karena menambah timing untuk mengklik iklan melayang tue..kesimpulanya... semua tergantung kepada sobat, mau mencoba-coba Cara Membuat Iklan Melayang dengan 2 Kali Klik Close, langsung ajah ikuti langkah di bawah :

1. Seperti biasa, buka Akun blog kawan.
2. Masuk ke Tata Letak / Rancangan 
3. Pilih Tambah Gadget / Add Widget
4. Pilih elemen HTML/Javascript
5. Copylah Scrip di bawah ini, lalu paste ke Gadget / widget yang ingin anda tambahkan tadi.

<style type="text/css">

#gb{ position:fixed; top:10px; z-index:+1000; } * html
#gb{position:relative;} .gbcontent{ float:left;margin-left:220px; border:2px solid #bb0000; background:#eeeeee; 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.top = x.toString() + "px"; if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} }
</script>
<div id="gb">
<div class="gbtab" onclick="showHideGB()">
</div>
<div class="gbcontent">
<div style="text-align: right;">
<a href="javascript:showHideGB()"> .:[Close][Klik 2x]:. </a> </div>
<center> 

silahkan tempatkan kode iklan

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

6. Simpat Gadget / Widget yang barusan anda buat.
7. Simpan Template anda. Lalu publikasikan. Lihat Hasilnya.


NB: 

• Silahkan ganti huruf yang berwarna biru dengan angka sesuai posisi yang anda inginkan.
• Silahkan ganti huruf yang berwarna merah dengan kode iklan, kode banner yang anda inginkan.

Read More

cara memberi efek terlipat di blog

kalai in saya akan memberikan script untuk memebuat efek terlipat dalam blog, ok" langsung ajahh di coba dan ikuti langkah - langkah di bawah :

1. login ke blogger
2. pilih template atau rancangan
3. pilih edit html
4. Beri centang pada Expand Template Widget, cari kode </head>,Gunakan Ctrl+F utuk memudahkan mecari code.copy code dibawah ini dan letakan di atas code </head>.
5. copy script ini =>>   <SCRIPT  type='text/javascript'>var tujuan  ='http://goombesh.blogspot.com/'</SCRIPT><SCRIPT  src='http://goombesh.googlecode.com/files/page_peel_efect.js '  type='text/javascript'/>

Catatan : Ubah alamat link http://gooombesh.blogspot.com/ menjadi alamat link yang sobat kehendaki. kalo udah simpan deh. dan lihat hasilnya. 

NB: Jika widget ini tidak berfungsi mungkin sobat ada melakukan kesalahan dalam proses.jika sobat sudah melakukan langkah2 dengan benar, tapi masih tidak berfungsi.berarti template blog sobat tidak bisa memakai widget ini.

Read More

membuta efek gambar berputar di blog

tampilan blog memang perlu karena tampilan blog yang cantik dan menarik akan membuat pengunjung blog kita betah berlama lama Stand by di blog kita. Cara Membuat Gambar Berputar Tersentuh Cursor

Cara Membuat Gambar Berputar Tersentuh Cursor :

• Login Blogger

• Edit Template expand template widget Cari kode  ]]></b:skin>

• Letakkan kode di bawah ini di atas kode   ]]></b:skin>

1.  Gambar berputar d posting blog

 post img{-o-transition: all 1s ease;-moz-transition: all 1s ease;-webkit-transition: all 1s ease;}
.post img:hover{-o-transform: scale(1.2) rotate(360deg) translate(0px);-moz-transform: scale(1.2) rotate(360deg) translate(0px);-webkit-transform: scale(1.2) rotate(360deg) translate(0px);-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease;} 

2. Gambar berputar dan membesar di posting blog

.post img{-o-transition: all 1s ease;-moz-transition: all 1s ease;-webkit-transition: all 1s ease;}
.post img:hover{-o-transform: scale(1.2) rotate(360deg) translate(0px);-moz-transform: scale(1.2) rotate(360deg) translate(0px);-webkit-transform: scale(1.2) rotate(360deg) translate(0px);-o-transition: all 1.5s ease;-moz-transition: all 1.5s ease;-webkit-transition: all 1.5s ease;}

3. Semua gambar berputar

.img{-webkit-transition:all 1s ease-in-out;-moz-transition:all 1s ease-in-out;-o-transition:all 1s ease-in-out;transition:all 1s ease-in-out}
.img:hover{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}

4.hanya gambar commen

.comment img{-o-transition: all 1s ease;-moz-transition: all 1s ease;-webkit-transition: all 1s ease;}
.comment img:hover{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}

Read More

membuat efek banjir di blog

kali ini saya akan memosting artikel untuk mendesain blog yaitu membuat efek banjir d dalam blog, langsung ajah ke permasalahannya:

1. Masuk ke dasbor

          >>piilih rancangan
          >>masuk tata letak
          >>addd Gadget
          >>pilih html/javascript
          >>copy paste code di bawah ini

<script language="javascript">
nd_mode="flood";
nd_vAlign="bottom";
nd_hAlign="right";
nd_vMargin="10";
nd_hMargin="10";
nd_target="_blank";
</script>
<script language="javascript" src="http://raxterblog.googlecode.com/files/efekbanjirdiblog.js"></script>

nb: tulisan yang warna merah untuk mengedit ukuran seseui selerah anda

Read More

Cara Membuat iklan melayang di tengah

kali ini saya akan memosting  cara Membuat iklan melayang di tengah, baik saya ngak panjang lebar langsung ajah...

1. login ke blog kalian
2. Klik rancangan atau design
3. tambahkan widget
4. dan pilih html/javascript
5. copy dan paste code dibawah ini

<style type="text/css">

#topbar{

position:absolute;

left:9px;

border: 2px red;

padding: 2px;

background-color: #f2f2f2;

width: 350px;

visibility: hidden;

z-index: 100;

}

</style>

<script type="text/javascript">

var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session

var startX = 30 //set x offset of bar in pixels

var startY = 5 //set y offset of bar in pixels

var verticalpos="fromtop" //enter "fromtop" or "frombottom"

function iecompattest(){

return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body

}

function get_cookie(Name) {

var search = Name + "="

var returnvalue = "";

if (document.cookie.length > 0) {

offset = document.cookie.indexOf(search)

if (offset != -1) {

offset += search.length

end = document.cookie.indexOf(";", offset);

if (end == -1) end = document.cookie.length;

returnvalue=unescape(document.cookie.substring(offset, end))

}

}

return returnvalue;

}

function closebar(){

if (persistclose)

document.cookie="remainclosed=1"

document.getElementById("topbar").style.visibility="hidden"

}

function staticbar(){

 barheight=document.getElementById("topbar").offsetHeight

 var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;

 var d = document;

 function ml(id){

  var el=d.getElementById(id);

  if (!persistclose || persistclose && get_cookie("remainclosed")=="")

  el.style.visibility="visible"

  if(d.layers)el.style=el;

  el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};

  el.x = startX;

  if (verticalpos=="fromtop")

  el.y = startY;

  else{

  el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;

  el.y -= startY;

  }

  return el;

 }

 window.stayTopLeft=function(){

  if (verticalpos=="fromtop"){

  var pY = ns ? pageYOffset : iecompattest().scrollTop;

  ftlObj.y += (pY + startY - ftlObj.y)/8;

  }

  else{

  var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;

  ftlObj.y += (pY - startY - ftlObj.y)/8;

  }

  ftlObj.sP(ftlObj.x, ftlObj.y);

  setTimeout("stayTopLeft()", 10);

 }

 ftlObj = ml("topbar");

 stayTopLeft();

}

if (window.addEventListener)

window.addEventListener("load", staticbar, false)

else if (window.attachEvent)

window.attachEvent("onload", staticbar)

else if (document.getElementById)

window.onload=staticbar

</script>

<div class="clear"></div>

<div id="topbar">

<div style="text-align:right">

<a style="color: rgb(255, 0, 0); font-weight: bold; font-style: italic;" href="" onclick="closebar(); return false"><span><button>TUTUP (X)</button></span></a></div><a style="font-weight: bold; color: black(51, 255, 51);">

</a><p><a style="font-weight: bold; color: black(51, 255, 51);" title=""><h2><center>Terima Kasih Sudah Berkunjung Di Like Ya Gan.</center></h2></a>

</p>

<left><table style="width: 700px; height: 50px;" border="0"><tbody><tr><td style="vertical-align: top;">

<center>

MASUKKAN KODE IKLAN YANG DIINGINKAN DI SINI atau kode facebook page

</center>

<p></p><p></p></td></tr></tbody></table></left></div>

6. simpan

Read More