Memasang auto hide Shout Box pada sisi kanan blog

Untuk membina fungsi auto hide kotak Shout Box pada sisi kanan blog, seperti yang boleh anda lihat di sini (klik), sila ikut beberapa langkah di bawah.

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

Langkah 2

Salin kod biru di bawah dan paste pada notepad. Gantikan teks Masukkan kod Shout Box di sini dengan kod Shout box anda.

<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('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiP0kpqRDZjIKaJETXi7Wz612bW0so4hKste96ftNfBODaw_dWapxAcniT_3_9oKw71eTATkJyuaqAUrmmfKZF6KW1G_bkMSmeLt4mXAybRAP4r2otD1WDuLoZFBHFTk4hWg1eCrbZDaZs/s320/tabs.png') no-repeat;

}

.gbcontent{

float:left;

border:2px solid #666666;

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

Masukkan kod Shout Box di sini

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

<a href="javascript:showHideGB()">

[close]

</a>

</div>

</div>

</div>

<script type="text/javascript">

var gb = document.getElementById("gb");

gb.style.right = (30-gb.offsetWidth).toString() + "px";

</script>

Langkah 3

Salin kod yang telah siap di edit pada notepad tadi (rujuk langkah 2) dan paste pada Content HTML/Javascript (rujuk langkah 1).

Akhir sekali klik Preview dan jika anda berpuas hati dengan hasilnya, klik saja Save.

Gengblogger.com - Komuniti terhangat untuk blogger Malaysia

Rasanya sudah terlewat untuk gua tulis entri mengenai Gengblogger.com kerana mungkin dah ramai diantara kita yang tahu apa itu Gengblogger.com. Kalau ada yang anggap gua tulis entri tentang Gengblogger.com sebab nak masuk pertandingan mencipta tagline untuk Gengblogger.com, pun gua dah ketinggalan zaman sebab pemenang pun dah diumumkan. Tapi gua terpanggil untuk mempromosi Gengblogger.com kerana gua merasakan yang kita semua patut tahu mengenainya jika kita ingin menjana traffic pada blog kita.

Gengblogger adalah sebuah komuniti yang dibangunkan oleh Cik Ben serta di bantu oleh Miss Izah dan Erin Farina untuk para blogger mempromosikan blog dan juga entri mereka di situ. Hanya dengan mendaftar dan kemudiannya klik Ping blog anda, maka kita dapat mempromosikan blog serta menjana traffic ke blog kita. Di Gengblogger.com juga kita dapat berkenal-kenalan, bertukar pandangan dan pendapat dan jika ada rezeki pada yang bujang-bujang, mungkin dapat bertemu jodoh.

Pada mulanya, gua menganggap Gengblogger hanyalah  sekadar tempat untuk mempromosikan blog. Kena daftar, lepas tu pasang banner dan kemudian, tunggu kelulusan jika kita sudah mematuhi semua syarat-syarat yang telah ditetapkan. Gua pun berdaftar di Gengblogger. Hanya sekadar berdaftar kerana pada mulanya, gua membayangkan yang Gengblogger juga sama seperti promote site yang lain. Langsung tidak memberikan apa-apa impak. Hanya sekadar memberikan janji-janji manis. Cakap boleh naikkan traffic lah, itulah inilah.Tapi langsung tidak membantu.

Setelah gua baca banyak entri yang bercerita dengan ayat kipas-mengipas Gengblogger ,di tambah dengan hasutan beberapa orang reader yang ajak gua join Gengblogger(padahal gua lagi awal dah daftar), maka gua masuk buat kali yang kedua. Nak tengok betulkah apa yang di gembar-gemburkan oleh blogger lain atak hanya sekadar sesi kipas-mengipas. "Phewww..Memang terbaik dan cukup meriah". (Ayat kipas-mengipas) .Tak sama macam masa pertama kali gua menjejakkan diri gua di situ. Sangat berbeza.

Macam-macam entri terpapar dari blogger yang dah berdaftar gua tengok ada disitu. Dari entri menceritakan tentang ketidakadilan sistem Kapitalis Amerika yang semakin meruncing, cerita aktiviti makan-makan hinggalah cerita tentang aktiviti menukar lampin bayi di paparkan di situ. Gua jadi teruja. Gua cuba ingat semula apa login ID dan Password gua. Nasib baik gua ingat lagi. Gua klik pula pada ayat Ping blog anda. Sekali lagi didalam hati gua berkata, "Phewww..Entri gua ada kat situ". Gua jadi kembang hidung dan hilang pertimbangan sekejap. Lepas saja gua Ping, gua tengok jumlah visitor pada blog gua naik mendadak. Traffic gua jadi tak tentu hala, lampu merah bertukar jadi hijau.

Inilah tempat yang selama ini gua cari untuk promosi blog gua. Sekarang, setiap kali gua update entri blog gua, gua akan ping di Gengblogger.com.

Gua yakin Gengblogger.com akan mendapat sembutan yang lebih menggalakkan pada masa akan datang dari blogger tempatan. Jadi, marilah kita sama-sama memeriahkan lagi dunia blogger tempatan dengan menjadi salah seorang dari komuniti di Gengblogger.com. Gua yakin, siapa yang dah mendaftar akan setuju dengan pendapat gua.

p/s: Entah kenapa baru sekerang gua tergerak nak tulis tentang Gengblogger ni. Mungkin juga mood gua untuk post entri tentang tutorial dah semakin kelaut. Mungkin juga gua akan bertukar angin dengan menulis sajak, syair, pantun atau cerita kanak-kanak.

Cara mudah tukar background pada blog

Terdapat satu cara paling mudah jika kita ingin menukar background blog kita. Jika kita menggunakan template classic, kita boleh menukar background asal yang biasanya berwarna hitam ataupun putih kepada background berformat image pattern yang berulang. Template baru juga boleh menggunakan cara yang sama, tetapi ianya bergantung kepada struktur background tersebut. Jika ia menggunakan background warna, cara ini boleh di gunakan.

Anda boleh memilih background image yang terpapar di bawah ini atau menggunakan image anda sendiri. Tetapi, image tersebut mestilah pattern berulang. Tidak digalakkan menggunakan image bersaiz besar kerana ia hanya akan membebankan proses loading blog anda.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiKZgfqThcUsKRfcSToRFjz4waxZKozyYxBWcTMYtaU1V2xGPUWlILml9niF7pYel0RNHbNx85vGOReaRtzPGH79PceU5oI02mZTfRgY-ujqWnbROzXnbge_otdT7jRTjUtKE1YVrP/s200/body-bg.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgNYKvQjvmAhxQAw95e6G5G_amNw-YQwDA3MftZqTWtyxq9U7m9D0qwaOw1w-frRGANq73bDSkxJGdYFAI-NbLW6b8_Ruh2yQJUG8SOLcIa_6xpllbAuI9m4Gp3UIaeRFXDXgP3GXUo/s200/fd-san.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgq1yKs7eSA3czSJovgna9ywMjQdbhJNJAHCL9qiO96xH08-5wHZ_t4tfjpBoPhnko7chRgrqW6d922yyTJyxQIbu-HkEuxOKYQEgB84F7mowE1tdz8efbys97k5adhmZcuc7Ac3oSY/s200/fd-babydisney.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPzDxoNEmGqMvuRCRBkoQvN4155FlK1hcIFzBKCRVwTF-UNeQB7rib7JXWNCq7iG9bMdeajJ85agCMnoUL3hXqd02t33CIqOggtkeXdI-8134Y9B80jvDK2iFFzaZoL_XO-Fk1Ryx5/s200/woodbg.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7tsWY-CFMW6QDBiBzLVU-CygCR4hQM0qCXEg2I4AbCH4WiXIJLXjNL0KFiFVDde5bR7_iPrM99GKY-AeCYeGq0cMoAEtKiLL4Dy0LNddCxkRbKIXMri5h0CS-mBAwstjnQlb175wC/s200/vector-seamless-hearts-background-09-by-dragonart.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaGS6v45mySdzZ8jYpQq6aDjI56-csHYMgrLCRz5of3iGPo8JhY0kkjtfpNCz1E1UEjZlWIUa-5VDaRtnGECToa0QMO_52F9QQtF9fgCwJ59raF3n_5RK1eX-rzMlE1h9HlvmxYEyB/s200/vector-flower-squares-background-11-by-dragonart.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsoxL8DeDuyNYGrCSI4WHNQkdolZ-RPPEIMF8pIUl4sdaNWsBZmZLllGl4C5ivrqCEP8zojHerueYa6XpO8dB8pCdjvLvc5IZhH4PnId3qI4PJ8f0z3kvbCbjTEAB5U0t8_nw3YczB/s200/img01.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYet7tyU37JOgrQe6aEH0ZJlBnK2GpB3oxBOdy5B1Rim5NwilWLqkIhZX-bduJSzUjRw6OV6IyuOQVCti8GiuAvIzrbEEOZk0Z2dP13EHrjAJNYfB1WLOIUeweL_NlHIcToDrcm1wP/s200/contemporary-300x300.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiSB1uDgLhhXqvTyA11AZVDYbOOPjWMlTgkoMATx4A46DVGIgBFtadodKA20S_EFzPT0pFjS73bl6lte-O43uUAgpOIHmGmROf4hNwS5TDYfTdKDBF0rRClA-zIxk6TAZ_0OAhV88Q/s200/bgx.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiBMMKnT9ZeDCQ2y1hR6RGRxOD5Oo0qxcNkHOsmmZc7lLIaZvWIbZzyXrKJDZws0GfLHJvEE3UrtSXJiQEFrz9mQvzrWTlAxEtee9h7ebHx0fMqYYuOT3rX4cZu_T2a3zgnfUw620oi/s200/0003a-background.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUFn1jmw72GLKX6b3ZAdtzyKrVfazBVV6OCw0VM70LlF8SFlI55DmGo3fF25Px-7Guunj6nq4gcrXEvJ6KKnkwvt_TI-GEhae4MnwoKEu_GF5CEmiyz4e4U2a6ZMKSOMXoy39cq9G1/s200/img01.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7KXJ9IZgLiV1kBbW6-7JBzUdxIPCC0RzNCQGxgyvOlUiT1Os86Vr1znNf8JIHSllGRj7nT-lgXpL5i2DWeoKg3ZxkOa37tUBeDRhrCUHAePGBio4FI5b_c55Njo50eq8elo8Si4M-/s200/cork.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTZ3M4bPI5J7a0wyfcWFkCFvFDQc_X_9kyRquR43ku16x5ILjuC2bs_iTmNJXP6cqxVWRWITug4Zo05njsR0pOyLw-yd8dc3ofcpYnAYxjQOOYa8Trpxb21W29iu5oyMNYXp0LL2Ev/s200/Vintage-Pattern_Black.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpoBz3p74dTmRklYMUZUPHs-x61dCH1Szhe4zrIZAwD67sWeLrxoMLkpz3jfx6gKQSCqSFfs1nlT8uyBjYu31wVsG6ewsz7MQeay7QiDYUO87teOMKi5XdaS9_Y7Ebi305a-dRQtAr/s200/sexy-blogs.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIVhm7rrXSlqtM3AuZZUuo2VtakroHKAWWOt09YUelzkO_Ek5ycf6XcwrnVQBbHm8N9o33XBJubZCdXI5HzLjLWHyqs2UA2GlGOW47XU1S2gVug5MViSBWcQMJziQ_mfrgxjNy-8J_/s200/seamless-tiled-floral-pattern-vector-background.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh25WodJmHbJuQrgBuLMstkAo212fufkb43uz9HIoNHWjbCZUSkriPfbKIUNoys50O-24iHOugqn6liiGUScBYeEZB-FFCjH1g6x_qJHIsIdyAu5v9FoyzPtD_K8K1M0LUp9cpUwxXl/s200/img01(2).gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-NHJ_DyNSDiRxqaUEDhyphenhyphenrPTZdsVJ_BIl7BI8wXUigEZOcOk8oWFXyHlydM1sWamGe54km70mhdnBOARIRxfiwEL5y4UAXRrYth8wPoorOD_AT2X_oA7zbOE3-XPvlYEJBCaDiN-18/s200/cork.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihQZ5nn4HQwehMHu64_XDe3yebfQHFgZaw00-WuU9M1gvmpjOzJpmkoFluGdlfMZrz5kz6yfwor6bTqGw9zKLAebCk5aduaoYYPiMVMjTw9NX100cULHQttPfuhMDiQqkPfY5io0SV/s320/bgshowcase.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIqnfnrLUZ2m-YCKVGhrRu9iqDWlejVUn5CeCsrcrjGt-bMUhfV5tPDEwXYFhX6gRdrrCnVdaGVMJ-8vzJiCZKJNA0MSgIYPwoRHzLKOj1X1Gbw27-PAyaOfKc-KSdJQgxT26pqvdD/s320/bgr_main.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoo0iWEbJdddaRGZQCRNk-9_hd0LEoyvCkzR5kuyVf8qj0NJQbCNOlOx48ra1ji3uG35zJvuHop5sCI7OYUKW9rnFdY1DHBsuAzqbspm236Kex5TIJPnolTAQxC2KAOVLFjkZm4y0A/s320/16-10_dark_sleek_blog_07.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimSOIOyQLbJ9_wJzVVyake08tCrz4k0seXBNdl5NJE7X8nSJq4w3V7-RuU9PxS1RIFnFAWr2Ok17-2d0zvvRi-lrlUN0Q3cWjL57614Rw4lxo-K9tNGmtvDB9ZCE7lapFFYrcijLm2/s320/bg.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaZ9e96vNxGc_IqFumDRPaP_e3q3N_OGvjs2LRhoxfgRxZ1Onzo3ueW4TTVVW4ENV1HQ-RHrfzoTovG8x-JNmhAZMQCKpQ0edxftPZiyoFkp0uO7Js0B_zswXVcvCFre1VQb5Y5KCa/s320/bg1.gif

Untuk memasang background yang terpapar di atas, sila ikut beberapa langkah mudah di bawah.

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

Langkah 2

Salin kod berwarna biru di bawah dan edit pada notepad dengan menggantikan teks Masukkan URL background di sini dengan URL background yang tertertera pada image di atas atau URL background anda sendiri.

<script type="text/javascript">
var background= new Array()
background="Masukkan URL background di sini"
document.write("<style>");
document.write("body {");
document.write(' background:url("' + background + '") repeat top center;');
document.write(" }");
document.write("</style>");
</script>

Langkah 3

Salin kod yang telah siap di edit (rujuk langkah 2) dan paste pada Content HTML/Javascript.

Akhir sekali klik Preview dan jika anda berpuas hati dengan background tersebut, klik saja Save.

Sites terbaik untuk download template blog percuma

Sites terbaik untuk download template blog

Jika anda ingin mendapatkan template-template blog yang menarik dan tidak tahu dimana untuk mendapatkannya, di bawah ini tersenarai 12 sites yang menyediakan template blog secara percuma. Anda boleh memilih template mana yang di rasakan menarik dan sesuai mengikut citarasa anda sendiri.

http://www.bietemplates.com

http://www.finalsense.com

http://btemplates.com

http://www.dantearaujo.net/search/label/Free%20Template

http://www.ourblogtemplates.com

http://www.mytemplatebox.com

http://www.forfreebloggertemplates.com

http://www.bloggertemplatesfree.com

http://www.eblogtemplates.com/templates/blogger-templates

http://www.deluxetemplates.net

http://www.bloggerblogtemplates.com

http://www.chethstudios.net/2009/01/roundup-of-best-blogger-templates.html

Memasang Recent posts slider pada blog

Recent posts slider seperti yang boleh anda lihat pada blog ini (Entri Terkini) sememangnya widget yang sangat menarik. Widget tersebut akan memaparkan tajuk post beserta thumbnil (image) secara rotation.

Untuk memasang widget recent post slider ini pada blog anda, sila ikut beberapa langkah di bawah.

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

Langkah 2

Salin kod di bawah dan paste pada ruang Content HTML/Javascript (rujuk langkah 1). Sila edit kod yang di bold mengikut kesesuaian blog anda.

width:280px;  (lebar kotak)
width:262px;  (lebar teks pada kotak)
background:#FFFFFF;  ( background kotak)
color:#A32929;  (Warna teks)
numposts = 20;  (Bilangan tajuk post yang ingin dipaparkan)
home_page = "http://Masukkan URL blog anda disini.blogspot.com/";  ( URL blog anda)


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

#spylist {
overflow:hidden;
margin-top:5px;
margin-bottom:-20px;
padding:0px 0px -20px 0px;
height:350px;
}
#spylist ul{
width:280px;
overflow:hidden;
float:center;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:262px;
padding: 2px 2px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#FFFFFF;
border:1px solid #ddd;
}

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

