Following Star Pada Cursor

Adakah anda suka kalau cursor yang anda guna untuk blog ada beberapa bintang kecil berwarna yang mengikutinya.? Contoh macam gambar di bawah.



Kalau anda suka, ini ada tutorialnya.:)



1. Dari dashboard > design > add a gadget > HTML/javasrcript [link]

2. Copy code di bawah mengikut kesukaan anda dan paste ke dalam HTML/javascript

i) Following star warna warni

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/rainbows.js"></script>

ii) Following star warna biru

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/blues.js"></script>

iii) Following star warna purple

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/purples.js"></script>

3. Save dan lihat hasilnya.:)

Tutorial Tukar Warna Text Highlight

Apabila seseorang highlight text dalam blog, warna yang akan keluar adalah biru, itu default.
Tetapi ada juga tutorial yang membolehkan anda menukar warna text selection ini seperti contoh di bawah.

Default.


Selepas tukar warna text selection



Tutorial untuk tukar warna text selection adalah seperti berikut.


1. Dari dashboard > design > edit HTML

2. Dengan menggunakan fungsi Find, cari code body {

3. Selepas jumpa code body {, pastekan kod di bawah di atas body {

::-moz-selection {
background: #CC3399;
color: #ffffff;
}

Contoh:


Note: Anda boleh menukar warna text highlight dengan menggantikan warna kod yang dihighlight di atas.

4. Save dan lihat hasilnya..:)


Pssst.. Mencari kod warna.?
Rujuk di bawah.:)

Title Bar Maker

Sebelum ini sudah ada tutorial untuk buat title blog bergerak dari kanan ke kiri, untuk kali ini, dibawakan terus title bar generator.

contoh title bar (title blog)


Pilihan yang ada untuk title bar maker ini.


Anda boleh memilih pelbagai jenis gerakan yang anda mahukan dan setting yang begitu mudah.

Title bar generator adalah seperti di bawah.



1. Masukkan maklumat yang anda mahu.

2. Klik preview untuk tengok contoh paparan. Dan jika berpuas hati, klik pada 'OK, generate code!'

3. Code yang anda perolehi, copy dan paste pada HTML/javascript blog anda.
(dashboard > design > add a gadget > HTML/javascript ) [link tutorial]

4. Siap. Senang dan mudah kan.:)

Tips Menaip Entri Dalam Blog : Part 1

Cara penghasilan entri dalam blog merupakan element yang perlu dititikberatkan untuk menaip dalam blog. Walaupun blog tidak mempunyai format untuk menaip seperti mana karangan bahasa melayu, tetapi cara menghasilkan entri dalam blog penting untuk mencerminkan bagaimana pemilik blog menguruskan blog sendiri.



Cara menaip yang bagus juga akan memastikan pengunjung blog anda akan tertarik kepada blog anda, ditambah pula dengan faktor-faktor lain. Boleh dikatakan, cara menaip dalam blog antara perkara yang tidak boleh dipandang enteng oleh pemilik blog.

Apakah cara/bagaimanakah kandungan blog yang sepatutnya untuk menaip sesebuah entri?.


1. Perenggan

Ini sebenarnya antara perkara yang paling penting semasa menaip sesuatu dalam blog. Tidak kiralah samada blog berbentuk peribadi, maklumat, perkongsian, pengalaman atau apa sahaja. Perenggan akan memudahkan pengunjung blog anda membaca apa yang anda hendak sampaikan. Dan juga mempengaruhi pemahaman untuk sesebuah entri.

Ini adalah perenggan kedua. Tengok untuk taip point ini pun perenggan di buat untuk memudahkan anda membaca bukan.?.:). Bayangkan kalau sesebuah entri itu mempunyai ayat yang berterusan 1000 patah perkataan, tidak ke letih mata melihatnya. Hendak membaca pun boleh jadi tiada mood.:). Lagipun karangan masa sekolah pun diajar untuk buat perenggan, jadi kenapa tidak aplikasikan dalam penulisan blog.:)


2. Perkataan.

Perkataan juga memainkan peranan dalam menghasilkan sebuat entri yang baik. Pastikan kalau bleh anda menggunakan perkataan bahasa baku sebanyak mungkin dan penting juga perkataan yang anda gunakan mudah difahami oleh pengunjung. Sekali sekala tiada masalah kalau hendak guna short form atau perkataan meleret. Tapi kalau selalu sangat, hendak membaca pun tergeliat lidah hendak menyebutnya.

