Cara Membuat Iklan Melayang




Langkah-langkah membuat iklan melayang :

1.Sign blog anda.
2.Klik Design.
3.Klik Add a Gadget.
4.Klik HTML / Javascript.
5.Copy kod dibawah ini dan paste di HTML / Javascript.



<style type="text/css">


#topbar{
position:absolute;
left:9px;
border: 2px red;
padding: 2px;
background-color: #FFFFFF;
width: 750px;
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>CLOSE</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>Klik Iklan DiBawah Ini. Terimakasih</center></h2></a>


</p>
<left><table style="width: 700px; height: 50px;" border="0"><tbody><tr><td style="vertical-align: top;">
<center>
IKLAN MELAYANG DISINI

</center>

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


6.Save.

Nota : Gantikan perkataan yang berwarna merah dengan ikan yang ingin dipaparkan.

Selamat Mencuba...

»»  READMORE...

Cara Membuat Kata Penutup

Assalamualikum semua..kali ini mrul ingin berkongsi tips cara membuat kata penutup.Dahulu saya pernah menerangkan cara membuat kata sambutan.Tips kali ini akan muncul saat pengunjung menutup blog anda.

Langkah-langkah membuat kata penutup :

1. Sign blog anda.
2. Klik Design.
3. Klik Edit HTML.
4. Klik tanda pada kotak “Expand widget template”.
5. Cari kod ini </head>.
6. Copy kod dibawah dan paste selepas kod </head>.

<script type='text/javascript'>
// goodbye alert
function goodbye(){
alert('Tulis kata penutp disini');
}
parent.window.onunload=goodbye;

</script>

Nota : Gantikan teks berwarna merah dengan kata penutup yang anda ingin tampilkan.

7. Save.

Selamat Mencuba…

»»  READMORE...

Cara Membuat Link Membesar Dan Berwarna-Warni

 Langkah-langkah membuat link membesar dan berwarna-warni :

1. Sign blog anda.
2. Klik Design.
3. Klik Edit HTML.
4. Klik tanda pada kotak “Expand widget template”.
5. Cari kod ini a:hover.
6. Copy kod dibawah dan paste selepas kod a:hover.