.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:0px;
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 = " ";

showPostDate = false;

showcomments = false;

summaryPost = 40;

summaryFontsize = 10;

summaryColor = "#666";

icon2 = " ";

numposts = 20;

home_page = "http://Masukkan URL blog anda disini.blogspot.com/";

limitspy=4
intervalspy=4000

</script>

<div id="spylist">
<script src="http://sites.google.com/site/testingsahaja/recentpostslide.js?attredirects=0&d=1" type="text/javascript"></script>
</div>

Akhir sekali, klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save.

Cara ban IP address visitor

Oleh kerana ramai reader yang bertanya, macam mana nak ban IP visitor dari terlepas masuk ke blog mereka, maka terpaksa juga di postkan entri ini. Untuk apa dan kenapa mesti di ban IP visitor, hanya mereka yang bertanya sahaja tahu jawapannya.

Terdapat beberapa cara yang boleh digunakan untuk ban IP address visitor dari masuk ke blog kita. Cara yang biasa digunakan adalah dengan cara online atau manual. Walaubagaimanapun, cara tersebut hanya berkesan jika visitor itu menggunakan STATIC IP. Untuk makluman, kebanyakan pengguna internet di Malaysia, menggunakan DYNAMIC IP di mana, ianya akan berubah-ubah setiap masa. Tetapi jika anda ingin juga mencubanya, bolehlah terus membaca entri ini.

