Tutorial Cara Memasang Komentar Facebook di Blog Dengan Mode Tab
Hi, pada ksesempatan kali ini saya akan membagikan cara memasang komentar Facebook pada blog tapi dengan mode Tab untuk ente ente yang udah pada tau atau mungkin master Blogger mending merem aja atau pura pura nggak liat aja 😂 ok langsung aja yooo Bekicott...
1. Pertama lu tentunya masuk ke dulu ke menu akun Blogger Coeg kalau udah langsung aja pilih Template, Lalu pilih Edit HTML liat gambar dibawah ini coeg kalau kaga mudeng...
2. Maka bakalan ada tampilan kek kode kode banyak gitu nahh.... lu edit dehh tu kode kodenya klik pada kotak kodenya lalu cari kode " <div class='comments' id='comments'>" kelamaan kalau nyari dengan cara di scroll dan lu buang waktu juga coeg maka tekan Ctrl+F aja lalu masukin kata "<div class='comments' id='comments'>" liat gambar kalau kurang negrti..
3. Jika udah mari ke step selanjutnya.... lu copy dehh kode dibawah ini tepat dibawah kode " <div class='comments' id='comments'>" :
" <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='550'/></b:if></div>
<div class='comments comments-page' id='blogger-comments-page'>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><script src='http://code.jquery.com/jquery-latest.js'/><meta content='IDFANPAGEFACEBOOK' 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>
<style>.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;}</style> "
<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='550'/></b:if></div>
<div class='comments comments-page' id='blogger-comments-page'>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><script src='http://code.jquery.com/jquery-latest.js'/><meta content='IDFANPAGEFACEBOOK' 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>
<style>.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;}</style> "
Ket:
- Ukuran serta panjang Kolomo komentar FB sesuaikan dengan Ukuran Blog Lu Coeg. Silahkan ganti angka yang berwana Ungu di atas. (width='550')
Jika kurang jelas liat gambar dibawah dehh cobaa...
4. Klik simpan coba lu liat ada kaga di blog lu ape udah terpasang ape belum coeg?? kalau masih ra mudeng juga boleh komen di blog atau pm via FB atau twitter gw... 😎
Ok Cukup sekian dari saya semoga Succes
