Home > tutorial > Membuat Komentar Facebook Berdampingan Dengan Komentar Blog

Membuat Komentar Facebook Berdampingan Dengan Komentar Blog

Bagikan ke Teman! :

cara membuat komentar berdampingan Dengan Komentar Blog

dimana komentar blog dan komentar facebook saling berdampingan. kotak komentar ini terdiri active tab dan inactive tab, active tab pada bagian kotak komentar facebook dan inactive tab pada kotak komentar blog tidak terbuka.

screnshoot twitter feed

Jika ingin
Membuat Komentar Facebook Berdampingan Dengan Komentar Blog

cari kode ]]></b:skin>
copy kode dibawah letak diatas kode ]]></b:skin>

.comments-page { background:transparent;} #blogger-comments-page { padding: 0px 5px; display: none;} .comments-tab { padding: 5px; margin-right:3px; cursor: pointer; background-color: #ff0000;border-radius:8px;color:#fff;float:left;} .comments-tab-icon { height: 14px; width: auto; margin-right: 3px;} .comments-tab:hover { background-color: magenta;} .inactive-select-tab { background-color: #000;}

cari laagi kode </head>
copay kode dibawah ini diatas kode </head>

<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/> <meta content='NAMA BLOG ' property='og:site_name'/> <meta content='203440326393405' property='fb:app_id'/> <meta content='ID FB ' property='fb:admins'/> <script src='http://code.jquery.com/jquery-latest.js'/> <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>

warna merah di atas sesuaikan..

Langkah terakhir :
cari <div class='comments' id='comments'>
jika kode <div class='comments' id='comments'> ada dua letakkan pada kode <div class='comments' id='comments'> yang ke dua

</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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9qe7lypL7p_fHxn3mLE1tVdK_yAlxc7kAMc_rHsX7EU3UpXRuQ31_g-e8x-1ewI8WYcO5w8xz91WPrBHeqp8axvWhcsKo7D0PtofcBiqKdiqvgI8m01crABGJ-GaVKalOrZq_iE-AAsQN/s1600/detected.png'/> <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='10' width='510'/> </b:if> </div> <div class='comments comments-page' id='blogger-comments-page'>

yang warna merah 10 jumlah komentar fb yg akan di tampilkan tsedangkan yang 510 adalah ukuran dr kotak komentar sesuaikan dengan blog sobt.