Tips for Bloggers...!: October 2013

Tutorial 71 : Remove Attribution

1. Dashboard > Design > Edit Html > Tick Expand Widget

2. Lepas tuh , tekan Ctrl F dengan serentak dari search kod ini :

<b:widget id='Attribution1' locked='true' title='' type='Attribution'>

3. Bila korang dah jumpa kod tuh . korang tukar kat warna merah kar atas dengan perkataan false.

4. Da siap ? Save oke!!

5.Tapi , tunggu dulu ! Tak habis lagi lah ! :)

6. Sekarang , pergi bukak blog korang.. Bukak / Edit Widget Attribution kat bawah tu.. Nanti korang akan nampak Remove button. Tekan Remove tuh.. Dah tekan kan ? Haaa!~ Hasil nyer berkesan !:) kan?:))

Tutorial 70 : Round Hover With Shadow

1. Log in > Dashboard > Design > Edit Html > Tick Expand Widget Templates

2. Tekan F3 atau Ctrl+F search kod kat bawah ini :

/* Header

3. Dah jumpa ?Oke . paste kod ini pula kat ATAS kod yg korang cari tadi tu ok ?:)

/*------ IMAGE ANIMATION------*/
img {filter:alpha(opacity=100);
-webkit-transition-duration:.5s;} img:hover {filter: alpha(opacity=60); opacity: .6; -webkit-box-shadow: 0px 0px 20px #FF3366; -moz-box-shadow: 0px 0px 20px #FF3366; -webkit-border-top-right-radius:30; -webkit-border-top-left-radius:30; -webkit-border-bottom-right-radius:30; -webkit-border-bottom-left-radius:30;}img:hover {filter: alpha(opacity=60); opacity: .60; border: 1px solid#FF3366; border-radius: 50px; -moz-border-radius: 50px;}
-moz-opacity:1.0;
opacity:1.0;
}
img:hover {
filter:alpha(opacity=80);
-moz-opacity:0.80;
opacity:.80;
}
u {
text-decoration:underline;
border-bottom: 2px dotted #ff0080;
padding: 0px;
}

**Tukar kod colour pink mengikut color yang korang suka ok ? :)

4. Da siap . SAVE !

Tutorial 69 : Reply To Comment

1. Dashboard > Design > Edit Html > Tick Expand Widget Template

2. Tekan Ctrl + F dan cari kod ini :

<b:include data='comment' name='commentDeleteIcon'/>

3. Copy code kat bawah ni , dan paste di bawah kod yang korang cari tadi..

<span class='comment-reply'><a expr:href='"https://www.blogger.com/comment.g?blogID=YOUR BLOG ID&postID=" + data:post.id + "&isPopup=true&postBody=%40%3C%61%20%68%72%65%66%3D%22%23" + data:comment.anchorName + "%22%3E" + data:comment.author + "%3C%2F%61%3E#form"' onclick='javascript:window.open(this.href, "bloggerPopup", "toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450"); return false;'>[Reply to Comment]</a></span>

4. Ambil Blog ID anda, dan gantikan di YOUR BLOG ID

**Tak tau Blog ID tu ape ehh?
Cuba tengok atas, bahagian address link sekarang.
Semua nombor selepas blogID tu la Blog ID korang lah!:)

5. Oke ! Boleh Save dah ! :) hehe ..
Tapi .. korang mesti nak reply to comment tu , jadi gambar comel kan ??:)

6 .Senang saje! Tukar kan [Reply to Comment] dengan kod kat bawah ini :

<img alt='Reply To This Comment' src='URL GAMBAR ANDA'/>

7. Da siap ? SAVE ! :) Lihat lah hasilnya! :)

Okie sayang ~

Kat bawah niyh . Lyssa ada buatkan korang button reply tuh..

Kalau korang nak ... jangan segan silu..

Ambik jer kod URL tuh ok ?:)

http://i.imgur.com/GsMcG.png

