Tips & Panduan Tingkatkan TRAFFIC Blog

1. Blogwalking

- singgah dan tinggalkan jejak di blog rakan-rakan anda.

kalu boleh singgah di blog yang belum anda singgah

untuk promosikan atau perkenalkan blog anda 

bagi mereka-mereka yang belum tahu..

2. Beramah Mesra

- Tegur menegur sesama blogger untuk memancing

blogger tersebut ke blog anda selalu..

3. Blog Ringan

- Sekiranya blog kita ringan orang tidak akan

segan silu untuk singgah lagi.

4. Tajuk Entry

- Pancing traffic dari google atau mana-mana search engine

menggunakan keyword yang betul.

(cth : mandi manda di sungai gabai, langat)

5. Upload Gambar

- kalu boleh bubuh gambar untuk setiap entry anda

kerana gambar juga mampu tingkatkan traffic.

(edit nama gambar tersebut cth : mandi sungai gabai.jpg)

6. Ping entry

- Ping Entry anda di Group blogger Facebook

yang kira2 ada lebih dari 50group

cth : PORT BLOGGER 

7. Follower

- Tingkatkan Follower Anda kerana follower juga 

membantu sedikit sebanyak traffic ke blog anda.

sumber : http://www.jiwarosak.com/2011/09/tips-tingkatkan-traffic-blog.html

Tutorial :- Flash Blockquote

Flash blockquote ni means blockquote akan

bertukar bila cursor dihalakan..

jadi ada 2 background blockquote yg berbeza.. =)

Credit Tutorial:

Amalina

1) Dashboard> Design > Edit Html

2) Tekan Cltr + F serentak dan cari kod:-

.post blockquote {

3) Paste code di bawah SELEPAS kod di step (2)

background: url(http://dl3.glitter-graphics.net/pub/264/264393ps0ft3rzze.gif);
border:2px solid  #fbd5dd;
-moz-border-radius: 25px 10px / 10px 25px; 
border-radius: 25px 10px / 10px 25px;
colour:#FFFFFF}
blockquote:hover {
background: url(http://dl5.glitter-graphics.net/pub/590/590935ankbyj1xx4.gif) repeat right bottom ;
border:2px dotted  #fbd5dd;
-moz-border-radius: 40px 10px;
border-radius: 40px 10px;
}

4) Preview & Save!


okes, siap!!!
selamat Mencuba

Tutorial : Gambar besar bila cursor sentuh

Credit tutorial :-

Cik Nurfarah

contoh gambar :-

bila cursor menyentuh gambar akan membesar kan.. =)

1) Dashboard> Design > Edit Html

2) Tekan Cltr + F serentak dan cari kod:-

<head>

3) Paste code di bawah SELEPAS kod di step (2)

   <style>
    .post img:hover {
    -o-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -webkit-transform: scale(1.2); }
    </style>

4) Preview & Save!


okes, siap!!!
selamat Mencuba..

Tutorial jenis² Border

credit tutorial to Tengku Nizam

background: #790101;
border: 1px solid #790101;
-moz-border-radius-bottomright: 50px;
border-bottom-right-radius: 50px;
}

 background: #790101;
border: 1px solid #790101;

-moz-border-radius-bottomright: 50px 25px;
border-bottom-right-radius: 50px 25px;
}

background: #790101;
border: 1px solid #790101;

-moz-border-radius-bottomright: 25px 50px;
border-bottom-right-radius: 25px 50px;
}

background: #790101;
border: 1px solid #790101;

-moz-border-radius: 1em 4em 1em 4em;
border-radius: 1em 4em 1em 4em;
}

background: #790101;
border: 1px solid #790101;

-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
}

 background: #790101;
border: 1px solid #790101;

 -moz-border-radius: 35px;
border-radius: 35px;
}

Tutorial Blockquote Senget bila cursor dialihkan..

Ekceli tatau nak letak tajuk seswai ngan tutorial,

tp arap u ols paham la ape yg sy mau sampaikan itew.. ;-p

kalo tak phm, korang leh tgk post sblm ni

psl testing blockquote hover tu..

acu cuba try test letak cursor kat blockquote tu

& cuba alihkan..

bergerak bukan.. ?...=)

sy tlh cuba tutorial Mama Aqish
yeyeyey.. berjaya, tq mama!!!

1) Dashboard>Design>Edit HTML>
2) Tekan Ctrl F serentak dan cari kod

]]></b:skin>