Contoh, Sayeeerr sukerr sangat tawww...Kalau ayat macam ini diletakkan untuk dialog ok lagi. Kalau sepanjang-panjang entri perkataan macam ini, sakit juga hendak membaca.:). tujuan menghasilkan entri juga untuk memudahkan kefahaman kepada pengunjung blog. Contoh walaupun anda seorang doctor, takkan semua entri hendak guna bahasa saintifik je kan. Lainlah kalau pengunjung blog anda semuanya doktor.:)


3. Entri jangan terlalu panjang.

Mungkin anda seorang yang begitu hebat mengarang. Tetapi kehebatan anda mengarang sehingga sehari tanpa henti bukan petunjuk yang baik kepada pengunjung anda. Pembaca juga akan merasa bosan jika entri yang dihasilkan terlalu panjang. Lagi satu, jika entri terlalu panjang, kemungkinan untuk melalut (lari dari tajuk entri) juga boleh berlaku.

Oleh itu biarkan entri anda bersesuaian untuk dibaca, mungkin ambil masa 5 minit berbanding anda menghasilkan entri yang memerlukan 1jam untuk habiskan.:).
Tetapi, jika memang anda anda perkara bagus atau penting untuk diberitahu pengunjung, boleh dijadikan dalam beberapa bahagian entri. seperti part 1, part 2 dan seterusnya. Itu akan lebih selesa di baca berbanding satu entri yang terlalu panjang.

Adakah anda juga perasan entri ini baru sahaja untuk part 1.?.:)

-------------------------------------------

Menaip entri dengan cara yang betul untuk mengekalkan blog anda lebih kepada mesra pengunjung. Kecualilah kalau blog anda tu anda baca seorang sahaja.:)

Dan tunggukan untuk next entri untuk tips menaip entri dalam blog untuk part 2.:)

Happy blogging.:)


Note: Entri asal ditaip diblog unwanted86.blogspot.com.

Tutorial Gerakkan Title Blog

Title blog secara default adalah dalam keadaan statik. Anda boleh tukarkan title blog anda dengan mudah dan juga anda boleh membuatkan ianya bergerak dari kanan ke kiri.



Tutorial untuk buatkan title blog bergerak adalah seperti berikut.


1. Dari dashboard > Design > Add a gadget > Html/Javascript

2. Copy dan paste code berikut dalam ruangan HTML/Javascript

<script language=javascript>
msg = "Title Blog Anda";

msg = "..." + msg;pos = 0;
function scrollMSG() {
document.title = msg.substring(pos, msg.length) + msg.substring(0, pos);
pos++;
if (pos > msg.length) pos = 0
window.setTimeout("scrollMSG()",200);
}
scrollMSG();
</script>

Note: Tukarkan 'Title Blog Anda' dengan apa sahaja yang anda mahu.

3. Save dan lihat hasilnya.:)


Update:
Mahu lebih banyak gerakan untuk title blog ini.? rujuk entri http://tutorialuntukblog.blogspot.com/2011/05/title-bar-maker.html

Cara Buat Bubble Cursor Pada Blog

Cursor untuk blog anda memang boleh dipelbagaikan. Samada untuk menukar icon cursor sahaja, atau menjadikannya sparkle. Dan juga tidak ketinggalan untuk menjadikan cursor anda menghasilkan bubbles.


Contoh cursor bubble yang menarik ini boleh di lihat di test blog ini.

Ikuti tutorial mudah di bawah untuk letakkan bubble cursor di blog anda.

1. Dari dashboard > design > add a gadget > HTML/javascript

2. Copy code bubble cursor di bawah, kemudian paste di ruangan HTML/javascript.
(code ini bubble warna biru. Untuk tukar warna bubble, sila ikuti tutorial sehingga habis)

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/bubblecursor.js"></script><script type="text/javascript">

// <![CDATA[

var colours=new Array("#0066FF", "#0066FF", "#0066FF", "#0066FF", "#0066FF"); // colours for top, right, bottom and left borders and background of bubbles

var bubbles=100; // maximum number of bubbles on screen



/****************************

* JavaScript Bubble Cursor *

* (c) 2010 mf2fm web-design *

* http://www.mf2fm.com/rv *

* DON'T EDIT BELOW THIS BOX *

****************************/

var x=ox=400;

var y=oy=300;

var swide=800;

var shigh=600;

var sleft=sdown=0;

var bubb=new Array();

var bubbx=new Array();

var bubby=new Array();

var bubbs=new Array();



