Tutorial Membuat Sitemap Pada Blogger

Tutorial:

1. Login ke Dashboard blogger.

2. Klik butang " More Options (rujuk no 1 pada GAMBAR 1) " dan klik " Layout (rujuk no 2 pada GAMBAR 1) ".

GAMBAR 1

3. Pada halaman Layout, klik " Add a Gadget (rujuk no 3 pada GAMBAR 2) " pada mana-mana bahagian yang anda nak untuk letakkan kod javascript tu nanti.

GAMBAR 2

4. Cari HTML/Javascript dan klik butang tambah (rujuk no 4 pada GAMBAR 3).

GAMBAR 3

5.  Copy (CTRL+C) kod javascript dibawah:

<style>
 p.labels a{color: #242424;
 text-transform: uppercase;
font-size: 15px;}
a.post-titles {
color: #0000FF;}
ol li{list-style-type:decimal;
line-height:25px;}
</style>
<script type="text/javascript" src="https://dl.dropboxusercontent.com/s/qa2ym7msa66b6v9/sitemap_faiz_tutorial.js"></script>
<script src="http://faiz-tutorial.blogspot.com/feeds/posts/default?max-results=9999&amp;alt=json-in-script&amp;callback=bloggersitemap"></script>

Keterangan:

• http://faiz-tutorial.blogspot.com - Gantikan dengan LINK/URL blogger anda .

6. Paste (CTRL+V) pada ruang Content (rujuk no 5 pada GAMBAR 4)

GAMBAR 4

7. Seterusnya klik " Save (rujuk no 6 pada GAMBAR 4 ) " dan lihat la hasilnya..

Baca Selengkapnya »

Tutorial Membuat " Numbered Page Navigation " Pada Blog

Screenshot Numbered Page Navigation

Tutorial:

1. Login ke Dashboard blogger.

2. Klik butang " More Options (rujuk no 1 pada GAMBAR 1) " dan klik " Layout (rujuk no 2 pada GAMBAR 1) ".

GAMBAR 1

3. Pada halaman Layout, klik " Add a Gadget (rujuk no 3 pada GAMBAR 2) " pada mana-mana bahagian yang anda nak untuk letakkan kod javascript tu nanti.

GAMBAR 2

4. Cari HTML/Javascript dan klik butang tambah (rujuk no 4 pada GAMBAR 3).

GAMBAR 3

5.  Copy (CTRL+C) kod javascript dibawah:

<style type="text/css">
.blog-pager,#blog-pager{
font-family:arial, serif;
font-weight:bold;
font-size:12px;
width:98%;}

.showpageNum a,.showpage a {
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw4PqEf-jN3X-K7Yw9NZeqAXkvAv3ISRlzvGBFRPLl29i750BbqMXI3WozlGHZdxNdjznwkkAmRjbA4sZCT64pZZw-aQWIGcqfhyphenhyphenAPau41GIIBt9T1-ibUsap7hOLOyPajh0WBsrXNHBE/s1600/lite.png) repeat-x;
background-position:0px -0px;
border:2px solid #555;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
margin:0px 1px 0 1px;
padding:3px 10px;
color:#222;
line-height:30px;
cursor:pointer;}

.showpageNum a:hover,.showpage a:hover {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw4PqEf-jN3X-K7Yw9NZeqAXkvAv3ISRlzvGBFRPLl29i750BbqMXI3WozlGHZdxNdjznwkkAmRjbA4sZCT64pZZw-aQWIGcqfhyphenhyphenAPau41GIIBt9T1-ibUsap7hOLOyPajh0WBsrXNHBE/s1600/lite.png) repeat-x;
background-position:0px -30px;
border:2px solid #555;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
color:#111;
-text-decoration:underline;}

.showpageOf{
margin:0 8px 0 0;
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw4PqEf-jN3X-K7Yw9NZeqAXkvAv3ISRlzvGBFRPLl29i750BbqMXI3WozlGHZdxNdjznwkkAmRjbA4sZCT64pZZw-aQWIGcqfhyphenhyphenAPau41GIIBt9T1-ibUsap7hOLOyPajh0WBsrXNHBE/s1600/lite.png) repeat-x;
background-position:0px -0px;
border:2px solid #555;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
line-height:30px;
padding:3px 10px;
color:#222;}

