HafizBlogs.blospot.com

Followers

Showing posts with label TuToriaL. Show all posts
Showing posts with label TuToriaL. Show all posts

TuToRiaL FB Plugins Comment

Assalamu'alaikum.. Salam sejahtera,
hari nie adalah hari pertama setelah 3 bulan den tak update blog nie. 
Kali terakhir update waktu bulan pose aritu, tu pun nak tak nak je update lolz
(^_^!)

Last 100 Follower den tu, terus dah tak berapa nak ada orang melawat 
Blog den yang tak seberapa nie.. wuuwuu ='( 
(actually spirit dah down lately)
p/s: Love problem lolz

Okey semalam saya ada permintaan dari sedara "Mohd Nizar".. 
die tanye ada tak TuToRiaL Facebook Plugin Comment


dan saya rasa ada kowt... ce tengok lah sendiri,




Ikut je langkah-langkah nie....

1) Klik kat >>>SINI<<<

2) Akan klua box cam kat atas nie... yang bulat merah tu letakkan url Blog kome.

3) Lepas tu "Get Code"....copy

4) "Code" tu boleh Paste dekat Design> Add Gadjet> HTML/Javascript.

5) Siap... (^_^)

** Boleh juga kalau kome nak wat macam saya yang kome nampak kat bawah post nie...

1) Design> Edit HTML

2) Tekan CTRL+F...... kemudian cari kod nie
 <data:post.body/>
3) Paste "code" fb plugin comment tadi deakat bawah code yang di cari tadi. Macam nie

<data:post.body/>
<div id='fb-root'/>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {return;}
  js = d.createElement(s); js.id = id;
  js.src = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;;
  fjs.parentNode.insertBefore(js, fjs);
}(document, &#39;script&#39;, &#39;facebook-jssdk&#39;));</script>
<div class='fb-comments' data-href='http://hafizblogs.blogspot.com/' data-num-posts='100' data-width='500'/> 
 4) Save Template kemudian preview k...

p/s : Ada pape nak tanye komen je k...


**NAK COPY TEKAN "CTRL+C"

Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Letak Fan Pages

Assalamu'alaikum...
Dah 4 hari tak update blog ni, sejak follower saya cecah angka 100
dah tak ada follower lagi dah.

Heih... Pelik-pelik, mana kome p ni??

Okey saya nak buat TuToriaL macam mana nak letak fan page kat blog.
Ini request dari sahabat blog kita "mr nizar"


Untuk TuTorial nie.. kome mesti ada Fan Page fb kome.

1) Login Facebook 



3) Cara nak dapatkan  Facebook Page Url(?) .. Bukak fan page kome, tengok bahagian atas


4) Width(?) tu adalah kelebaran kotak like box kome tu. Ubah ikut kesesuaian blog kome.

5) Dah habis tu, klik Get Code 


6) Copy kod XFBML

7) Login Blog > Design > Page Elements > Add Gadjet > HTML/ JavaScript


Paste kod XFBML tadi di sini

8) Eh dah siap!!! SAVE.... 




Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Facebook Badge

Assalamu'alaikum..salam sejahtera,
ada yang bertanya macam mane nak buat "facebook badge"
macam nie?


1) Login facebook kome

2) Klik profile 





3) Lihat pada bahagian bawah profile kome, klik "add a badge to your site"


4) Klik pada "edit this badge" untuk mengubah view ape yang kome nak dilihat pada badge kome.


5) Dah puas edit? kemudian save... lepas tu pilih dimana nak letak badge tu. Sudah tentu pada Blogger kan.

6) Dah klik pada button blogger, kemudian klik pada "add widget"


7) Ok dah siap, boleh lihat pada blog kome badge tu dan susun dimana nak letak badge tu ok. Ada soalan boleh komen ya... lalala (^_^)






Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Read More

Assalamu'alaikum...
Saya nie suke gak Blog Walking..lalala (^_^)
ramai anak-anak muda yang sudah pandai berblogging.
ramai gak yang suka bercerita

dan tak lujpa juga yang suka buat-buat cerita.
Tapi takpe yang penting ramai yang sudi "menyinggah"
ke Laman Blog meraka...

Okey objektif den kali nie.. nak tunjuk pada kome-kome yang suke 
tulis post panjang-panjang dan ingin "meng-shortkan"(read more) 
apabila kite publish je post tu...

Tengok nie>>>

Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Scroll Box

Assalamu'alaikum.. Salam Satu Malaysia,
Pagi nie den nak tunjuk camno nak buat "Scroll Box"
camnie...


Itu lah "Scroll Box" kalau kome nak tahu.. nak buat camtu?
Ikut cara nie...

Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Animated Recent Post Widget

TuToriaL Animated Recent Post Widget


Nak widget macam nie tak???
tengok lah tutor nie ok...

1) Login > Design > Page Elements > Add Gadjet > Html

2) Copy & Paste kod dibawah nie..


