Cara Membuat Widget Atikel Terbaru Di Blog






Cara membuat widget artikel terbaru di blog.Pada kali ini mrul ingin berkongsi tips untuk membuat widget artikel terbaru yang di cipta oleh jQuery.

Kelebihannya :

1.Memiliki penampilan yang menarik.
2.Memiliki load yang cukup pantas.
3.Boleh digunakan di tab menu atau new window
4.Terdapat informasi jumlah komen di setiap artikel yang di munculkan.
5.Gambar yang menarik n cantik serta banyak kelebihannya.


Langkah-langkah membuat widget artikel terbaru :

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.

<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 = 298;
cellspacing = 8;
borderColor = "#ffffff";
bgTD = "#000000";
thumbwidth = 40;
thumbheight = 40;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = false;
summaryPost = 40;
summarFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 5;
home_page = "http://mrul-tips.blogspot.com/";
</script>
<script src="http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js" type="text/javascript"></script>


6.Save.

Nota : -Gantikan pekataan yang berwarna merah dengan link blog anda.
          -Perkataan yang berwarna biru adalah jumlah artikel yang ingin di paparkan.


Selamat Mencuba….

Cara Mengembalikan Navbar Di Blog

Kali ini mrul ingin berkongsi tip blog..tips blog kali ini adalah cara mengembalikan navbar di blog.

Langkah-langkah mengembalikan navbar :

1.Sign blog anda.
2.klik Design.
3.Klik Edit HTML.
4.Cari kod dibawah ini.untuk mempermudahkan pencarian tekan ctrl + f.


#navbar-iframe {
display: none !important;
}

Jika kod diatas tidak ada pada template anda, maka cari kod dibawah.

#navbar-iframe{ height:0px; visibility:hidden;
display:none}

5.Jika anda telah jumpa kod dibawah ini, hapus kod berikut.
6.Klik preview untuk melihat hasilnya.
7.Jika anda berpuas hati, klik Save Template.

Selamat Mencuba…

Cara Memasang Lazy Load





Pada kali ini mrul ingin berkongsi tips meringankan proses loading image.Lazy Load adalah plugin jQuery dimana efek lazy load akan menangguh proses loading bagi image yang ada pada blog.Efek load hanya akan berfungsi apabila page di scroll.Image selepas page yang di scroll akan terpapar dengan menggunakan efek jQuery Lazy Load.Untuk melihat Demo, sila klik di sini.

Lazy Load akan membantu meringankan blog anda dengan mengurangkan tempoh masa proses loading page pada sesebuah blog terutama pada blog yang banyak memaparkan image yang bersaiz besar.

Langkah-langkah memasang jQuery Lazy Load di blog :

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.


<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript' src='https://sites.google.com/site/jquery01/jquery.lazyload.mini.js?ver=1.5.0'></script>
<script type="text/javascript">
jQuery(document).ready(function($){
if (navigator.platform == "iPad") return;
jQuery("img").lazyload({
effect:"fadeIn",
placeholder: "http://3.bp.blogspot.com/_LZtXSNcp76A/THkEtEOZfrI/AAAAAAAABRo/IARVMD_8TwA/s1600/grey.gif"
});
});
</script>

6.Save.

Selamat mencuba…

Cara Membuat Sitemap



Langkah-langkah membuat sitemap :

1.Sign blog anda.
2.Pilih New Post.
3.Klik Edit HTML.


4.Copy kod dibawah ini, paste di dalamnya.


<script src="https://sites.google.com/site/herzafencom/daftar-isi-blog.txt">
</script>
<script src="http://mrul-tips.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">

</script>


5.Sebelum PUBLISH POST,jangan lupa meletakkan tajuk SITEMAP atau apa sahaja mengikut pilihan anda.
6.Pilih POST OPTIONS dan tukarkan tarikh menjadi tarikh lama.

Nota : Gantikan pekataan yang berwarna merah dengan link blog anda.

Selamat Mencuba...

Cara membuat Iklan Melayang Tanpa Tekan Close



Cara membuat iklan melayang tanpa tekan close.Sebelum ini saya pernah menerangkan cara membuat iklan melayang.

Langkah-langkah membuat iklan melayang tanpa tekan close :

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.

<div style="text-align: center; position: fixed; top: 0px; right: 0px;"><center>
Iklan yang ingin dipaparkan
</center></div>

6.Save.

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

Selamat Mencuba..

Cara Mudah Membuat Gambar Animasi Di Blog

Kepada penguna blogger yang ingin membuat penampilan blog yang dilengkapi gambar animasi yang menarik.Untuk membuatnya gambar animasi hendaklah mempunyai aplikasi yang menyokong, serta kita harus memahami design grafiknya, aturan penampilan dan pelbagai lagi untuk membuat gambar animasi.

Tetapi anda tidak perlu risau kerana untuk membuat itu sangatlah senang, sebagai contoh anda dapat membuat tulisan ala ninja dan membuat cerita dan pelbagai lagi.

Contoh :



Anda tertarik untuk membuatnya?..Ikut langkah-langkah dibawah :

1.Buka link ini.
2.Pilih gambar animasi yang anda inginkan.
3.Masukan text tulisan yang di inginkan.
4.Klik Generate.
5.Copy kod dibawah tulisan ini “To embed the image on your website or blog use the HTML code below”.
6.Sign blog anda.
7.Klik Design.
8.Klik Add a Gadget.
9.Klik HTML / Javascript.
10.Paste kod yang anda copy tadi di HTML / Javascript.
11.Save.

Selamat mencuba…

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...

TinGaLkan Jejak