.showpagePoint {background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw4PqEf-jN3X-K7Yw9NZeqAXkvAv3ISRlzvGBFRPLl29i750BbqMXI3WozlGHZdxNdjznwkkAmRjbA4sZCT64pZZw-aQWIGcqfhyphenhyphenAPau41GIIBt9T1-ibUsap7hOLOyPajh0WBsrXNHBE/s1600/lite.png) repeat-x;
background-position:0px -30px;
margin:0 3px 0 3px;
padding:3px 10px;
line-height:30px;
cursor:pointer;
white-space:nowrap;
border:2px solid #111;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
color:#777;
text-decoration:underline;
font-weight:bold;
 </style>

<script type='text/javascript'>
//<![CDATA[
    var postperpage=6;
    var numshowpage=4;
    var upPageWord ='« Prev ';
    var downPageWord ='Next »';
    var urlactivepage=location.href;
    var home_page="/";

//]]>
</script>

<script type='text/javascript'src='https://dl.dropboxusercontent.com/s/msf4tmk4gr7gzs9/navipage-faiz-tutorial.js'></script>

 Keterangan:

• var postperpage=6;  -  Gantikan nilai 6 dengan bilangan entri pada setiap halaman.
• var numshowpage=4;  -  Gantikan nilai 4 dengan bilangan number navigation yang akan dipaparkan.

6. Paste (CTRL+V) pada ruang Content (rujuk no 5 pada GAMBAR 4)

GAMBAR 4

7. Seterusnya klik " Save (rujuk no 6 pada GAMBAR 4 ) " dan lihat la hasilnya

Baca Selengkapnya »

BIOS Hot Keys

The following is a list of BIOS start up key list by manufacturer.

BIOS Computer Key Command(s)

Acer®	F1, F2, CTRL+ALT+ESC
AST®	CTRL+ALT+ESC or CTRL+ALT+DEL
Cannon	F1
Castex	DEL
Compaq®	(Red Compaq Logo Screen) F10
CompUSA®	DEL
Cybermax®	ESC
Dell®	Delete key  Dell Dimensions 4100 - 8100 tap the F2 key at blue Dell screen Dell 400 F1 Dell Dimension® F2 or DEL Dell Inspiron® F2 Dell Latitude Fn+F1 (while booted) Dell Latitude F2 (on boot) Dell Optiplex DEL Dell Optiplex F2 Dell Precision™ F2
Digital	F2
eMachine™	DEL
Enpower (laptop)	Ctrl+alt+s
Gateway®	(F1 or F2)  2000 1440 F1 Gateway 2000 Solo™ F2
HP® (Hewlett-Packard)	F1, F2, Del or F1 (at blue screen) Esc or F10
Hewlett Packard (Pavillion Notebook)	F2 (Insyde BIOS) or F10
IBM (Aptiva)	F1
IBM®	F1 IBM E-pro Laptop F2 IBM PS/2® CTRL+ALT+INS after  CTRL+ALT+DEL
IBM Thinkpad® (newer) Windows:	Programs-Thinkpad CFG.
Intel®	Tangent DEL
Leading Edge	Ctrl+alt+s
Micron™	F1, F2, or DEL
NEC	F1 or F2
Packard Bell®	F1, F2, Del  (After Packard Bell start up screen) F1 or F2
Quantex	Del key
Sony® VIAO	(After Sony start up screen) F2 then hit F1
Sharp	F2
Tiger	DEL
Toshiba	XP Laptops: From the desktop, click Start>>All  Programs/Programs>>TOSHIBA Console>>TOSHIBA  Console
Toshiba Portable PC(Phoenix)	Press the [F2] key while the system processes its Power  On Self Test (POST).
Toshiba	Rebooting press ESC and F1 to enter the BIOS setup
Toshiba®	335 CDS ESC Toshiba Protege ESC Toshiba Satellite 205 CDS F1 Toshiba Tecra F1 or ESC

 If all else fails, hold down the space bar during startup. This should halt the machine and allow the customer to enter the startup key. The computer will display the BIOS key option.

IBM Thinkpad
300  350  500,510	Enter setup by pressing CTRL+Alt+F3 from a DOS prompt (you must be in DOS mode, not a DOS session under Windows).
310,315  310E/ED  315ED	BIOS Utility is entered by holding F2 while the ThinkPad logo is displayed after power on.
365C/CS  365CD/CSD  365E/ED	Enter setup by pressing CTRL+Alt+F11 from a DOS prompt (you must be in DOS mode, not a DOS session under Windows).
365X/XD	With the unit powered off, hold the F1 key and power the unit on. Keep F1 held down until Easy setup appears
360,355 series  380,385 series  560 series  600 series  701C/CS  75x series  76x series  770 series	With the unit powered off, hold the F1 key and power the unit on. Keep F1 held down until Easy setup appears. Note: On the TP 701, you can also access the Configuration area on BIOS by pressing the FN+F1 keys.
240  390  570 i Series 1200 i Series 1300 i Series 1400  i Series 1500  i Series 172x A20 T20	Pressing F1 during startup when the ThinkPad logo is displayed.
700/C  720/C	Pressing CTRL+ALT+INS when the cursor moves over to the upper right hand side of the screen right after the memory count.
710T  730T	Hold the suspend/resume switch while powering on the computer.