Bagi cara manual, Apa yang penting sekali adalah, mendapatkan IP address visitor yang hendak di ban itu. Kita hanya perlu masukkan IP address yang lengkap pada javascript di bawah dan paste pada script template. Jika IP address yang di masukkan itu tidak lengkap, berkemungkinan besar, visitor yang lain menggunakan range yang sama mungkin turut di ban. Sila pastikan anda mendapat IP address yang betul-betul tepat dan lengkap.

Untuk memasang javascript untuk ban IP address visitor, sila ikut beberapa langkah di bawah.

p/s: 1. Save script template sebagai backup.
      2. IP address yang handak di ban.

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML.

Langkah 2

Dengan menggunakan keyboard, tekan kekunci Ctrl + F dan taip atau paste kod <head> pada ruang Find dan seterusnta tekan kekunci Enter.

Langkah 3

Salin kod biru dibawah dan edit pada notepad. Masukkan senarai IP address visitor yang hendak di ban pada angka yang di bold.

Sebagai contoh:

IP address visitor= 100.100.001.001
Di tulis pada kod = banned _ip[0] = '100.100.001.001';

Tambah banned_ip [4] = '0.0.0.0'; jika bilangan IP address visitor yang hendak di ban itu lebih daripada 4.

<script type="text/javascript" src="http://code.vietwebguide.com/php/addr.php"></script>

<script type="text/javascript">

//&lt;!CDATA[

// Banned ip script 2.0

//(C)2009 Anhvo

//homepage: http://vietwebguide.com

var banned_ip = new Array();

banned_ip[0] = '0.0.0.0';

banned_ip[1] = '0.0.0.0';

banned_ip[2] = '0.0.0.0';

banned_ip[3] = '0.0.0.0';

var mes_bi = "IP anda telan di ban oleh blog ini. Harap maklum !";

for(var i=0;i&lt;banned_ip.length;i++) {

eval('var re = /^' + banned_ip[i] + '/ ;');

  if (re.test(mc_user_ip))

  {

    document.write('&lt;style type="text/css"&gt;');

    document.write('BODY{display:none;}');

    document.write('&lt;\/style&gt;');

 alert(mes_bi);

   break;

 }

}

//]]&gt;

</script>

Langkah 4

Salin kod yang telah siap di edit pada notepad tadi dan paste di bawah atau selepas kod <head> (rujuk langkah 2)

Akhir sekali, klik preview dan jika tiada mesej Error yang terpapar, klik saja Save.

Untuk mencubanya, anda boleh ban IP anda sendiri dan lihat, adakah ianya berkesan pada anda.

P/S: Mungkin ada di antara kita yang tahu cara yang lebih berkesan dan terbaik bagaimana nak ban DYNAMIC IP pada blog. Kalau tahu, sila kongsi pada mereka-mereka yang nak sangat tahu. Gua malas nak ambil tahu.Hehe.

Adakah blog kita mesra Google search engine (SEO)?

Terdapat cara yang paling mudah untuk tentukan adakah blog kita mesra search engine terutamanya Google atau sekadar mesra alam.  Bemula dari URL blog,  tajuk blog,  tajuk entri atau artikel,  tulisan dalam entri atau artikel dan juga komen yang di beri oleh visitor atau reader. Semuanya boleh tersenarai dalam result search engine jika kita hanya sekadar mempunyai asas dalam skil SEO.

Untuk tentukan yang blog kita mesra Google search engine ataupun tidak, bolehlah cuba trik yang tersenarai di bawah.

1. Taipkan URL blog kita pada kotak  Google Search dan tekan butang Search.  Seterusnya lihat apakah result yang terpapar. Adakah URL blog kita mesra Google Search engine.

Contoh: maribinablog.blogspot.com

2. Taipkan tajuk blog kita pada kotak Google Search dan tekan butang Search. Seterusnya lihat apakah result yang terpapar. Adakah tajuk blog kita mesra Google Search engine

Contoh: bina blog | buat blog | tutorial blogspot | blog info

3. Taipkan mana-mana tajuk entri atau artikel yang ada pada blog kita pada kotak Google search. Seterusnya lihat apakah result yang terpapar. Adakah tajuk entri atau artikel blog kita mesra Google Search engine.

Contoh: Adakah blog kita mesra Google search engine (SEO)?

4. Taipkan mana-mana teks atau perkataan yang ada pada entri atau artikel blog kita. Bermula dari 6 patah perkataan dan kemudian dikurangkan kepada 5 patah perkataan hinggalah 3 patah perkataan. Adakah entri atau artikel blog kita mesra Google Search engine.