3) Pastekan semua kod di bawah ini sebelum atau di atas kod di dalam step no (2)

.post blockquote {
-webkit-transition-duration: 1.0s;
background-image: url('BACKGROUND IMEJ ANDA SEBELUM DIHALAKAN CURSOR');
border:2px dashed #000000;
padding: 8px;
color: #888888;
max-width: 400px;
-moz-opacity:0.75;
filter:alpha(opacity=75);
-khtml-opacity: 0.75;
opacity: 0.75;
-moz-border-radius: 35px;
border-radius: 35px;
}
blockquote:hover{
background-color: #FFCCFF;
background-image:url(URL IMEJ BERGERAK YANG ANDA SUKA);
background-repeat:no-repeat;
background-position:bottom right;
-moz-opacity:1.0;
filter:alpha(opacity=100);
-khtml-opacity: 1.0;
opacity: 1.0;
-webkit-border-radius: 36px 12px;
    -moz-border-radius: 36px 12px;
    -webkit-transform: skew(2.deg,1.5deg);
    -moz-transform: rotate(4deg);
    -webkit-transform: rotate(4deg); }
    border:2px dashed #000000;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-bottomright: 10px;
}
.post blockquote p {
margin: .75em 0;
}

okes, siap!!!


try n error la yer.. =)

Note di bawah setiap post

Source : Syamira

1. Dashboard > Design > Edit html > 

2. Tick Expand WidgetsTekan Ctrl+F dan cari kod :

<data: post.body/>

3. Ctrl + C untuk copy kod di bawah :

<hr/><center>
<b>AYAT ANDA??</b>
</center><hr/>

 

4. Kemudian , pastekan kod yang telah di copy bawah kod <data: post.body/>

5.  Gantikan tulisan bewarna merah dengan ayat yang anda nak .

6. Preview & Save!!

Blockquote kalerful

Salam sejahtera

1st of all, 

TQVM tuk Liyaana yg sudi share tutorial beliau

meh saya ajar balik ape yg beliau share...
tutorial arini psl nk buat benda alah ni..

*
*
*

salam satu mesia

1) Log-in blog cam biasa 

2) Dashboard > Layout > Edit HTML

3) Tick Expand Widget templates 

4) Cari code  .post blockquote {  ** guna ctrl + f

 

5) copy dan pastekan semua itu dengan code ini di bawah code .. (4).. 

background: #FFCC99;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
padding: 6px;
Border: 1px solid #ff0d62;

** Note**

background: #FFCC99; ( kaler bulih tuko SINI )
-moz-border-radius-topleft: 10px; -moz-border-radius-bottomright: 10px; (  ini border dia. kalau nak ubah, just ubah top atau bottom)
padding: 6px; ( tak perlu usik )
Border: 1px solid #ff0d62; ( ini border color merah. kalau nak tukar line dia tebal, tambah lagi 1 kepada 5 atau 10px.

solid adalah garisan lurus. contoh ___________
dotted adalah garisan titik² contoh .........................
dashed adalah garisan putus² contoh _ _ _ _ _ _ _
margin:1em 20px; ( tak perlu usik )

 

6) Save n siap

Icon cute kat Link sidebar

Salam sejahtera,

Kali ni nak share camane nk wat ikon yg. cute, ganti ikon bloggers

yg salu terpapar kat sidebar link tu..

first of all,

TQVM utk AlmansuQie yg. sudi share tutorial tu..

stepnyer :-

1) pastikan kat configure blog list yg kite follow tu JGN tick icon

2) Log-in blog cam biasa 

3) Dashboard > Layout > Edit HTML

  4) Cari perkataan.. ** ctrl+f**

 .sidebar ul li {

 

5) Lepas perkataan tu, letakkan (paste) koding dibawah

background:url("Alamat Gambar Disini") no-repeat 2px .25em;

 

**gantikan alamat url**

6) Tadaa,, siap n save 

Letak Icon pd. tajuk post

Salam :-*

Ngerti apa tajuk entry kali ni?.. :-/

macam SINI la 

ekceli, tutorial asal akak amek kat SINI

Macih ye Darls, sudi u kongsi tutorial ngan kite sume ek..

1. Log masuk cam biase la kan

2. Dashboard > Layout > Edit HTML