window.onload=function() { if (document.getElementById) {

var rats, div;

for (var i=0; i<bubbles; i++) {

rats=createDiv("3px", "3px");

rats.style.visibility="hidden";



div=createDiv("auto", "auto");

rats.appendChild(div);

div=div.style;

div.top="1px";

div.left="0px";

div.bottom="1px";

div.right="0px";

div.borderLeft="1px solid "+colours[3];

div.borderRight="1px solid "+colours[1];



div=createDiv("auto", "auto");

rats.appendChild(div);

div=div.style;

div.top="0px";

div.left="1px";

div.right="1px";

div.bottom="0px"

div.borderTop="1px solid "+colours[0];

div.borderBottom="1px solid "+colours[2];



div=createDiv("auto", "auto");

rats.appendChild(div);

div=div.style;

div.left="1px";

div.right="1px";

div.bottom="1px";

div.top="1px";

div.backgroundColor=colours[4];

div.opacity=0.5;

if (document.all) div.filter="alpha(opacity=50)";



document.body.appendChild(rats);

bubb[i]=rats.style;

}

set_scroll();

set_width();

bubble();

}}



function bubble() {

var c;

if (x!=ox || y!=oy) {

ox=x;

oy=y;

for (c=0; c<bubbles; c++) if (!bubby[c]) {

bubb[c].left=(bubbx[c]=x)+"px";

bubb[c].top=(bubby[c]=y)+"px";

bubb[c].width="3px";

bubb[c].height="3px"

bubb[c].visibility="visible";

bubbs[c]=3;

break;

}

}

for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);

setTimeout("bubble()", 40);

}



function update_bubb(i) {

if (bubby[i]) {

bubby[i]-=bubbs[i]/2+i%2;

bubbx[i]+=(i%5-2)/5;

if (bubby[i]>sdown && bubbx[i]>0) {

if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {

bubb[i].width=bubbs[i]+"px";

bubb[i].height=bubbs[i]+"px";

}

bubb[i].top=bubby[i]+"px";

bubb[i].left=bubbx[i]+"px";

}

else {

bubb[i].visibility="hidden";

bubby[i]=0;

return;

}

}

}



document.onmousemove=mouse;

function mouse(e) {

set_scroll();

y=(e)?e.pageY:event.y+sleft;

x=(e)?e.pageX:event.x+sdown; }



window.onresize=set_width;

function set_width() {

if (document.documentElement && document.documentElement.clientWidth) {

swide=document.documentElement.clientWidth;

shigh=document.documentElement.clientHeight;

}

else if (typeof(self.innerHeight)=="number") {

swide=self.innerWidth;

shigh=self.innerHeight;

}

else if (document.body.clientWidth) {

swide=document.body.clientWidth;

shigh=document.body.clientHeight;

}

else {

swide=800;

shigh=600;

}

}



window.onscroll=set_scroll;

function set_scroll() {

if (typeof(self.pageYOffset)=="number") {

sdown=self.pageYOffset;

sleft=self.pageXOffset;

}

else if (document.body.scrollTop || document.body.scrollLeft) {

sdown=document.body.scrollTop;

sleft=document.body.scrollLeft;

}

else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {

sleft=document.documentElement.scrollLeft;

sdown=document.documentElement.scrollTop;

}

else {

sdown=0;

sleft=0;

}

}



function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height;
div.style.width=width;
div.style.overflow="hidden";
return (div);
}

// ]]>
</script>

3. Save dan lihat hasilnya.:)



Note:
Bagi yang hendak tukar bubble dengan warna yang anda kehendaki selain 4 warna di atas, caranya.

Cari kod di bawah dari code yang anda paste tadi, kemudian tukarkan code warna seperti yang dihighlight


Hendak cari kod warna.?
Rujuk code warna di bawah.




Selamat Mencuba.:)

Cara Letak Sitemap Di Blog

Sitemap boleh digunakan oleh pemilik blog untuk meletakkan entri yang ada dalam blog dengan lebih kemas/tersusun. Fungsi sitemap hampir sama dengan archive, tetapi sitemap lebih kepada kategori/label, manakala archive lebih kepada susanan entri mengikut tarikh.


Boleh dikatakan sitemap lebih mudah didapati untuk self-hosting, tetapi terdapat juga sitemap yang boleh diletakkan di blogspot. Sitemap untuk blogspot ini adalah berdasarkan kategori/label yang anda masukkan semasa menaip entri blog.

Contoh blogspot yang menggunakan sitemap ini anda boleh lihat di Sitemap OhBest.

Tutorial untuk membuat sitemap ini adalah seperti berikut

1. Dari dashboard > posting > edit pages > new page

2. Copy code berikut dan paste di ruangan pages.

<script style="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/Sitemaprev2.js
"></script>
<script src="http://www.URL BLOG.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc"></script>

note: Tukar URL BLOG dengan url blog anda

Contoh:


3. Save/publish page anda.

Note: Anda juga boleh pilih untuk link manually, dan letakkan link di mana sahaja yang anda rasakan perlu.