Contoh:  blog kita mesra Google search engine (6 patah perkataan)
              blog kita mesra Google search           (5 patah perkataan)
              blog kita mesra Google                     (4 patah perkataan)
              blog kita mesra                                 (3 patah perkataan)

5. Taipkan mana-mana teks atau perkataan pada komen yang di beri oleh visitor atau reader blog kita. Bermula dari 6 patah perkataan dan kemudian dikurangkan kepada 5 patah perkataan hinggalah 3 patah perkataan.

Komen dari entri Memasang Iklan Nuffnang pada setiap post.

Contoh:   suke2. sblm ni malas nak wat (6 patah perkataan)
               suke2. sblm ni malas nak       (5 patah perkataan)
               suke2. sblm ni malas             (4 patah perkataan)
               suke2. sblm ni                       (3 patah perkataan)

p/s: Untuk komen, biasanya spider google memang lambat nak crawl. Kalau nak cuba, sila guna komen yang ada pada post yang lama atau post pertama kita. Pastikan kita dah ubah dari nofollow kepada dofollow pada setting bahagian komen. Default setting untuk blog yang berdomain blogspot adalah nofollow.

Secara kesimpulannya, jika blog kita tersenarai pada senarai top 10 pada kebanyakkan  hasil dari search tadi, terutamanya untuk pages from Malaysia, maka blog kita sememangnya blog yang mesra Google search engine untuk peringkat Malaysia.

Kering idea. Perlukah copy paste entri orang lain semata-mata nak update?

Gua kadang-kadang pelik dengan sikap segelintir blogger yang tak ada idea langsung nak tulis, tapi dalam kepala otak ingat nak update saja. Sebabnya, nak tambah banyak entri dalam blog di samping nak tarik traffic.

Kita tak boleh bagi alasan yang kita baru lagi. Hatta kalau kita dah lama sekalipun, mesti kena berpegang teguh pada prinsip dan etika.

Terus terang gua katakan yang gua tak ada hal dan tak kisah (kisah juga sedikit-sedikit) kalau sesiapa saja yang nak copy entri gua. tak nak letak kredit pun tak apa, tapi yang paling penting, edit semula dengan ayat sendiri. Nak ambil tutorial gua letak dalam blog sendiri, di persilakan, tapi editlah dengan step sendiri. Bukan copy and paste. Janganlah ambil jalan mudah walaupun memang mudah. Dengan hanya select, copy and paste. Kemudian tekan butang Post. "Tahniah, anda sudah berjaya update blog anda. Sila Ping"..

Jangan ingat yang orang lain tak perasan perbuatan kita. Sebenarnya senang sangat nak kesan benda-benda macam ni. Google search jawapannya. Tapi nak buat macam mana, tak semua blogger memegang prinsip dan etika blogger. Tindakan yang asal boleh dan blog pun asal boleh dan lebih kurang halal. Yang penting, nak naikkan traffic.

Bertambah jelek dan meggelikan hati, apabila gua baca macam-macam nasihat dan tazkirah yang ala-ala penceramah jemputan macam dalam TV tiap-tiap petang Jumaat pada blog-blog yang copy and paste ini, siap ada mutiara kata kelip-kelip, tapi hakikatnya, diri sendiri tak terkesan langsung dengan mutiara kata sendiri dan tulisan yang ala-ala ceramah dan tazkirah itu. Memang memunaikan. Gua saspek, entri ceramah pun di copy paste. Kalau di Selangor, dah kena tindakan oleh JAIS sebab bagi ceramah tak ada permit. Nasib baik tulis pada blog. Guna permit lori pun lepas lagi.

Banyak lagi cara sebenarnya kalau kita nak update blog kita walaupun kita dah kering dan kontang dengan idea. Gua cadangkan, olahlah buku-buku cerita semasa kita melalui zaman kanak-kanak yang indah, contohnya seperti cerita Sang Kancil, Kerengga jatuh dalam sungai minta tolong, Burung Bangau dengan seekor Ketam, Kura-Kura dan Arnab atau apa saja cerita yang mungkin mampu menarik traffic. Di TV juga banyak cerita-cerita yang seperti itu, tetapi dalam versi Indonesia. Contohnya seperti Bawang Putih Bawang Merah, Liliput dengan Kelinci dan entahlah apa lagi. Gua tak tengok. Gua cuma baca intisari rancangan saja. Yang penting, Sekar bukan cerita kanak-kanak.

Kalau kita nak copy and paste tanpa edit entri tersebut, cara yang terbaik, letaklah kredit. Kalau tuannya nampak pun, senyumlah juga. Walaupun sekadar senyum kambing. Tak adalah rasa nak marah-marah. Tak pasal-pasal berperang pulak. Nanti mulalah, berbalas entri macam berbalas pantun nak masuk meminang.

Akhir kata dari gua, guna hati, akal dan fikiranmu. Bukan dalam kepala ingat nak update saja. Gua bukan marah, tapi nasihat dengan bahasa dan cara gua sendiri. Kalau terasa, senyum sudahlah.

p/s: Patutlah gua tengok pada page counter gua, ada yang copy image kat blog gua, gua ingatkan nak simpan dalam henset atau dalam frame sangkut pada dinding rumah. Rupanya ada mesin fotostat di sebalik blog gua. Patutlah blog gua, seminggu dua ni macam berat saja. Gua saspek mesin fotostat jenama RICOH.

Gua terharu, ramai juga yang minat pada entri gua. Ambillah. Apa yang penting bukan kerjasama, tapi EDIT. Jangan jadi burung kakak tua. Orang komen nanti tak boleh nak jawab. Jalan mudah, DELETE. Lagi Punai.

Membina Image magnify atau zoom in image pada blog

Apabila kita meletak image pada entri dan visitor klik pada image tersebut, ia akan menyebabkan visitor langsung terkeluar dari blog kita. Ada yang menambah kod target="_blank" supaya image di buka pada window yang baru.

Cara yang lebih mudah dan menarik ialah dengan menggunakan fungsi image magnify. Image magnify adalah satu fungsi di mana ia akan mengubah saiz image menjadi lebih besar apabila image tersebut di klik. Ianya seperti fungsi zoom in. Untuk lebih jelas lagi, anda boleh klik pada image yang terpapar di sini.(sila klik)

Untuk memasang fungsi image magnify ini, sila ikut beberapa langkah di bawah.

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya, klik pada HTML/Javascript

Langkah 2

Salin kod berwarna biru di bawah dan pastekan selepas atau di bawah ruang Content HTML/Javascript (rujuk langkah 2)

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script>
<script src='http://sites.google.com/site/javascript10/resizeimage.js' type='text/javascript'></script>

Akhir sekali, klik Preview dan jika tiada mesej Error terpapar, klik saja Save.

Langkah 3

Image yang telah di upload pada post perlu di edit kodnya dan di tambah dengan kod class="magnify". Untuk mengedit kod image, ianya hendaklah dilakukan pada Edit Html . (rujuk gambar di bawah)




Untuk mengedit kod image, anda boleh rujuk contoh di bawah.

Kod image sebelum di edit.

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-n2zokx6__nvfZ4YZsxIXJD3FkU9KERIPt77useWPyi4-6MEkE32M9aA1xIRaTwUMlxnT-lUky-98iHDI5Jdmt8m6AL4pogHfZZNAaiahkgclWhrPkHqdQJUMzvxRDRaEnXoaN7fNY_k/s400-h/forest+wallpaper21.jpg"><img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 300px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-n2zokx6__nvfZ4YZsxIXJD3FkU9KERIPt77useWPyi4-6MEkE32M9aA1xIRaTwUMlxnT-lUky-98iHDI5Jdmt8m6AL4pogHfZZNAaiahkgclWhrPkHqdQJUMzvxRDRaEnXoaN7fNY_k/s400/forest+wallpaper21.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5419303430522971714" /></a>