{ color: #00FFFF; text-transform: uppercase; font-weight: bolder; font-size: 20px; background-image: url(http://i27.tinypic.com/2626vyh.jpg); }

Contoh:
a:hover{ color: #00FFFF; text-transform: uppercase; font-weight: bolder; font-size: 20px; background-image: url(http://i27.tinypic.com/2626vyh.jpg); }

7. Save.

Selamat Mencuba…
»»  READMORE...

Cara Membuat Tap View Menu Tanpa Edit HTML




Anda tertarik dengan widget ini..??
Top of Form
Isi menu tab view 1
Isi menu tab view 2
Isi menu tab view 3
Bottom of Form


Kali ini mrul ingin berkongsi tips cara membuat tap view menu dengan cara yang  berbeza dan pastinya lebih mudah. Tap view menu yang akan saya kongsi  buat kali ini tidak perlu melakukan Edit HTML pada template blog anda.

Langkah-langkah membuat tap viem menu tanpa Edit HTML :

1. Sign blog anda
2. Klik Design.
3. Klik Add a Gadget.
4. Klik HTML / Javascript.
5. Copy kod dibawah ini, paste pada kotak HTML / Javascript.



<style type="text/css">
div.TabView div.Tabs
{height: 30px;overflow: hidden}
div.TabView div.Tabs a {float:left; display:block; width: 98px; /* Lebar Menu Utama Atas */
text-align:center ; height: 30px; /* Tinggi Menu Utama Atas */
padding-top:8px; vertical-align:middle; border:1px solid #BDBDBD; /* Warna border Menu Atas */
border-bottom-width:0; text-decoration: none; font-family: "Verdana", Serif; /* Font Menu Utama Atas */
font-weight:bold; color:#000; /* Warna Font Menu Utama Atas */ -moz-border-radius-topleft:10px; -moz-border-radius-topright:10px}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active {background-color: #7CFC00; /* Warna background Menu Utama Atas */ }
div.TabView div.Pages {clear:both; border:1px solid #7CFC00; /* Warna border Kotak Utama */ overflow:hidden; background-color:#DDA0DD; /* Warna background Kotak Utama */ }
div.TabView div.Pages div.Page {height:100%; padding:0px; overflow:hidden}
div.TabView div.Pages div.Page div.Pad {padding: 5px 5px}
</style>

<script src="http://aldi7.googlecode.com/files/tapmenuview.js" type="text/javascript">
</script>

<br />
<form action="tabview.html" method="get">
<div class="TabView" id="TabView">
<div class="Tabs" style="width: 300px;">
<a href="http://www.blogger.com/post-create.g?blogID=3995369456552620237">Tajuk 1</a>
<a href="http://www.blogger.com/post-create.g?blogID=3995369456552620237">Tajuk 2</a>
<a href="http://www.blogger.com/post-create.g?blogID=3995369456552620237">Tajuk 3</a>
</div>
<div class="Pages" style="height: 250px; width: 300px;">
<div class="Page">
<div class="Pad">
Isi menu tab view 1
</div>
</div>
<div class="Page">
<div class="Pad">
Isi menu tab view 2
</div>
</div>
<div class="Page">
<div class="Pad">
Isi menu tab view 3
</div>
</div>
</div>
</div>
</form>
<script type="text/javascript">
tabview_initialize('TabView');
</script>



Nota :Gantikan teks berwarna biru dengan tajuk yang anda ingin tampilkan.
           Isikan menu yang ingin ditampilkan di teks berwarna merah.



6.Save.


Selamat Mencuba..
»»  READMORE...

Membuat Menu Melayang Pada Blog



Pelbagai macam cara dilakukan para blogger untuk menjimatkan ruang blognya salah satunya dengan Kotak blogger, Namun tips kali ini untuk menjimatkan halaman kita dengan membuat menu melayang. Menu ini dapat ditampilkan di bagian kiri mahu pun di bahagian kanan blog.


Langkah-langkah membuat Menu melayang pada blog :

1. Sign blog anda.
2. Klik Design.
3. Klik Edit HTML.
4. Cari kod ini </head>.
5. Copy kod dibawah dan paste sebelum kod  </head>.


<script src='http://elmubarok.googlecode.com/files/floating1.js' type='text/javascript'/>
<script>
YOffset=40;
XOffset=0;
staticYOffset=30;
slideSpeed=20
waitTime=100;
menuBGColor=&quot;red&quot;;
menuIsStatic=&quot;yes&quot;;
menuWidth=150;
menuCols=2;
hdrFontFamily=&quot;verdana&quot;;
hdrFontSize=&quot;2&quot;;
hdrFontColor=&quot;black&quot;;
hdrBGColor=&quot;#7dd03a&quot;;
hdrAlign=&quot;left&quot;;
hdrVAlign=&quot;center&quot;;
hdrHeight=&quot;15&quot;;
linkFontFamily=&quot;Verdana&quot;;
linkFontSize=&quot;2&quot;;
linkBGColor=&quot;white&quot;;
linkOverBGColor=&quot;#cafaa9&quot;;
linkTarget=&quot;_top&quot;;
linkAlign=&quot;Left&quot;;
barBGColor=&quot;red&quot;;
barFontFamily=&quot;Verdana&quot;;
barFontSize=&quot;2&quot;;
barFontColor=&quot;white&quot;;
barVAlign=&quot;center&quot;;
barWidth=20; // no quotes!!
barText=&quot;My MENU&quot;;


// ----- Mulai Edit Menu
ssmItems[0]=[&quot;Assalamualaikum&quot;] //Header Menu
ssmItems[1]=[&quot;Home&quot;, &quot;/&quot;, &quot;&quot;]
ssmItems[2]=[&quot;Tips Blog&quot;, &quot;http://mrul-tips.blogspot.com/search/label/Tips%20Blog&quot;,&quot;&quot;]
ssmItems[3]=[&quot;List Blog&quot;, &quot;http://mrul-tips.blogspot.com/2010/02/list-blog_02.html&quot;,&quot;&quot;]
ssmItems[4]=[&quot;Tips Komputer&quot;, &quot;http://kawe88.blogspot.com&quot;, &quot;_new&quot;]
ssmItems[5]=[&quot;Free Templates&quot;, &quot;http://www.finalsense.com/services/blog_templates/&quot;, &quot;_new&quot;]
ssmItems[6]=[&quot;Free backgrounds&quot;, &quot;http://www.thecutestblogontheblock.com/free/free-backgrounds.html&quot;, &quot;_new&quot;]
ssmItems[7]=[&quot;Blog Tok Guru&quot;, &quot;http://www.blogtokguru.com/&quot;, &quot;_new&quot;]

buildMenu();
//----- Selesai Edit Menu
</script>

Nota :Gantikan teks warna biru dengan tajuk mengikut keinginan anda dan teks warna merah URL yang ingin anda tuju.
Bagi anda yang ingin menambah tajuk dimenu hanya menambah kod dibawah ini sebelum kod buildMenu(); .

ssmItems[8]=[&quot;Blog Tok Guru&quot;, &quot;http://www.blogtokguru.com/&quot;, &quot;_new&quot;]



6. Save.


Selamat Mencuba...

»»  READMORE...