http://i.imgur.com/Hdvj4.png

http://i.imgur.com/mkiht.png

Tutorial 68 : Slide Float Widget

1. Dashboard > Design > Add Gadget > Html/JavaScript

2. Copy and paste kod di bawah , dan paste di ruangan html tadi tu ;)

<style type="text/css">
#at{
position:fixed;
right:450px;
z-index:+1000;
}
* html #at{position:relative;}
.attab{
height:100px;
width:30px;
float:left;
cursor:pointer;
background:url();
}
.atcontent{
float:left;
border:2px solid #ff0000;
background:url() #000000 repeat-x bottom center scroll ;
-moz-border-radius-topleft:15px;
-moz-border-radius-topright:15px;
-moz-border-radius-bottomleft:15px;
-moz-border-radius-bottomright:15px;
padding:10px;
}
</style>
<script type="text/javascript">
function showHideAT(){
var at = document.getElementById("at");
var w = at.offsetWidth;
at.opened ? moveAT(0, -200-w) : moveAT(20-w, 0);
at.opened = !at.opened;
}
function moveAT(x0, xf){
var at = document.getElementById("at");
var dx = Math.abs(x0-xf) > 25 ? 35 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
at.style.top = x.toString() + "px";
if(x0!=xf){setTimeout("moveAT("+x+", "+xf+")", 10);}
}
</script>
<div id="at">
<div class="attab" onclick="showHideAT()"> </div>
<div class="atcontent">
<div align="center">
<div style="background:url() no-repeat;">

kod (shoutbox,livestream Facebook,exchange link,banner dll) anda

</div>
</div>

<br />
<div align="right"><a href="javascript:void(0);" onclick="showHideAT()"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhyHoXvKyjiGBNsJlOVgHUAsr_E7mYayaS8PvybEAFfPTXEa-6ajCSF5EPdRTYw-STmKTYgXwvOIkWlLneBiJIXi-u-1VK5CcPSUO1c3yAfHxAVCK8P6Wn3Ae-GzRgPZs07tPoBlnVWDwA/s1600/close_button.gif" alt="close" title="Close" /></a></div>
<br><div align="right"><font size="3"><a href="http://wanhazel.blogspot.com/"><div style="color: #FF0000;">
<span ></span></div></a></font></div>
</div></div></div>

<script type="text/javascript">
var at = document.getElementById("at");
at.style.top = (-200-at.offsetWidth).toString() + "px";
</script></center>

**#000000 korang leh ubah warna..cari kod HTML warna..

**kod (shoutbox,livestream Facebook,exchange link,banner dll) anda

**Pastikan nilai tidak melebihi width: 580px; height: 380px.

3. Da siap . SAVE ! :)

Lepas tuh . korang buat cam ni pulak ...

1. Dashboard > Design > Add Gadget > Html/JavaScript

2. Copy kod di bawah , dan pastekan di ruangan html tadi tuh :

<style type='text/css'>
a.linkopacity img {
filter:alpha(opacity=50);
-moz-opacity: 0.5;F
opacity: 0.5;
-khtml-opacity: 0.5;}

a.linkopacity:hover img {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0; }
</style>

<div style='display:scroll; position:fixed; top:220px; right:-0px;'>
<a href="javascript:void(0);"onclick="showHideAT()"/><img class="expando" width="180" height="180"src="http://s2.kimag.es/share/38953289.png" alt="PUSH" title="KLIK ME"/></a>

</div>

** Yang warna merah tuh , korang boleh tukarkan gambar yang lain oke ?:)

3 . Da siap . SAVE ! :)

Tutorial 67 : Double Dashed Hover

1 . Dashboard > Design > Edit Html

2. Tekan Ctrl+F dgn serentak .. dan cari kod ini .. :

a:hover

3. Lepas korang jumpa . korang paste kan pulak kod kt ini kat bawah kod yang korang carikan tadi tuh ....