Kod image selepas di edit dan di tambah kod class="magnify"

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-n2zokx6__nvfZ4YZsxIXJD3FkU9KERIPt77useWPyi4-6MEkE32M9aA1xIRaTwUMlxnT-lUky-98iHDI5Jdmt8m6AL4pogHfZZNAaiahkgclWhrPkHqdQJUMzvxRDRaEnXoaN7fNY_k/s400/forest+wallpaper21.jpg" class="magnify" />

p/s: Hanya ulangi langkah 3 untuk zoom in image yang lain pada post.

Memasang widget Popular Posts atau Top Posts pada blog

Widget popular post atau top post seperti yang boleh di lihat pada bahagian bawah kanan blog ini memaparkan senarai tajuk yang mempunyai jumlah komen yang tertinggi. Widget popular post atau top post ini sememangnya sangat membantu terutamanya kepada readers yang mungkin ingin membaca entri atau artikel yang mempunyai jumlah komen yang tinggi pada blog kita.

Untuk memasang widget popular posts atau top posts ini, sila ikut beberapa langkah dibawah.

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Jsvascript.

Langkah 2

Salin kod biru di bawah dan paste pada ruang Content HTML/Javascript (rujuk langkah 1). Masukkan URL blog anda pada teks masukkan URL blog anda di sini. Angka 10 yang di bold boleh di edit mengikut bilangan tajuk yang ingin adda senaraikan.

<script language="JavaScript">
aBold = false;
numposts=1000;
maxshowresult=10;
home_page = "http://masukkan URL blog anda di sini/";
</script>
<script src="http://sites.google.com/site/testingsahaja/toppost.js" type="text/javascript"></script>
Akhir sekali klik Preview dan jika tiada mesej Error terpapar, klik saja Save.

Apa itu keyword?

Apa itu Keyword?

Keyword adalah perkataan atau teks ringkas yang di taip pada search engine dan juga pada sebuah entri atau artikel yang di tulis dalam sebuah web atau blog. Keyword yang di tulis pada search engine akan dipadankan dengan perkataan atau teks yang ada pada nama web atau blog, tajuk entri atau artikel dan tulisan pada entri atau posting, tetapi ianya sangat bergantung pada cara bagaimana kita mengeksploitasi sesuatu keyword dan kekerapan keyword itu di ulang  pada entri atau artikel yang ada pada blog.

Biasanya keyword yang di taip pada search engine, lebih dari satu  perkataan. Sebagai contoh, perkataan 'keyword'. Kita mengandaikan seseorang akan menaip perkataan Apa itu keyword? pada kotak search engine seperti google. Di sini, kita boleh mengeksploitasi perkataan Apa itu keyword? dengan menjadikannya sebagai tajuk entri atau artikel dan memaksimakan tiga perkataan tersebut pada isi didalam entri atau artikel.


Apa pentingnya keyword ?

Keyword merupakan salah satu cara yang digunakan untuk mendapatkan visitor atau pengunjung melalui search engine. Jadi, setiap keyword yang kita tulis pada entri atau artikel didalam blog kita adalah merupakan  undangan  secara tidak langsung untuk mereka masuk ke blog kita. Jika kita ingin cuba mendapatkan visitor padasearchengine,gunakanlah keyword dengan sebaik-baiknya.

p/s: Untuk lebih memahami entri ini, sila taipkan perkataan  Apa itu keyword? atau Apa pentingnya keyword? atau keyword itu apa? pada Google search engine.

Membina fungsi auto read more pada setiap post

Berbeza dengan fungsi read more versi lama, di mana kita terpaksa meletak kod <span class="fullpost"></span> pada setiap entri yang kita tulis, fungsi auto read more yang boleh anda lihat pada blog ini sememagnya memudahkan lagi tugas kita. Tidak perlu lagi untuk kita letakkan kod <span class="fullpost"></span> pada setiap entri. Fungsi ini telah di set secara auto dengan javascript di mana setiap entri akan di di set kepada read more. Image yang ada pada entri akan di resizekan kepada saiz yang kecil dan di letakkan pada sebelah kiri. Fungsi ini juga akan menghadkan secara auto jumlah teks yang akan dipaparkan pada satu entri.

Untuk membina fungsi auto read more ini, sila ikut beberapa langkah di bawah.

p/s: Sila save script template anda terlebih dahulu sebagai backup.

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML. Seterusnya, tick pada kotak Expand Widget Templates.

Langkah 2

Dengan menggunakan keyboard, tekan Ctrl+ F. Seterusnya, taip atau paste kod </head> pada ruang Find dan kemudian tekan Enter.

Langkah 3

Salin kod yang berwarbna biru di bawah dan pastekan di atas atau sebelum kod </head>

<script type='text/javascript'>

var thumbnail_mode = "float" ;

summary_noimg = 350;

summary_img = 450;

img_thumb_height = 140;

img_thumb_width = 140;

</script>

<script type='text/javascript'>

//<![CDATA[

/*
*/

function removeHtmlTag(strx,chop){

if(strx.indexOf("<")!=-1)

{

var s = strx.split("<");

for(var i=0;i<s.length;i++){

if(s[i].indexOf(">")!=-1){

s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);

}

}

strx = s.join("");

}

chop = (chop < strx.length-1) ? chop : strx.length-2;

while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;

strx = strx.substring(0,chop-1);

return strx+'...';

}

function createSummaryAndThumb(pID){

var div = document.getElementById(pID);

var imgtag = "";

var img = div.getElementsByTagName("img");

var summ = summary_noimg;

if(img.length>=1) {

imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';

summ = summary_img;

}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';

div.innerHTML = summary;

}

//]]>

</script>


Langkah 4

Sekali lagi, dengan menggunakan keyboard, tekan Ctrl+ F. Seterusnya,  taip atau paste kod <data:post.body/> pada ruang Find dan tekan Enter.

Langkah 5

Salin kod yang berwarna merah di bawah dan paste(gantikan)  pada kod <data:post.body/>

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8mS_RZnObYwRl2-oFNGMv-pQ-6rRRCvCFuC3wL0iMyP_GgL4kbNblPKHcT-0R-eepCbN_FHj6pMfyOeiECRfLcMPHSdVAOaX83o6P-Rx0ifl7JpTlTmkNTfkvPWVBhZLgPbaA_D1RGV4/s320/read+more_thumb%5B1%5D.png'/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Akhir sekali klik Preview dan jika tiada mesej Error terpapar, klik saja Save.

Sebab apa kita perlu kerap update blog?

Jika anda berblog hanya sekadar mengisi masa lapang atau sekadar suka-suka dan langsung tak kisah ada visitor ataupun tidak, entri ini sememangnya tidak ada kena mengena dengan anda. Tapi, kalau nak baca pun boleh juga. Dipersilakan untuk bersila.

Kita mungkin merasa sedikit pelik kenapa ada segelintir blogger yang terlalu rajin update blog mereka. Ada yang sampai 4 hingga 5 entri yang di postkan pada satu hari. Kenapakah mereka menjadi sebegitu rajin? Ada hadiahkah yang menanti mereka? Atau mereka ada sebuah masaelah?

