Jumat, 28 September 2012

Pasang Widget Melayang di Postingan Tertentu

widget melayang

Bosan dengan widget melayang itu-itu saja yang selalu muncul di seluruh halaman ??

Di halaman berjudul "baca 1" widget melayangnya sama dengan widget melayang yang ada di halaman berjudul "baca 2". Begitu juga di halaman "baca 3", widget melayangnya itu lagi, itu lagi.

Mengapa tidak membuat widget melayang yang berbeda saja ?? Jadi, masing-masing postingan terdapat widget melayang nya masing-masing.

Agan tinggal salin kode berikut ini, tetapi ingat jangan mengedit kode yang bukan warna merah. Hanya kode yang warna merah saja yang bisa di edit.

<style type="text/css">

#topbar{
position:absolute;
border: 1px solid black;
padding: 1px;
background-color: lightyellow;
width:
380px;
visibility: hidden;
z-index: 100;
}

</style>


<script type="text/javascript">

/***********************************************
* Floating Top Bar script-
* Sliding routine by Roy Whittle
* This notice must stay intact for legal use.
* Visit http://ketagihanbaca.blogspot.com/ for full source code
***********************************************/

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 = 70 //set x offset of bar in pixels
var startY = 15 //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()", 30);
 }
 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>
<br />
<div id="topbar">
<a href="" onclick="closebar(); return false"><img src="http://www.cityandfinancial.com/shop/img/icon_close.png" border="0" /></a>

MASUKKAN KONTEN DI SINI
</div>

Ganti lah angka 380 untuk menyesuaikan lebar.
Ganti teks MASUKKAN KONTEN DI SINI itu dengan konten milik Agan.

Letak pemasangannya adalah di dalam postingan, tepatnya di tool "HTML" (sebelah Compose). Lakukan cara yang sama jika Agan ingin menerapkan di postingan lainnya.

Selamat mencoba.

Tidak ada komentar: