Selasa, 27 Disember 2011

DOODLES CUTE


Pilih je tau nak warna apa..











Tutorial Perkataan Ikut Cursor

Tutorial untuk buat perkataan bergerak mengikut cursor adalah seperti berikut.





1. Dari dashboard > design > add a gadget > HTML/javascript
2. Copy dan paste kod berikut dalam html/javascript yang anda buka.


<style type="text/css">
/* Circle Text Styles */
#outerCircleText {
/* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
font-style: italic;
font-weight: bold;
font-family: 'Algerian', verdana, arial;
color: #019;
/* End Optional */


/* Start Required - Do Not Edit */
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;}
/* End Required */
/* End Circle Text Styles */
</style>
<script type="text/javascript">


/* Circling text trail- Tim Tilton
   Website: http://www.tempermedia.com/
   Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts
   Modified Here for more flexibility and modern browser support
   Modifications as first seen in http://www.dynamicdrive.com/forums/
   username:jscheuer1 - This notice must remain for legal use
   */


;(function(){


// Your message here (QUOTED STRING)
var msg = "WELCOME TO MY BLOG";


/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */


// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)
var size = 20;


// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;


// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;


// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 10;


// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.4;


// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.3;


////////////////////// Stop Editing //////////////////////


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>
Note: Tukar 'Perkataan anda disini' dengan apa yang anda mahu.

3. Save dan lihat hasilnya.:)


Bagi yang ingin sedikit ubahsuai, boleh rujuk beberapa perkara berikut.

1.Tukar style

font-style: normal; (pilihan lain italic, oblique, atau inherit)

2. Tukar warna perkataan
color: #FF0080; (untuk code warna, rujuk entri ini HTML color code

3. Tukar jenis tulisan
font-family: 'impact'; (pelbagai lagi bentuk perkataan yang ada, boleh rujuk dibawah)


Tutorial Buat Scroll Box Untuk Blog Archive


Blog archive untuk sesebuah blog boleh menjadi list yang begitu panjang apabila banyak entri yang di post atau jika sudah lama terlibat dengan dunia blogging.

Tutorial kali ini kan menunjukkan bagaimana untuk jadikan blog archive anda boleh scroll untuk menampakkannya lebih ringkas menyenangkan mata memandang.:)



Tutorial untuk buat scroll bagi blog archive adalah seperti berikut.



1. Dari dashboard > design > edit html > Expand widget templates.
(backup template untuk langkah berjaga²)

2. Menggunakan fungsi find (ctrl + F), cari kod <div id='ArchiveList'>

3. Anda akan jumpa kod ini <div class='widget-content'> sebelum kod <div id='ArchiveList'>

4. Gantikan kod <div class='widget-content'> yang anda jumpa di langkah 3 dengan kod berikut.

<div class='widget-content' style='overflow:auto; height:200px'>


Note: Anda boleh tukar 200px dengan ketinggian yang anda mahukan.

Contoh:

Sebelum.


Selepas


4. Save dan lihat hasilnya.:)

Dofollow bukan bermaksud Follower

Dofollow blog ~ ialah blog yang akan memberi backlink kembali ke blog korang. Jadi,semakin banyak anda komen di blog yang mempunyai fungsi “Do Follow” , maka semakin banyak lah backlink yang akan diperolehi dari blog tersebut.Seterusnya, ia mampu menaikkan taraf PR sesuatu blog dan memantapkan lagi blog anda di enjin carian. Penerangan apa itu backlink boleh tilik-tilik kat entry "Jom gosip pasal backlink..".

Nofollow blog ~ berfungsi sebaliknya, dalam erti kata lain ia tidak memberi apa-apa faedah. Korang tidak akan mendapat backlink daripada blog yang mempunyai fungsi Nofollow.

Kebaikan dan keburukan 
Dofollow
Nofollow
Kebaikan
~ Mampu meningkatkan trafik yang tinggi. Ini kerana  blog yg berstatus dofollow sering dicari pencari blog dofollow.
~ Memberikan backlink percuma kepada pembaca.
~ Meningkatkan bilangan komen pada post blog.
~ Menarik lebih banyak pengiklan untuk meletakkan iklan di blog anda.
Mampu mengurangkan SPAM di dalam blog anda.
Keburukan
~ Tidak begitu disukai oleh Google kerana memberi link keluar yang banyak. Paling ideal yang perlu ada dalam sesebuah blog, keseluruhan link mesti kurang dari 100.
~ Spammers akan meninggalkan komen di post blog tanpa membaca apa yang anda tulis. Namun ini boleh dielakkan, sekiranya komen tersebut perlu mendapat kelulusan dari Comment moderation terlebih dahulu
~ Mampu meninggalkan kesan buruk kepada SEO blog sekiranya terlalu banyak SPAM yang terhasil. Namun seperti yang saya katakan tadi. Perkara ini mampu dikawal sekiranya komen tersebut perlu mendapat kelulusan dari Comment moderation terlebih dahulu. Jadi anda sebagai Comment moderation haruslahbijak menentukan samada komen tersebut komen yang bermutu, berusur SPAM atau sebaliknya.
Pengunjung dan pengiklanan berkurangan. Namun ianya dapat diatasi sekiranya anda pandai memainkan peranan dalam pengolahan blog agar tidak membosankan, bijak dalam pemasaran blog dan banyak lagi.


Untuk pengetahuan korang, secara asasnya, setting default bagi ruangan komen blogspot adalah NoFollow. Jadi untuk menukarkan kepada DoFollow. Beberapa setting pada Edit HTML perlu dilakukan.



Cara untuk menukar status dari Nofollow ke Dofollow ialah:
  1. Pergi ke bahagian Design > Edit HTMl > Tick Expand Widget Templates
    Note : Sebagai langkah keselamatan download full templates terlebih dahulu (*_-)
  2. Tekan Ctrl + F di Keyboard, Copy dan pastekan code <a expr:href=’data:comment.authorUrl’ rel=’nofollow’> dan paste  diruangan find tadi. Tekan enter
  3. Bila dah jumpa tukarkan perkataan nofollow kepada dofollow,  Contoh selepas ditukar:
    
        4. SAVE