Baca Selengkapnya »

Berkongsi Fail Dalam Satu Rangkaian LAN Menggunakan Aplikasi HFS

HTTP File Server (HFS) merupakan satu aplikasi yang saiznya agak kecil tetapi mempunyai keupayaan yang sangat menakjubkan. Dengan aplikasi ini kita dapat menjadikan pc kita sebagai file server dan dapat berkongsi fail dengan pengguna lain dengan cukup mudah di dalam sebuah rangkaian setempat, contohnya di dalam sesebuah IPT atau pejabat .

Download :
HTTP File Server

P/S: Aplikasi ini boleh digunakan dalam satu rangkaian setempat (Local Area Network) .

1. Jalankan aplikasi HFS pada PC yang mahu dijadikan File Server.

2. Setkan  IP pada PC File Server anda dan PC client. (PERHATIAN : Jika didalam rangkaian LAN anda boleh dapatkan IP dari server secara automatik, gunakan sahaja IP yang sedia ada. )

3. Tambah File pada aplikasi HFS .

4. Membuat sambungan ke File Server dengan menggunakan IP File Server melalui Browser PC Client

Baca Selengkapnya »

Internet Download Manager v6.18 Build 11 + Serial , Patch & Keygen

Internet Download Manager (IDM) adalah aplikasi untuk meningkatkan kelajuan muat turun sehingga 5 kali ganda, resume dan jadual muat turun. Pemulihan kesilapan yang menyeluruh dan keupayaan resume akan memulakan semula muat turun yang rosak atau terganggu kerana kehilangan sambungan, masalah rangkaian, penutupan komputer, atau gangguan kuasa yang tidak diduga. Antara muka pengguna grafik yang mudah membuat IDM mesra pengguna dan mudah untuk digunakan.

Download: 

- Setup + Fix + Serial :

• via SolidFiles | Internet Download Manager v6.18 Build 11 + Serial  [6.8 MB]
• via TusFiles | Internet Download Manager v6.18 Build 11 + Serial [6.8MB]
• via Mirrorcreator | Internet Download Manager v6.18 Build 11 + Serial [6.8MB]

- Patch Only :

• via SolidFiles | IDM Patch  [162 KB]
• via TusFiles | IDM Patch [162 KB]
• via Mirrorcreator | IDM Patch [162 KB]

- Password (Jika diperlukan) : faiz-tutorial.blogspot.com

Baca Selengkapnya »

Tutorial Menggunakan Fungsi CSS3 - " :Before And :After Pseudo Elements " Pada " Sidebar Title "

Tutorial:

PS: PASTIKAN ANDA BACKUP DAHULU TEMPLATE BLOG ANDA UNTUK LANGKAH KESELAMATAN . Lihat sini >> http://faiz-tutorial.blogspot.com/2013/02/tutorial-backuprestore-template.html

1. Login ke akaun blogger anda.
2. Klik pada Template

3. Klik Edit HTML

4. Klik pada ruang edit html dan tekan CTRL+F untuk paparkan ruang search

5. Cari (CTRL + F) kod dibawah:

</head>

6. Copy (CTRL+C) dan Paste (CTRL+V) kod dibawah , sebelum kod </head>

