Tutorial Atau Cara-Cara Memasang Kotak Komen Facebook Ke Dalam Blog
/
0 Comments
Step 1:
1.Pertama sekali anda haruslah login dahulu Blogger.com
2.kemudian lihat pada bahagian kiri pilih Templete.
3.Sebelum itu saya nasihatkan kepada anda supaya Backup
dahulu templete anda untuk keselamatan jikalau berlaku kerosakan.
4.Selepas itu klik pada bahagian edit HTML
5.Pada tahun 2013 pihak Google telah mengemaskini sistem
blognya. Jadi mungkin anda berasa bingug sedikit. Untuk kemudahan anda copy
semua Kod HTML Ctrl + A (select all)
dan Ctrl + c (copy).
6.Ok setelah selesai copy. Buka laman Web ini
7. Seterusnya, tekan CTRL+F
(Find) untuk mencari code ini div class='comments'
id='comments'> ( pilih yang Ke 2 )
Di bawah code
tersebut, paste code warna hijau di bawah ni.
<div class='comments-tab' id='fb-comments'
onclick='javascript:commentToggle("#fb-comments");' title='Comments
made with Facebook'>
<img class='comments-tab-icon' src='http://static.ak.fbcdn.net/rsrc.php/v1/yH/r/eIpbnVKI9lR.png'/>
<fb:comments-count expr:href='data:post.url'/> Comments
</div>
<div class='comments-tab inactive-select-tab'
id='blogger-comments'
onclick='javascript:commentToggle("#blogger-comments");'
title='Comments from Blogger'>
<img class='comments-tab-icon'
src='http://www.blogger.com/img/icon_logo32.gif'/>
<data:post.numComments/> Comments
</div><div class='clear'/>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == "item"'>
<div id='fb-root'/>
<fb:comments expr:href='data:post.url' num_posts='2'
width='400'/>
</b:if>
</div>
<div class='comments comments-page'
id='blogger-comments-page'>
8.Langkah seterusnya, tekan CTRL+F (Find) untuk cari code ini, <head>
Dan paste code di
bawah ni selepas code tu.
<script
src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script src='http://code.jquery.com/jquery-latest.js'/>
<meta content='YOUR_FB_ID' property='fb:admins'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>
9.tekan CTRL+F
(Find) sekali lagi untuk mencari YOUR_FB_ID
dan tukarkan YOUR_FB_ID dengan ID Facebook anda tersendiri.
Kalau tak tahu macam mana nak cari ID tu. Buka Facebook anda dan tengok URL
macam contoh ini; http://www.facebook.com/profile.php?id=1456667927.
Haahhh .. yang hujung sekali tu la ID Facebook anda.
Step 2:
1.tekan CTRL+F
(Find) untuk cari code ]]></b:skin>
2.Paste kod di bawah sebelum
]]></b:skin> bermaksud paste di atas ]]></b:skin>
.comments-page { background-color: #f2f2f2;}
#blogger-comments-page { padding: 0px 5px; display: none;}
.comments-tab { float: left; padding: 5px; margin-right: 3px;
cursor: pointer; background-color: #f2f2f2;}
.comments-tab-icon { height: 14px; width: auto; margin-right: 3px;}
.comments-tab:hover { background-color: #eeeeee;}
.inactive-select-tab { background-color: #d1d1d1;}
P/S:!! Bagi blogger² yang menggunakan text warna putih, sila
pastikan anda menukarkan warna backround kotak komen
.comments-page { background-color: #f2f2f2;}
dengan warna lain selain hitam dan putih. Tujuannya, untuk
elak warna tulisan pada ruang komen tenggelam dalam warna backgroud. Contohnya;
warna ini; #B9CACA. Kalau tak bersesuaian, sila gunakan code warna yang lain.
3.Setelah selesai semua, sekali lagi kita ulangi step 1
langkah ke 5: copy semua kod HTML di laman web http://www.onlinehtmleditor.net/
dan paste di edit HTML.
4.Sila pastikan, sebelum anda paste di edit HTML sila delete
dahulu Kod sebelumnya, dan paste code baru yang telah kita edit sebentar tadi.
5.Langkah terakhir, jangan lupa tekan Save Templete
6.Tunggu sehingga selesai save dan tekan pada view blog..
7.Selesai dan siap
sekarang pelawat blog anda boleh komen melalui facebook..
semoga berjaya :)