<center><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><style type="text/css" media="screen"><!--
#spylist {overflow:hidden;margin-top:5px;padding:0px 0px;height:350px;}#spylist ul{width:165px;overflow:hidden;list-style-type: none;padding: 0px 0px;margin:0px 0px;}#spylist li {width:153px;padding: 5px 5px;margin:0px 0px 5px 0px;list-style-type:none;float:none;height:70px;overflow: hidden;background:#fff repeat-x;border:1px solid #ddd;}
#spylist li a {text-decoration:none;color:#4B545B;font-size:11px;height:18px;overflow:hidden;margin:0px 0px;padding:0px 0px 2px 0px;}#spylist li img {float:left;margin-right:5px;background:#EFEFEF;border:0;}.spydate{overflow:hidden;font-size:10px;color:#0284C2;padding:2px 0px;margin:1px 0px 0px 0px;height:15px;font-family:Tahoma,Arial,verdana, sans-serif;}
.spycomment{overflow:hidden;font-family:Tahoma,Arial,verdana, sans-serif;font-size:10px;color:#262B2F;padding:0px 0px;margin:0px 0px;}
--></style><script language='javascript'>
imgr = new Array();imgr[0] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";imgr[1] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";imgr[2] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";imgr[3] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";imgr[4] = "http://2.bp.blogspot.com/_CEj8AwvwSNM/TPkQUkM0wnI/AAAAAAAAFD8/TxYWe-CMPr8/s320/no_image.gif";showRandomImg = true;boxwidth = 220;cellspacing = 6;borderColor = "#232c35";bgTD = "#000000";thumbwidth = 70;thumbheight = 70;fntsize = 12;acolor = "#666";aBold = true;icon = " ";text = "comments";showPostDate = true;summaryPost = 40;summaryFontsize = 10;summaryColor = "#666";icon2 = " ";numposts = 10;home_page = "URL BLOG KOME";limitspy=4intervalspy=4000</script>
<div id="spylist"><script src='https://sites.google.com/site/unwanted86/javascript/animatedrecentpost.js' type='text/javascript'></script></div></center><small><a href="http://hafizblogs.blogspot.com/2011/06/tutorial-animated-recent-post-widget.html" target="_blank">Dapatkan Widget Ini Disini</a></small>

3) Warna biru tu letak "url blog" kome ok

4) Preview...then save okey... ^_^

**Nak copy tekan "CTRL+C"


Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

Cara Deactive @ Delete Akaun Facebook


1) Login akaun facebook kome.

2) Klik pada "Account" atau "Akaun"
3) Klik pada "Account Settings" atau "Tetapan Akaun"

Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Status

Assalamu'alaikum....

Yang ni pula saya nak tunjuk camna nak buat "Status" cam kat tepi tu



1) Log in > Design > Page Elements > Add Gadjet > Html

2) Copy and Paste kod nie


<fieldset><legend><img src="Url Gambar Status"/></legend><center>HafiZ OnLine</center><center>03 JUNE 2011</center></fieldset>


** Url Gambar Status tu kome buh la ape-ape gambar or kome leh edit k
** Hafiz Online tu kome ubah la...letak nama kome sendiri k.

3) Preview... kemudian save k. enjoy!!

PERHATIAN!! Online ngan Offline tu manualy k. Bukan Auto... hihi

**nak copy tekan (CTRL+C)

Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Sidebar Column

Assalamualaikum...

Baru habis exam tadi, memang mencabar tul... kali nie saya nak tunjuk

camna nak buat "Sidebar Column"



1) Log in > Design > Edit Html 

2) Tick Expend Widget

3) Tekan (CTRL+F) cari kod ni 

]]></b:skin>

4) Copy and Paste kod bawah nie ATAS kod yang search tadi...

.sidebar .widget {background : transparent ;border: 3px solid #000000;margin:0 0 2em;padding:10px 10px 10px 10px ;}

**Oren = Background colour
**Hijau = Saiz Border
**Unggu = Warna Border

5) Preview kemudian save k... 



**NAK COPY TEKAN (CTRL+C)





Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Shadow At Post and Sidebar Tittle

TuToriaL Shadow At Post and Sidebar Tittle
Tuto ni sebenarnya nak bagi cantik lagi 
tulisan kat Post and Sidebar Tittle...
soo let's check it out!!

1Log in > Dashboard > Design > Edit HTML>

2) Untuk buat shadow post title , kome tekan CTRL+F and cari code ni.


h3.post-title {


*Kalau tak jmpa kod tadi ,cuba cari kod yang ini pula


.post h3 {


3) Lepas tu, korang copy code dekat bawah ni , paste dekat bawah code atas ni


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



Bagi sape-sape yang nak buat shadow effect dekat sidebar plak,cari code ini :


h2 {


5) copy and paste code yang saya bagi dekat bawah code atas ni....

6) yang warna merah tu, code gambar .