border-top: 2px dashed #ff8fc1;
border-bottom: 2px dashed #ff8fc1;

Korang boleh tukarkan kod warna merah diatas .dgn kod warna anda sendiri

4. Da siap . SAVE ! :) Lihat lah hasilnya ya! :)

Tutorial 66 : Letak Lagu Dalam Blog

1. Korang pergi kat link ini dulu ! >>> KLIK SINI !

2. Then , korang pilih lagu yang korang nak .! Lihat sebelah kana . Ada tak macam pic kat bawah ni ?:

**korang boleh pilih , nak lagu BARAT or lagu MALAYSIA

3. Lepas klik mana satu pilihan korang , sebelah kanan , akan keluar abjad nama artis . Then , pilihlah mana2 yang korang suka ! Tapi , ingat ! Ada lagu yang tak akan keluar kod or lagu dia . So , pilihlah lagu lain ok?:)

4. Lepas pilih , akan keluar ATU kod di tengah2 halaman tuh ..

5. Copy Code tu dulu ok ?:)

CARA - CARA UNTUK PASANG MASUK KE DALAM BLOG

1. Log in > Design > Add Gadget > Html/JavaScript

2. Paste kod korang tadi di ruangan html tuh..

3. Da siap . SAVE !

4. Try tengok ! Ada tak , lagu tu , kat blog korang ? Kalau tak de , p tukar lagu lain cepat ! HAHA!

Tutorial 65 : Signature di Bawah Setiap Post

sekarang ni saya nak tunjukkan cara2 mcm mana nak buat signature di bawah setiap post

Ikut step di bawah ^_^

**CARA PERTAMA**

1. Korang klik link ini dulu > KLIK SINI !!

2. Ada 4 cara tuh . Korang pilih yang "Using The Signature Creation Wizard"

3. Masukkan nama korang di textfield yang disediakan. Lepas tue, klik button "Next step".

4. Pilih font yang korang suka. Lepas tue, klik button "Next step".

5. Pilih size signature yang korang nak . Then , klik "Next Step".

6. Pilih background color untuk signature korang. Kalau tak nak ada color klik kat checkbox tulis 'transparents'. Pilih pula text color tuk signature tue. Lepas tue, klik button "Next step".

7. Pilih slope yang korang suka k. ? Nak senget banyak ke sikit ke terpulang la kat korang. Lepas tue, klik button "Next step".

8. Lepas tue dia akan keluar "Finished! The signature is ready." means da siap la signature anda. Then anda klik pada link "Want to use this signature?"

9. Korang akan ke page "Generating signature code". Klik pada "Generate HTML code" .

10. Korang akan diberi 2 pilihan samada nak generate code tuk signature sahaja atau signature dan sedikit info spt slogan @ website anda. Klik mana yang anda suka oke ?:)

11. Copy HTML code yang di dlam textbox.

CARA-CARA NAK PASANGKAN SIGNATURE MASUK KE DALAM BLOG

1. Log in > Setting > Formatting

2. Scroll ke bawah sampai korang jumpa "post template"

3. Paste HTML Code yang korang copy tadi .

4. Klik "Save Settings".

5. Untuk melihat samada korang ni berjaya atau tidak , klik pada "Posting" tab dan klik pada "new post". Signature korang akan automatik ada apabila anda membuat entry baru pada blog , oke ?:) hehe..

**CARA KEDUA**

(Bagi yang nak Letak Signature yang korang Reka Sendiri)

1. Log in > Design > Edit Html > Tick Expand Widget Templates

2. Tekan Ctrl + F dengan serentak . Dan cari kod ini :

<data:post.body/>

3. Pate URL Signature korang di bawah kod yang korang cari tadi ok ? :) Contohnye , mcm ini :

<img src="Url Signature Korang" />

4. Da siap . SAVE :) Menjadi tak ? :) huhu ^_^