Sebagai blogger baru yang sangat mementingkan kehadiran traffic, inilah sebabnya kenapa kita perlu menjadi rajin untuk update blog kita sendiri. Memang buat permulaan, inilah cara yang terbaik sekali untuk menarik kehadiran traffic di samping melakukan blogwalking dengan kerap. Semakin kerap kita melakukan update, semakin tinggilah kebarangkalian traffic pada blog kita akan bertambah. Harus di ingat, jika kita jarang untuk melakukan update, jumlah kehadiran traffic akan turun dengan mendadak. Takkanlah kita hanya nak bergantung harap kepada blogwalking semata-mata. "Slamat siang sobat.Blogwalking nih. Jangan lupa mampir ke blog gue ya". Mampir, mampir juga, entri dah berkurun tak update. Apa cerita tu?

Kita tak boleh samakan blog kita dengan blog yang telah lama bertapak. Jika kita lihat, ada blog yang mempunyai bilangan traffic yang tinggi, ini kerana mereka memang telah lama dan mempunyai entri yang berkualiti.

Kita pula janganlah terlalu mudah memberi pujian pada blog yang mempunyai traffic yang tinggi. Sikit-sikit nak puji. Pujian tu kalau dapat tambah traffic pada blog kita tu oklah juga. Ini tak. Puji sebab kita ingat blogger tu hebat dan dah mencapai taraf otai. Tak ada maknanya. Dia pun bermula sama macam kita juga. Ingatlah yang kita sedang berdiri dengan kaki kita sendiri.

Selalu juga gua baca komen pada blog yang bertraffic tinggi ini. Sikit-sikit komen, "hebatlah blog ni, macam mana yer blog ni boleh ramai visitor", "kenapa yer blog ni boleh ramai follower". Komen yang sangat melucukan. Memang tak salah kalau sekadar bertanya, tapi takkanlah kita tak boleh lihat sendiri apa yang ada pada blog tersebut. Lihat cara penulisannya, kualiti entri yang di tulis, berapa kerap di update, berapa banyak entri yang ada pada blog tersebut dan cara yang macam mana blog itu dapat menarik visitor. Kontroversi ataupun tidak.

Sepatutnya kita tengok sendiri apa yang ada pada blog kita dan tanya diri sendiri, "Kalau macam ni gaya aku tulis blog, bolehkah dapat traffic yang tinggi. Sikit-sikit tulis pasal makan, pakwe, pakwe, makan, makan pakwe..Bila mau habis daa..".

Kita pun sebenarnya boleh jadi seperti otai-otai itu kalau kita ada kesungguhan dan usaha. Kalau nak update pun malas, itu pun setakat seminggu sekali, macam mana nak dapat visitor yang tinggi. Tinggal angan-angan mat jenin panjat pokok kelapa sajalah jawapannya.

Widget counter Widgeo.net yang mengganggu keharmonian visitors.

 Apa popup-popup. Nak kena pukul ker !!!

Pop-up merupakan window yang muncul secara automatik tanpa kebenaran. Biasanya, window pop-up berbeza dari segi saiz tetapi lazimnya tidak menutup seluruh skrin. Sebahagian pop-up dibuka di atas window browser yang sedang digunakan, sementara window lain muncul di bawah browser (pop-under).

Internet browser seperti Firefox membolehkan kita mengawal pop-up dan pop-under melalui panel Content dalam window Options. Penyekatan pop-up dilakukan secara default. Kita tidak perlu untuk mengaktifkan penyekat pop-up untuk menghalang pop-up.

Walaupun ada diantara kita yang lebih advance, menyekat kemunculan pop-up ini dengan membuat manual setting pada option browser, terdapat juga pop-up yang terlepas dengan mudah dari halangan tersebut.

Jika kita menggunakan widget counter atau apa saja widget dari widgeo.net, kita sebenarnya secara tidak sedar telah menumpangkan pop-up pada blog kita. Apabila kita klik pada link atau klik pada mana-mana bahagian pada blog yang memasang widget counter dari widgeo.net, akan muncul satu window seperti yang terpapar pada gambar di atas. Window tersebut dinamakan pop-up dan pop-up ini memang gagah perkasa kerana ia dengan mudah saja dapat melepasi sekatan yang kita buat pada browser, walaupun kita telah setting supaya pop-up window di sekat daripada terpapar. Dan sebagai bonus track, pop-up yang terpapar itu juga berformat flash yang sememangnya membebankan proses loading. Jadi,perlukah visitors pula yang terpaksa memasang pop-up blocker?

Ramai pengguna widget counter dari Widgeo.net ini tak sedar dah ada juga yang tak tahu dari mana datangnya pop-up tersebut. Mungkin ada yang pelik, setiap kali mereka klik pada link atapun pada teks dalam blog mereka sendiri, tiba-tiba muncul tanpa di undang, satu window pop-up. Ianya datang dari widget counter yang kita pasang pada blog kita sendiri.

Memang widget tersebut nampak cantik dan menarik kerana berformat flash,akan tetapi masalah popup ini membuatkan sesetengah laptop ataupun PC tiba-tiba menjadi sedikit berat kerana terpaksa membenarkan tetamu yang tidak di undang ini melakukan proses loading.

Jika anda ingin memasang widget counter, di sarankan supaya anda memilih counter yang lebih ringkas seperti counter yang disediakan oleh whos.amung.us ataupun histats.com.

Untuk artikel yang berkaitan dengan pop-up widgeo ni, bolehlah merujuk kepada entri yang di tulis oleh Suki. Dia lagi hangin satu badan pasal widget Widgeo ni. Haha.

Update:

Entri tentang Widgeo juga ditulis di blog sue-sygckit.blogspot.com

p/s: Suki, gua pinjam gambar widgeo kat atas tu yer.

Memasang numbered page navigation pada bahagian bawah blog

Numbered page navigation seperti yang boleh anda lihat pada bahagian bawah blog ini, sememangnya memudahkan dan sangat membantu visitor untuk explore setiap muka surat yang ada pada blog kita. Visitor hanya perlu klik pada nombor yang berikutnya jika ingin melihat entri atau artikel yang telah di post sebelumnya.

Untuk memasang numbered page navigation ini, sila ikut beberapa langkah di bawah.

p/s: Sila save script template anda terlebih dahulu.(Penting)

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML. Seterusnya, tick pada Expand Widget Templates.

Langkah 2

Dengan menggunakan keyboard, tekan Ctrl+ F. Seterusnya, taip atau paste kod ]]></b:skin> pada kotak Find dan kemudian tekan Enter.

Langkah 3

Salin kod berwarna biru di bawah dan pastekan di atas atau sebelum kod ]]></b:skin> (Rujuk langkah 2)

.showpageArea {
font-family:verdana,arial,helvetica;
color: #000;
font-size:11px;
margin:10px;
}

.showpageArea a {
color: #000;
text-shadow:0 1px 2px #fff;
font-weight: 700;
}

.showpageNum a {
padding: 3px 8px;
margin:0 4px;
text-decoration: none;
border:1px solid #919106;
-webkit-border-radius:3px;-moz-border-radius:3px;
background: #ddd url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyudVYGECPvBgRaW6gUnUilBoOX5xW-2YcsPhRcQ52jAAEN9qmVsXG-UEVwYot2arsqK97oUrmbdg2q6BdD1TOE4CyuRCqErnAACf56h1f7gid0IGAgGA_z8E5VFj5xD5jue9IL0D6zC4/s400/wp2.jpg) 0 -50px repeat-x;
}

.showpageNum a:hover {
border:1px solid #aeae0a;
background: #ccc url(ttp:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyudVYGECPvBgRaW6gUnUilBoOX5xW-2YcsPhRcQ52jAAEN9qmVsXG-UEVwYot2arsqK97oUrmbdg2q6BdD1TOE4CyuRCqErnAACf56h1f7gid0IGAgGA_z8E5VFj5xD5jue9IL0D6zC4/s400/wp2.jpg) 0 -25px repeat-x;
}