nak kod gambar... >>>>Klik Sini<<<<


**NAK COPY TEKAN "CTRL+C"

Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Cute Cursor

Assalamu'alaikum..
Anda sudah bosan dengan cursor yang biasa saja pada blog anda??
Jom saya nak tunjuk macam mana nak buat 
Cursor yang cantik.....

contoh!!


1) Log in > Dashboard > Design > Page Element >Add Gadjet>  Html

2) Copy and Paste kod di bawah nie



<style>body {cursor:url(url cursor), auto;} </style><a href="http://hafizblogs.blogspot.com/" target="_blank"><div style="height: 50px; width: 50px; position: absolute; top: 0px; left: 0px;"> </div></a>



*warna merah = url cursors hangpa...

*warna biru = url blog kome...


4) Then preview and Save.... ada pape comment k




**NAK COPY TEKAN "CTRL+C"

Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

Kod Warna


olor
Color Code
Color
Color Code
Red
#FF0000
White
#FFFFFF
Turquoise
#00FFFF
Light Grey
#C0C0C0
Light Blue
#0000FF
Dark Grey
#808080
Dark Blue
#0000A0
Black
#000000
Light Purple
#FF0080
Orange
#FF8040
Dark Purple
#800080
Brown
#804000
Yellow
#FFFF00
Burgundy
#800000
Pastel Green
#00FF00
Forest Green
#808000
Pink
#FF00FF
Grass Green
#408080


Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuTorial Daftar Shoutmix!!

Assalamu'alaikum...salam sejahtera adik2 abg2 akak2..

Nak tahu 
"KENAPA BLOG SY NAMPAK XCERIA??"
KENAPA XRAMAI YG DTG KE BLOG SY??


HA.... Sebabnya anda xletak satu aplikasi
yang membolehkan pelayar blog anda melepaskan
GERAM!!!!

Anda thu?? dengan meletakkan SHOUTMIX or ape2 aplikasi seangkatannya...
anda boleh meningkatkan TRAFFIC BLOG ANDA!!
Ini dapat miningkatkan lagi $$$$$ anda.

Cara-Cara nak register SHOUTMIX >>>  KLIK SINI <<<


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

2. Paste kod shoutmix kome.. then preview... SAVE!!






Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Centerkan Header

Salam... okey tutor kali ni nak tunjuk kat kome camna nak betulkan header

kome yang  TAK betul or TAK center...



1)Log in > Dashboard > Design > Edit Html

2)Tekan CTRL+F.....cari kod  /* Content

3)Copy and Paste kod ini....ATAS kod tadi



.Header img {  margin-$startSide: auto;  margin-$endSide: auto;}



4)Preview.....then SAVE.


**NAK COPY TEKAN (CTRL+C)

Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Ayat Di Bawah Setiap Post



1) Log in > Dashboard > Design > Edit Html > Expand Widget

2) Tekan (CTRL+F) cari kod ini <data:post.body/>


3) Dah jumpa.... Copy and Paste kod ini di bawah kod <data:post.body/>




<hr/><center>LETAK LA PAPE JE AYAT KAT SINI</center><hr/>




4) Preview.... Save

**NAK COPY TEKAN (CTRL+C)



Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Favicon

Kali nie sya nak tunjuk camna nak buat "FAVICON"

Mesti kome yang baru2 nie xtahu apa itu "favicon" kan? ce tgk gambar nie





1) Log in > Dashboard > Design > Edit HTML

2) tekan (CTRL+F) cari kod </head>

3) Copy and paste kod dibawah di atas kod </head> tadi
<link href='URL gambar' rel='shortcut icon' type='image/x-icon'/>
<link href='URL gambar' rel='icon' type='image/x-icon'/>
4) kod akan jadi mcm ni

<link href='URL gambar' rel='shortcut icon' type='image/x-icon'/> 

<link href='URL gambar' rel='icon' type='image/x-icon'/>
</head>

5) Preview.. then kalau ok. Save

**NAK COPY TEKAN (CTRL+C)





Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"

TuToriaL Ayat Bergerak DiTap Bar

Assalamu'alaikum... Salam sejahtera sahabat ku,

Malam yang sejuk nie saya nak tunjuk camna nak buat "TuToriaL Ayat Bergerak Di Tap Bar"

1)Log in > Dashboard > Design > Edit HTML 

2) Tekan (CTRL+F) then search <head>

<script language='JavaScript'> var txt=&quot;Tulis Pape Yang Kome Nak Kat Sini&quot;; var kelajuan=250;var segarkan=null;function bergerak() { document.title=txt; txt=txt.substring(1,txt.length)+txt.charAt(0); segarkan=setTimeout(&quot;bergerak()&quot;,kelajuan);}bergerak(); </script>

3) Save....


**NAK COPY TEKAN (CTRL+C)


Mulakan Dengan "Bismillah"...Akhiri dengan "Alhamdulillah"