<style>
.module h2 {
  background-color: #D5D5D5;
  border-radius: 20px 0 0 20px;
  color: #FFFFFF;
  font-family: Verdana;
  font-size: 14px;
  line-height: 32px;
  margin: 0;
  padding: 0 0 0 20px;
  text-shadow: 2px 1px 1px #222;
}
.module h2 a {
    border-left: 5px solid #ffffff;
    color: #101921;
    float: right;
    font-size: 14px;
    text-decoration: none;
    text-shadow: none;
    padding: 0 10px;
    position: relative;
   -moz-transition: padding 0.1s linear;
   -webkit-transition: padding 0.1s linear;
   -ms-transition: padding 0.1s linear;
   -o-transition: padding 0.1s linear;
}
.module h2 a:hover {
  padding: 0 32px;
}
.module h2 a:before, .module h2 a:after {
    content: "";
    height: 0;
    position: absolute;
    top: 50%;
    width: 0;
}
.module h2 a:before {
    border-bottom: 8px solid transparent;
    border-right: 8px solid #ffffff;
    border-top: 8px solid transparent;
    left: -12px;
    margin-top: -8px;
}
.module h2 a:after {
    border-bottom: 6px solid transparent;
    border-top: 6px solid transparent;
    left: -6px;
    margin-top: -6px;
}
.module.blue h2 a {background-color: #A2D5EC;}
.module.blue h2 a:hover {background-color: #C5F0FF;}
.module.blue h2 a:after {border-right: 6px solid #A2D5EC;}
.module.blue h2 a:hover:after {border-right-color: #C5F0FF;}
.module.green h2 a {background-color: #bada55;}
.module.green h2 a:hover {background: #C7E176;}
.module.green h2 a:after {border-right: 6px solid #bada55;}
.module.green h2 a:hover:after {border-right-color: #C7E176;}
.module.red h2 a {background-color: #F0A5B5;}
.module.red h2 a:hover {background-color: #FFC7D2;}
.module.red h2 a:after {border-right: 6px solid #F0A5B5;}
.module.red h2 a:hover:after {border-right-color: #FFC7D2;}
.module.yellow h2 a {background-color: #FCE98D;}
.module.yellow h2 a:hover {background-color: #FFD700;}
.module.yellow h2 a:after {border-right: 6px solid #FCE98D;}
.module.yellow h2 a:hover:after {border-right-color: #FFD700;}
</style>

7. Klik Preview template dan jika ok, klik Save Template

8. Klik Layout --->  Add a Gadget --->  HTML/JavaScript

9. Copy (CTRL+C) dan Paste (CTRL+V) salah satu kod dibawah pada ruang HTML/JavaScript

a) Biru :

 <div class="module blue">
<h2>Title in <a href="Link/URL">TAJUK SIDEBAR</a></h2>
</div>

b) Kuning :

 <div class="module yellow">
<h2>Title in <a href="Link/URL">TAJUK SIDEBAR</a></h2>
</div>

c) Hijau :

 <div class="module green">
<h2>Title in <a href="Link/URL">TAJUK SIDEBAR</a></h2>
</div>

d) Merah :

 <div class="module red">
<h2>Title in <a href="Link/URL">TAJUK SIDEBAR</a></h2>
</div>

Keterangan:

• Gantikan " Title in " dan " TAJUK SIDEBAR " dengan teks anda .
• Gantikan " Link/URL " dengan link anda.

9. Klik Save dan lihat hasilnya :)

Baca Selengkapnya »

Tutorial Efek CSS3 "Rounded Corners" Dan "Shadows" Pada Imej Di Entri Blogger

PS: PASTIKAN ANDA BACKUP DAHULU TEMPLATE BLOG ANDA UNTUK LANGKAH KESELAMATAN . Lihat sini >> http://faiz-tutorial.blogspot.com/2013/02/tutorial-backuprestore-template.html

1. Login ke akaun blogger anda.
2. Klik pada Template

3. Klik Edit HTML

4. Klik pada ruang edit html dan tekan CTRL+F untuk paparkan ruang search

5. Cari (CTRL + F) kod dibawah:

]]></b:skin>

6. Copy (CTRL+C) dan Paste (CTRL+V) salah satu code CSS dibawah sebelum kod ]]></b:skin> .

a) Efek 1 :

.post-body img {border:0;
padding:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {box-shadow: 0px 0px 15px #000; /* Shadow */
border-radius: 50%; /* Rounded border */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}

b) Efek 2 :

 .post-body img {
background:#FFF; /* background color around the image */
padding:15px; /* space between border and image */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
box-shadow: 0px 0px 15px #000; /* Shadow */
border-radius: 0% 50%; /* Rounded border */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}

c) Efek 3 :

 .post-body img {
background:#FFF; /* the background color around the image */
padding:15px; /* The Space Between Border and Image */
border-radius: 50% 0; /* Rounded border */
box-shadow: 0px 0px 15px #000; /* Shadow */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
border-radius:0; /* This removes the border roundness (value 0) */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}

d) Efek 4 :

 .post-body img {
box-shadow: 0px 0px 15px #000; /* Shadow */
border-radius: 50%; /* Rounded border */
border:0;
padding:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
box-shadow: 0; /* With this we remove the shadow (value 0) */
border-radius: 0; /* This removes the border roundness (value 0) */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;
}

e) Efek 5 :

 .post-body img {
border-radius: 45% / 20%; /* Rounded border */
box-shadow: 0px 0px 15px #000; /* Shadow */
padding:0;
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
}
.post-body img:hover {
border-radius: 0; /* This removes the roundness of border (value 0) */
-moz-transition: all 1s;
-webkit-transition: all 1s;
-o-transition: all 1s;
cursor:pointer;

}

7. Klik Preview template dan jika ok, klik Save Template

Baca Selengkapnya »

Custom Redirect Blogger " Error 404 " (Page Not Found) To Homepage

 

Halaman 'Error 404' akan terpapar apabila link/url sesuatu halaman tidak dijumpai pada blog anda. Jadi akan muncul halaman seperti gambar diatas yang memaparkan  " Sorry, the page you were looking for in this blog does not exist. " . Sebenarnya anda boleh custom halaman tersebut mengikut kreativiti anda. Disini saya akan tunjukkan cara untuk tambah fungsi redirect ke halaman utama blog apabila berlaku ' Error 404 ' ini.

1. Pada Dashboard blogger anda, klik Settings > Search preferences > Custom Page Not Found (Klik Edit).

2. Copy (CTRL+C) kod dibawah:

Sorry, the page you're looking for in this blog does not exist.
You will be redirected to homepage shortly.
<script type = "text/javascript">
BSPNF_redirect = setTimeout(function() {
location.pathname= "/"
}, 5000);
</script>

3. Paste (CTRL+V) kod diatas pada ruang " Custom Page Not Found " , 

4. Klik Save changes dan lihat hasilnya.

Baca Selengkapnya »

CSS - Efek Multi Hover Pada Imej

hover right hover top hover left hover bottom

Untuk Papar Efek Sila Letakkan Cursor Pada Bahagian Atas , Bawah , Kiri Atau Kanan Pada Imej

Tutorial:

PS: PASTIKAN ANDA BACKUP DAHULU TEMPLATE BLOG ANDA UNTUK LANGKAH KESELAMATAN . Lihat sini >> http://faiz-tutorial.blogspot.com/2013/02/tutorial-backuprestore-template.html

1. Login ke akaun blogger anda.
2. Klik pada Template

3. Klik Edit HTML

4. Klik pada ruang edit html dan tekan CTRL+F untuk paparkan ruang search

5. Cari (CTRL + F) kod dibawah:

</head>

6. Copy (CTRL+C) dan Paste (CTRL+V) kod dibawah sebelum kod </head>

<style type="text/css">
  /* The container and the image */
  div.multi-hover {
    overflow: hidden;
    position: relative;
    vertical-align: middle;
    width: 100%;
    height: 358px;
    line-height: 358px;
  }
  div.multi-hover img {width: 100%;}
/* The texts that, by default, are hidden */
  div.multi-hover span {
    color: #FFF;
    font-size: 32px;
    font-weight: bold;
    height: 100%;
    opacity: 0;
    position: absolute;
    text-align: center;
    transition: all 0.3s linear 0s;
    width: 100%;
  }
/* And this is what will generate the effect */
  div.multi-hover span:nth-child(1) { /* right */
    background: none repeat scroll 0 0 rgba(255, 189, 36, 0.6);
    left: 90%;
    top: 0;
  }
  div.multi-hover span:nth-child(2) { /* top */
    background: none repeat scroll 0 0 rgba(106, 170, 255, 0.6);
    left: 0;
    top: -80%;
  }
  div.multi-hover span:nth-child(3) { /* left */
    background: none repeat scroll 0 0 rgba(204, 87, 166, 0.6);
    left: -90%;
    top: 0;
  }
  div.multi-hover span:nth-child(4) { /* bottom */
    background: none repeat scroll 0 0  rgba(97, 181, 115, 0.6);
    left: 0;
    top: 80%;
  }
  div.multi-hover span:hover {opacity: 1;}
  div.multi-hover span:nth-child(2n+1):hover {left: 0;}
  div.multi-hover span:nth-child(2n):hover {top: 0;}
</style>

7. Klik Save Template

8. Untuk paparkan Efek pada entri, Copy (CTRL+C) dan Paste (CTRL+V) kod dibawah pada ruang HTML entri anda ( Posts >> New Post >> HTML )

<div class=multi-hover>
  <span>hover right</span>
  <span>hover top</span>
  <span>hover left</span>
  <span>hover bottom</span>
  <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5lnmQXAIKbP7e-qaVIPcRhp9A7_IotShppOevZ73uR-NuYgr3dMFebrwjpnMZ8H_qM5P1gxSOtGwNienmBRnhwBMxQ0CSW-CXSl5d6pmT4Oc2Kze9ldO2d0VpOzwxC5i01CEW7La_ZaI/s640/autumn-leaves-fall-leaf-4123-hd-desktop-wallpaper.jpg" width="640" height="425" />
</div>

Keterangan:

• Gantikan URL/LINK IMEJ (link yang berwarna biru) dengan URL/LINK IMEJ anda.
• Gantikan nilai 640 dengan saiz lebar imej anda.
• Gantikan nilai 425 dengan saiz ketinggian imej anda.

Baca Selengkapnya »

Tutorial Meletakkan Facebook Like & Share Button Pada Setiap Entri

Screenshot Facebook Like & Share Button

Tutorial:

PS: PASTIKAN ANDA BACKUP DAHULU TEMPLATE BLOG ANDA UNTUK LANGKAH KESELAMATAN . Lihat sini >> http://faiz-tutorial.blogspot.com/2013/02/tutorial-backuprestore-template.html

1. Login ke akaun blogger anda.
2. Klik pada Template

3. Klik Edit HTML

4. Klik pada ruang edit html dan tekan CTRL+F untuk paparkan ruang search

5. Cari (CTRL + F) kod dibawah:

<data:post.body/>

6. Copy (CTRL+C) dan Paste (CTRL+V) kod dibawah selepas atau sebelum kod <data:post.body/>

<!-- HTML5 CODE FACEBOOK LIKE AND SHARE BUTTON START -->
<div id="fb-root"></div>
<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 = "//connect.facebook.net/en_GB/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<div class='fb-like' data-colorscheme='light' data-font='segoe ui' data-send='true' data-show-faces='false' data-width='450' expr:data-href='data:post.url '/>
<!-- HTML5 CODE FACEBOOK LIKE AND SHARE BUTTON END -->

Keterangan: 

• Jika anda mempunyai kod  <data:post.body/> lebih dari satu, anda boleh cuba satu persatu . Try n Error k .

7. Klik Preview template dan jika ok, klik Save Template

Baca Selengkapnya »

Tutorial Meletakkan Facebook Send Button Pada Setiap Entri

Screenshot Send Button Facebook

Facebook Send Button merupakan satu fungsi tombol yang sangat berguna untuk Ping Entri terbaru anda ke senarai Group dan Friend (Teman) facebook anda sekaligus. Jadi tak perlulah 'paste' satu persatu dalam group , leceh kan :)

Tutorial:

PS: PASTIKAN ANDA BACKUP DAHULU TEMPLATE BLOG ANDA UNTUK LANGKAH KESELAMATAN . Lihat sini >> http://faiz-tutorial.blogspot.com/2013/02/tutorial-backuprestore-template.html

1. Login ke akaun blogger anda.
2. Klik pada Template

3. Klik Edit HTML

4. Klik pada ruang edit html dan tekan CTRL+F untuk paparkan ruang search

5. Cari (CTRL + F) kod dibawah:

<data:post.body/>

6. Copy (CTRL+C) dan Paste (CTRL+V) kod dibawah selepas atau sebelum kod <data:post.body/>

<!-- HTML5 CODE FACEBOOK SEND BUTTON START -->
<div id="fb-root"></div>
<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 = "//connect.facebook.net/en_GB/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<div class='fb-send' data-colorscheme='light' data-font='segoe ui' data-send='true' data-show-faces='false' data-width='450' expr:data-href='data:post.url '/>
<!-- HTML5 CODE FACEBOOK SEND BUTTON END -->

Keterangan: 

• Jika anda mempunyai kod  <data:post.body/> lebih dari satu, anda boleh cuba satu persatu . Try n Error k .
• Jika kod diatas tidak berfungsi pada template blogger anda, padam kod diatas , gantikan dengan kod dibawah :

<!--Facebook Send button Start --><b:if cond='data:blog.pageType != &quot;static_page&quot;'><div style='float:left;padding: 01px 05px 05px 0;'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1' type='text/javascript'/><fb:send colorscheme='light' expr:href='data:post.url' font=''/></div></b:if><!--Facebook Send button End -->

7. Klik Preview template dan jika ok, klik Save Template

Baca Selengkapnya »