Tutorial 64 : Tulisan Membesar

Hai hari ni saya nak ajar anda cara2 nak bagi tulisan besar bila cursor tu , sentuh LINK anda

Then , anda cari code di bawah : (Tekan Ctrl + F serentak utk memudahkan pencarian !)

a:hover

Then , anda paste pulak code kat bawah ni , kat bawah kod yang korang cari tadi k ?:)

font-size: 22px;font-weight: bold;text-decoration: none;}

*Yang warna merah tu , anda boleh tukar dengan SAIZ kebesaran tulisan yang anda nak ok ?:)

:73:

Da siap . SAVE

:73:

Oke ! Cepat pegi VIEW blog anda ! menjadi tak ? :)

Tutorial 63 : Cute Icon Di Shoutbox

1. Log in Shoutbox korang dulu ! Pada sesiapa yang belus daftar ,( KLIK SINI )

And terus ke settings taw ?

2. Then , korang klik Smileys yang macam Lyssa tunjukkan kat bawah ni ;)

3. Lepas korang klik "Smileys" tuh . korang scroll ke bawah . Korang ada jumpa tak macam yang ini :

4. Ada kan ? Oke , Skunk , Lyssa nak korang paste image URL korang kt ruangan Smiley image URL.

Kalau tak thu nak amik cute icon kat mana , (KLIK SINI) dan bg sesiapa tk thu mcm mana nk copy URLnya , korang boleh baca entry Lyssa kat (SINI.)

5. Isikan jugak code yang korang suka . Sebagai contoh :

6. Eh ! Eh ! Nanti dulu .! Ada lagi yang korang kena buat ! Lepas dah masuk kan satu image URL and satu kod korang . jangan lupa pulak tekan ADD . Kalau tak , tk kan menjadilah korang nye icon tuh . hehe.

7. Korang boleh masukkan seberapa banyak yang korang nak , tapi . nasihat Lyssa , jangan terlalu bnyk . cebab nanti , akan memeningkan kepala sesiapa yang singgah blog korang tuh .! hehe ;)

8. Da siap . Tekan SAVE SETTINGS . And korang boleh lah kalau nak test2 kt SB korang tu. huhu!~

Tutorial 62 : Shadow Effect Dekat Post Entry

1. Log in > Design > Edit Html

2. Cari kod ini : ( tekan ctrl + F dgn serentak untuk memudahkan pencarian )

.post {

*Ada jumpa tak ? kalau ada , bagus lah ! kalau tak jumpa , Lyssa tak tahu nak tlg macam mana lagi dah .
Korang pandai2 ler cari kod yg lebih kurang dengan kod kat atas neyy taw ? :) hehe~

3. Copy code di bawah ini , dan paste di BAWAH kod .post {

text-shadow: 2px 2px 3px #000000;

*Oke . yang kod color tuh . korang boleh tukar . and boleh dapatkan DI SINI

4. Cuba korang preview dulu. Kalau menjadi , terus SAVE ! Senang kan .?

Tutorial 61 : Daftar @ Buat Account Untuk Heartbeat

1. Firstly , korang Klik Banner di Bawah ini :

2. Then , korang ikut step picture kat bawah ni : (KLIK PIC UTK LEBIH JELAS)

*Klik Icon Heartbeat

*Klik Create Account

*Lepas Klik "Create Account" , korang perlu isi maklumat yang diperlukan..

Setelah selesai mengisi nya , jangan lupa untuk tick " I agree....."

Dan terus klik Continue

*Klik Join HB!Affiliate

*Scroll ke bawah dan cari "Online Application" seperti yang Lyssa tunjuk kan anak panah tuh,

kemuadia , Klik dia.

*Selepas korang klik tadi , satu borang untuk isi maklumat akan keluar.

Then , selepas sudah isi , jgn lupa pula utk nyatakan korang nak pembayaran tuh , melalui apa..

Lepas tu , TICK I agree .. Dan tekan Continue

*Seterusnya , korang bolehlah tekan MY HB!Affiliate

*Klik Get Code

Dan akhir sekali , korang pilih lah yang mana korang rasa banner yang korang nak guna,

Now , cara untuk :

PASANGKAN MASUK KE DLM BLOG

1. Log in > Dashboard > Design > Add Gadget > Html/JavaScript

2. Paste korang punya Code Heartbeat tadi , di ruangan Html/JavaScipt tuh.

3. Kalau nak lebih mudah , letak di bahagian Sidebar korang .

4. Da siap . Save :) And Lihat hasilnya !:)