.showpageOf{
margin:0 8px 0 0;
}

.showpagePoint {
color:#fff;
text-shadow:0 1px 2px #333;
padding: 3px 8px;
margin: 2px;
font-weight: 700;
-webkit-border-radius:3px;-moz-border-radius:3px;
border:1px solid #919106;
background: #666 url(ttp:https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyudVYGECPvBgRaW6gUnUilBoOX5xW-2YcsPhRcQ52jAAEN9qmVsXG-UEVwYot2arsqK97oUrmbdg2q6BdD1TOE4CyuRCqErnAACf56h1f7gid0IGAgGA_z8E5VFj5xD5jue9IL0D6zC4/s400/wp2.jpg) 0 0 repeat-x;
text-decoration: none;
}


Langkah 4

Dengan menggunakan keyboard, tekan Ctrl+ F dan taip atau paste kod </body> pada kotak Find dan seterusnya, tekan Enter.

Langkah 5

Salin kod berwarna merah di bawah dan pastekan di atas atau sebelum kod </body> (Rujuk langkah 4) .

Edit angka 7 yang di bold pada kod di bawah mengikut jumlah post pada front page (muka depan) blog anda.

&lt;script type='text/javascript'&gt;
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=4;
var upPageWord ='Prev';
var downPageWord ='Next';
&lt;/script&gt;
&lt;script src='http://sites.google.com/site/testsajasite/pagenav.js' type='text/javascript'&gt;&lt;/script&gt;


Langkah 6

Sekali lagi, dengan menggunakan keyboard, tekan Ctrl+ F dan taip atau paste kod 'data:label.url' pada kotak Find. Seterusnya, tekan Enter.

Langkah 7

Salin kod hijau di bawah dan gantikan kod 'data:label.url' (Rujuk langkah 6).

Edit angka 7 yang di bold pada kod di bawah mengikut jumlah post pada front page (muka depan) blog anda.

'data:label.url + &quot;?&amp;max-results=7&quot;'

Akhir sekali, klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save

Membina teks bergerak pada kursor mouse

Untuk membina teks bergerak pada kursor seperti yang boleh anda lihat  di sini, sila ikut beberapa langkah yang mudah di bawah.


Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

Langkah 2

Salin kod biru di bawah dan paste pada notepad. Edit teks Tulis teks anda di sini pada kod biru yang di bold dengan teks pilihan sendiri. Anda juga boleh menukar warna teks dengan menukar kod warna #0224FE yang di bold dengan warna pilihan anda. Untuk memilih kod warna, sila klik di sini.

<style type="text/css">
/* Circle Text Styles */
#outerCircleText {
font-style: normal;
font-weight: normal;
font-family: 'verdana';
color: #0224FE;
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>
<script type="text/javascript">
;(function(){
var msg = "Tulis teks anda di sini";
var size = 24;
var circleY = 0.75; var circleX = 2;
var letter_spacing = 5;
var diameter = 10;
var rotation = 0.4;
var speed = 0.2;
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,

mouse = function(e){
 e = e || window.event;
 ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
 xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
 if(init.nopy){
  o.style.top = (b || document.body).scrollTop + 'px';
  o.style.left = (b || document.body).scrollLeft + 'px';
 };
 currStep -= rotation;
 for (var d, i = n; i > -1; --i){ // makes the circle
  d = document.getElementById('iemsg' + i).style;
  d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
  d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
 };
},
drag = function(){ // makes the resistance
 y[0] = Y[0] += (ymouse - Y[0]) * speed;
 x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
 for (var i = n; i > 0; --i){
  y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
  x[i] = X[i] += (x[i-1] - X[i]) * speed;
 };
 makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
 if(!isNaN(window.pageYOffset)){
  ymouse += window.pageYOffset;
  xmouse += window.pageXOffset;
 } else init.nopy = true;
 for (var d, i = n; i > -1; --i){
  d = document.createElement('div'); d.id = 'iemsg' + i;
  d.style.height = d.style.width = a + 'px';
  d.appendChild(document.createTextNode(msg[i]));
  oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
 };
 o.appendChild(oi); document.body.appendChild(o);
 setInterval(drag, 25);
},
ascroll = function(){
 ymouse += window.pageYOffset;
 xmouse += window.pageXOffset;
 window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
 window.addEventListener('load', init, false);
 document.addEventListener('mouseover', mouse, false);
 document.addEventListener('mousemove', mouse, false);
  if (/Apple/.test(navigator.vendor))
   window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
 window.attachEvent('onload', init);
 document.attachEvent('onmousemove', mouse);
};
})();
</script>

Langkah 3

Salin kod yang telah siap di edit pada notepad tadi dan paste pada ruang Content HTML/Javascript (Rujuk langkah 1)

Akhir sekali klik Preview dan jika tiada mesej Error terpapar, klik saja Save.

Memasang kalendar ringkas pada blog

Untuk memasang kalendar ringkas pada sidebar yang memaparkan tarikh dan hari seperti yang boleh anda lihat di sini, hanya ikut beberapa langkah yang mudah di bawah.

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya, klik pada HTML/Javascript.

Langkah 2

Salin kod biru di bawah dan pastekan pada Content HTML/Javascript (Rujuk langkah 1)

<script language="JavaScript">
var fixd;      
                  
function isGregLeapYear(year)
{                             
    return year%4 == 0 && year%100 != 0 || year%400 == 0;
}                                      
                                      
function gregToFixed(year, month, day)
{                                  
    var a = Math.floor((year - 1) / 4);
    var b = Math.floor((year - 1) / 100);
    var c = Math.floor((year - 1) / 400);
    var d = Math.floor((367 * month - 362) / 12);
                                     
    if (month <= 2)
        e = 0;  
    else if (month > 2 && isGregLeapYear(year))
        e = -1;
    else   
        e = -2;
                          
    return 1 - 1 + 365 * (year - 1) + a - b + c + d + e + day;
}   
    
function Hijri(year, month, day)
{                       
    this.year = year;
    this.month = month;
    this.day = day;    
    this.toFixed = hijriToFixed;
    this.toString = hijriToString;
}        
       
function hijriToFixed()
{      
    return this.day + Math.ceil(29.5 * (this.month - 1)) + (this.year - 1) * 354 +
        Math.floor((3 + 11 * this.year) / 30) + 227014 - 1;
}           
              
function hijriToString()
{
    var months = new Array("Muharam","Safar","Rabi\'ul Awal","Rabiul Akhir","Jamadil Awal","Jamadil Akhir","Rejab","Sya\'ban","Ramadan","Syawal","Dzulka\'edah","Dzulhijjah");
return this.day + " " + months[this.month - 1]+ " " + this.year;
}              
               
function fixedToHijri(f)
{         
var i=new Hijri(1100, 1, 1);
i.year = Math.floor((30 * (f - 227015) + 10646) / 10631);
var i2=new Hijri(i.year, 1, 1);   
var m = Math.ceil((f - 29 - i2.toFixed()) / 29.5) + 1;
i.month = Math.min(m, 12);
i2.year = i.year;
     i2.month = i.month; 
     i2.day = 1;   
i.day = f - i2.toFixed() + 1;
return i;
}
  
var tod=new Date();
var weekday=new Array("Ahad","Isnin","Selasa","Rabu","Khamis","Jumaat","Sabtu");
var monthname=new Array("Januari","Februari","Mac","April","Mei","Jun","Julai","Ogos","September","Oktober","November","Disember");
             