3. Cari kod .post h3 {  


4. Letak kod di bawah SELEPAS kod .post h3 {  

line-height: 1.1em;
text-transform: uppercase;
text-align: center;
margin: 0 0 10px 0;
padding: 0 5px 0 0;
background:url(url gambar) no-repeat left top;


4. Preview, kalo suke, SAVE




:D

shortcut to icon/ text

Salam =D>

(so amacam, last tutorial kira menjadi la yep.. :-*)


entry kali ni lak pasal camane ek nak wat shorcut icon..
ala.. yg macam ni ♥, ♪, ♫ n else tu..
gamak²nye de ke org nak jwb kalo kite yg. tataw kebenda ni tanya?..
so, dont fening²,
meh sini nk turunkan ilmu sket..


akak tataw le kat mane amek dis shortcut tempohari..
sori ek mane² otai sume..
akak salin balik kt buku nota akak..
mane taw, dibuatnye hilang..
tak dapek nak nolong.. :)


so, here we goes..


alt + 1 = ☺
alt + 2 = ☻
alt + 15 = ☼
alt + 12 = ♀
alt + 11 = ♂
alt + 6 = ♠
alt + 5 = ♣
alt + 3 = ♥
alt + 4 = ♦
alt + 13 = ♪
alt + 14 = ♫
alt + 253 = ²
alt + 0153 = ™
alt + 0169 = ©
alt + r = ®




amacam ;;)
So, selamat mencuba..

Emoticon on post

Salam

Kali ni entry pasal camne nk letak emoticon² dalam post,

ala cam dlm ym tu, hikhikhik

source asal kat SINI

1. Log masuk ke akaun blog memasing

2. Layout> Edit HTML

3. Cari kod </head>
4. Letak kod dibawah SEBELUM kod </head>

<script src="http://mltan100.googlepages.com/emoticons.js" type="text/javascript"/>

5. Siap, save!!!


jom testing!!!

=))

kotak dalam entry

Salam

n3 camane nak letak kotak² dlm post..

ala, macam ni..

Ayat² chenta.. :P

jugak saya refer kat tutorial c33ra..

macih skali lagi c33ra..

sangat berguna ilmu yg. awak sampaikan.. =D

1. Cam biase, nak wat new post

2. letak lak coding ni.. 

<span ><div style="border: 1px solid rgb(0, 0, 0); padding: 7px 5px 7px 10px; width: 400px; background: #F5A9F2">
letak ayat kamuu..
</div></span>

*jenis² border yg. leh alter :- 

border-style: dotted;
border-style: dashed;
border-style: solid;
border-style: double;
border-style: groove;
border-style: ridge;
border-style: inset;
border-style: outset;

• border: 1px solid tu = boleh ditukar 
• width = boleh ditukar 
• background = pun bleh ditukar 

*kod warna html ... HERE.. 

3. okeh, siap n publish le wei.. ;p

Update!!

yg ini sy create sendiri :-

letak ayat kamuu..

<center><div style="background: #F5A9F2; border-bottom-style: dotted; border-color: #FF00FF; border-left-style: solid; border-right-style: solid; border-top-style: dotted;
border-width:2px; padding: 7px 5px px 10px; width: 400px;">
letak ayat kamuu..</div>
</center>

Tajuk Blog bergerak²

Salam

1. Log-in blog cam biasa
2. Dashboard > Layout > Edit HTML
3. Cari perkataan.. ** ctrl+f**


<head>


4. Letak coding ni kat bawah <head> tadi
 
<script language='JavaScript'>var txt=".. tulisla nak tulis ape pon..";var kecepatan=100;var segarkan=null;function bergerak() { document.title=txt;txt=txt.substring(1,txt.length)+txt.charAt(0);segarkan=setTimeout("bergerak()",kecepatan);}bergerak();</script>

4. preview dlu, kalo setuju Save templates.. :) 
5. Amacam, menjadi????...

TQVM tutorial Cik Intanurulfateha's

noted: yippie, menjadik =D

Memasang Favicon

Apa itu Favicon?

A favicon (short for favorites icon), also known as a website icon, shortcut icon, url icon, or bookmark icon is a 16×16, 32×32 or 64×64 pixel square icon associated with a particular website or webpage.

Cara nak tukar Favicon:-

1. Log-in kat blog memasing  

2. Dashboard > Layout > Edit HTML 
3.  Cari code </head>
4.  Lepas tu, letak code ni..

 <link href='YOUR URL' rel='Shortcut Icon'/>

** ganti URL tu ngan URL kite nyer

5. Favicon chantek² bleh didapati kat ----> SINI

p/s: TQVM Tutorial Along Arman. 

noted: yippie... menjadi!!!!.. :)