Tutorial 60 : Letak Button Follow

(Tutorial ini , pada sesiapa yang dah buat button dashboard ok ?)

Copy code kat bawah ni , and paste kan sebelum kod dashboard korang tuh .

<div style="position: fixed; top: 5px; right: 90px;"><a class="linkopacity" href="http://www.blogger.com/follow-blog.g?blogID=BLOG ID KORANG" target="_blank" rel="nofollow" title="Follow !" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img src="http://assets.tumblr.com/images/iframe_follow_alpha.png?6" border="0" /></a>

So , kod korang tuh , akan jadi macam ini :

<div style="position: fixed; top: 5px; right: 90px;"><a class="linkopacity" href="http://www.blogger.com/follow-blog.g?blogID=BLOG ID KORANG" target="_blank" rel="nofollow" title="Follow !" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img src="http://assets.tumblr.com/images/iframe_follow_alpha.png?6" border="0" /></a><div style="display:scroll; position:fixed; top:5px; right:2px;"><a class="linkopacity" href="http://blogger.com/home" target="_blank" rel="nofollow" title="Dashboard !" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://assets.tumblr.com/images/iframe_dashboard_alpha.png?6" /></a></div>

*Warna Merah : Kod untuk Button Follow

*Warna Purple : Kod untuk Button Dashboard
*Blog ID boleh dapat kan DI SINI

Tutorial 59 : Maca mana Nak Cari Blog ID

orang nak cari Blog Id kan ?

Nak buat apa ?

Oh yea . kott kott lah ada koding yang memerlukan blog id ke..

1. Log in > Design

2. Tengok Pic kat Bawah niyh . korang follow je ok ? :)

3 . Haaa . Dah dapat ? Senang kan ? Tepuk tangan untuk korang ! hehe :)

=SELAMAT MENCUBA=

Gud Luck ! >.<

Tutorial 58 : Kotak Kod Untuk Banner

Hi dalam post kali ni saya nak ajar korang macam mana nak buat kotak kod untuk banner.

Sila ikut langkah dibawah ini:

:34:

Copy code kat bawah ni , and paste di ruangan html/javascript tadi tuh ok :

<center>
<img style="width: 167px; height: 157px;" src="URL BANNER KORANG" />
<center>*Copy And Paste it into your blog ok?:)</center>

<textarea cols="13" rows="3" style="text-align: center;"><a href="LINK URL BLOG KORANG/"><img src="URL BANNER KORANG" /></a></textarea></center>

Warna Oren : Korang boleh ubah size yang korang suka
:47:

Warna Merah : Url Banner Korang
:47:

Warna Coklat : Sukati korang nak letak ayat apa pun
:47:

Warna Biru : Link Blog Korang

:34:

Da siap . SAVE and lihat hasilnya. hehe :)

Tutorial 57 : Letak Button Dashboard

Paste kod di bawah ini , di ruangan Html tadi tu ..

<div style="display:scroll; position:fixed; top:5px; right:2px;"><a class="linkopacity" href="http://blogger.com/home" target="_blank" rel="nofollow" title="Dashboard !" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://assets.tumblr.com/images/iframe_dashboard_alpha.png?6" /></a></div>

Da siap . Save

:65:

Dan lihat hasilnya ! Menjadi tak ??