var y = tod.getFullYear();
var m = tod.getMonth();
var d = tod.getDate();
var dow = tod.getDay();
          
document.write(weekday[dow] + " : " + d + " " + monthname[m] + " " + y);
    
m++;  
fixd=gregToFixed(y, m, d);
var h=new Hijri(1421, 11, 28);
h = fixedToHijri(fixd);
document.write(" &nbsp;&nbsp;<br>@ " + h.toString() + "H");
 
    </script>

Akhir sekali, klik Preview dan jika tiada mesej Error terpapar, klik saja Save.

Susah sangatkah nak bertukar ke template yang baru?

Minta maaf jika tulisan dan bahasa gua ini akan menyakitkan hati sesetengah reader, tapi gua tahu, semua readers blog ini adalah seorang yang cool. Bukan nak tunjuk pandai mahupun memandai-mandai, tetapi jika anda seorang yang berfikiran terbuka, menerima kritikan atau teguran secara yang positif, gua yakin, anda tidak akan terasa ataupun melatah dengan entri ini. Anggaplah yang kita sama-sama belajar dan cuba untuk membetulkan kesilapan dan kekurangan yang ada. Bak kata Abang Jamil dalam cerita Madu Tiga. "Siapa yang marah... nasihat !!"

Kalau di sebut saja pasal tukar-tukar template, mesti ramai juga yang berkerut dahi. Dalam kepala dah membayangkan yang widget dalam blog nanti akan hilang, satu kerja yang menyusahkan diri dan berbagai faktor luaran yang akan menyebabkan kita terus dibayangi dengan persaan  takut untuk cuba menukarnya. "Buat apa pulak aku nak tukar-tukar template. Kan blog aku dah cantik". Ya, memang cantik. Jadi, anda mungkin tidak ada kena mengena dengan entri ini, tetapi anda boleh juga terus membacanya jika mahu.

Oleh kerana takut ataupun terlalau sayangkan template classic itu, kita cuba mengambil jalan yang mudah dengan membuat sedikit ubahsuai dan tambahan pada template tersebut seperti menukar saiz lebar ataupun menambah sidebar atau apa saja yang dirasakan sesuai dan perlu.

Sebenarnya, membuat pengubahsuaianan dengan cara tersebut lebih menyusahkan diri kita sendiri dan sangat berisiko. Lainlah jika kita betul-betul memahami dan mahir untuk membuat pengubahsuaian pada template. Mengapa perlu menyusahkan diri dengan memilih jalan yang sukar jika terdapat cara yang lebih mudah?

Sampai bila-bila pun kita tetap setia dengan template classic tersebut jika kita tidak berani untuk cuba menukarnya. Belum apa-apa lagi dah cakap susah. Orang lain dah sibuk tukar template ala wordpress tetapi kita masih lagi disini dengan template classic. Adakah kita memang seorang yang classic?

Alasan yang selalunya di beri jika ada visitor atau reader yang menegur tentang layout blog kita ialah, sebab terlalu suka dan kasihkan template tersebut atau  kita cakap, kita seorang yang sukakan  sesuatu yang simple. Ini sebenarnya adalah helah bela diri yang dah tak boleh pakai. Gua tak percaya lagi dengan alasan yang semacam ini. Pasti juga ada yang beralasan yang template tersebut memang kena dengan jiwa dan raganya. Mungkin...

Berterus terang sajalah yang kita sebenarnya tak tahu macam mana nak tukar. Kenapa mesti bagi alasan yang sedemikian rupa. Bagaimana boleh kita tafsirkan yang kita suka kepada sesuatu yang simple tetapi hakikatnya dalam blog kita berlambak widget yang entah apa-apa entah. Header sebesar-besar alam dan tulisan yang berwarna warni buat sakit mata nak membacanya? Ya, ianya memang sesuatu yang simple.

Kalau kita tengok template-template baru yang ada sekarang, kebanyakannya di adaptasi dari template wordpress. Ada yang 2 column dan 3 column. Kalau nak 4 colum dan bercolumn-column pun ada juga. Ianya simple juga, tetapi lebih menarik dan lebih elegant. Nampak macam seorang yang profesional jika kita menggunakannya walaupun hahikatnya kita tak tahu apa pun. Yang kita tahu, cuma tukar template.

Banyak penambahbaikan yang telah dibuat oleh designer pada template-template baru yang bertujuan untuk memudahkan blogger dan reader . Ada template yang telah siap dipasang dengan auto read more, recent posts, recent comments, feeds dan sebagainya. Bukankah ia sememangnya telah memudahkan kita?

Jika kita takut widget yang kita pasang mungkin hilang semasa kerja-kerja menukar template, salin kod setiap widget tersebut pada note pad. Kalau hilang widgetnya pun, kan boleh di pasang semula. Memanglah sedikit menyusahkan nak kena cari semula, tetapi bak kata pepatah, "nak, seribu daya, tak nak, seribu dalih". Kalau banyak sangat dalihnya, kekal sahaja dengan template lama. Habis cerita. Lepas tu, jangan pulak tanya, macam mana nak buat itu, nak buat ini, nak pasang itu, nak pasang ini. Kata simple. Jadi, teruskanlah dengan dunia simple itu.

p/s:

Siapa yang rasa kerja tukar template ni memang susah, sila tulis jawapan anda  YA atau TIDAK pada ruangan komen. Jika majoriti beri jawapan TIDAK, gua akan buat lagi satu tutorial yang lebih detail, sedetail-detailnya tentang macam mana nak tukar template. Komen dari Anonymous tidak di ambil kira. Tapi janganlah bantai tulis YA atau TIDAK aje. Komenlah sikit.

Free flash widget (float) version 2

Untuk memasang widget float ini, sila ikut beberapa langkah di abwah:

Langkah 1

Log in blog => Dashboard => Layout => Add A Gadget. Seterusnya klik pada HTML/Javascript.

Langkah 2

Salin kod biru bagi widget yang ingin di pasang, dan pastekan pada Content HTML/Javascript

Akhir sekali, klik Save.

<div style="position: fixed; bottom: 0px; left: 2px;">

<embed src="http://www.swfcabin.com/swf-files/1261123585.swf"

quality="high"

type="application/x-shockwave-flash"

WMODE="transparent"

width="120"

height="190"

pluginspage="http://www.macromedia.com/go/getflashplayer" />

</embed>

</div>

<div style="position: fixed; bottom: 0px; left: 2px;">

<embed src="http://www.swfcabin.com/swf-files/1261123653.swf"

quality="high"

type="application/x-shockwave-flash"

WMODE="transparent"

width="120"

height="190"

pluginspage="http://www.macromedia.com/go/getflashplayer" />

</embed>

</div>

<div style="position: fixed; bottom: 0px; left: 2px;">

<embed src="http://www.swfcabin.com/swf-files/1261136099.swf"

quality="high"

type="application/x-shockwave-flash"

WMODE="transparent"

width="120"

height="190"

pluginspage="http://www.macromedia.com/go/getflashplayer" />

</embed>

</div>

<div style="position: fixed; bottom: 0px; left: 2px;">

<embed src="http://www.swfcabin.com/swf-files/1261123758.swf"

quality="high"

type="application/x-shockwave-flash"

WMODE="transparent"

width="120"

height="190"

pluginspage="http://www.macromedia.com/go/getflashplayer" />

</embed>

</div>

<div style="position: fixed; bottom: 0px; left: 2px;">

<embed src="http://www.swfcabin.com/swf-files/1261123809.swf"

quality="high"

type="application/x-shockwave-flash"

WMODE="transparent"

width="120"

height="190"

pluginspage="http://www.macromedia.com/go/getflashplayer" />

</embed>

</div>