Tampilkan postingan dengan label Facebook. Tampilkan semua postingan

Cara Memasang tombol Like dan Share pada Halaman Posting

Model I

Tutorial :

Pada Dashboard, Pilh Template
Klik Edit HTML
Cari kode <p><data:post.body></p> atau <data:post.body/>
Copy Paste Kode script Dibawah ini dan letakkan tepat dibawah kode diatas (setelahnya)

<b:if cond='data:blog.url != data:blog.homepageUrl'>
<div style='border-top:1px solid #FE9A2E;border-bottom:1px solid #FE9A2E; padding:5px 0px 5px 0px;margin:10px 0px 7px 0px;width:100%;float:left;height:23px;'>
<div style='float:left;'>
<span class='st_twitter_hcount' displayText='Tweet'/><span class='st_facebook_hcount' displayText='Share'/><span class='st_email_hcount' displayText='Email'/><span class='st_sharethis_hcount' displayText='Share'/>
<script src='https://sites.google.com/site/didopalangkaraya/project/buttons.js' type='text/javascript'/><script type='text/javascript'>stLight.options({publisher:'63b83a98-def5-427f-ac7c-4b24bcff910d'});</script>
</div>
</div>
</b:if>

Model II

<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_google_plusone" g:plusone:size="medium"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript" src="https://sites.google.com/site/didopalangkaraya/project/addthis_widget.js"></script>

Catatan :

Apabila sobat ingin Widget ini berada dibawah Judul postingan sobat,
sobat cari aja kode <div class='post-header-line-1'/>
Copy Paste Kode scriptnya tepat kode tersebut

[ Baca Selengkapnya ]

Cara Membuat kotak Komentar Facebook bergandengan dengan komentar Blogspot

Tutorial :

Pada Template pilih Edit HTML
Cari kode ]]></b:skin> (Tekan CTRL + F untuk Pencarian cepat)
Letakkan kode dibawah ini tepat diatas ]]></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;}

Langkah kedua :

Cari kode </head>
Masukkan kode Dibawah Tepat diatas kode </head>

    <script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
    <script src='http://code.jquery.com/jquery-latest.js'/>
    <meta content='ID FACEBOOK' 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>

Ganti Tulisan berwarna Biru diatas dengan ID facebook Sobat
ID facebook bisa digunakan pada ID Fans Page Atau ID Profil Sobat Sendiri
https://www.facebook.com/nama sobat adalah ID Profil sobat.

Kemudian cari kode <div class='comments' id='comments'>
Biasanya kode <div class='comments' id='comments'> ada dua
Copy Pastekan kode dibawah ini pada kode <div class='comments' id='comments'> yang keduanya

<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'>

Keterangan :
angka 2 merupakan jumlah komentar yang akan ditampilkan pada komentar
angka 400 merupakan lebar kotak komentar facebook.
Apabila kode <div class='comments' id='comments'> ada 2, Hapus salah satunya

[ Baca Selengkapnya ]

Cara memasang tombol like di setiap posting blog

Tutorialnya :

Pada Menu Template, klik edit HTML
Tekan CTRL+F Pastekan kode <data:post.body/> untuk mencari, Jika terdapat dua kode yang sama, Pilih yang kedua (kalau Punya Saya, di setiap dua kode tersebut)
Pastekan Kode dibawah ini tepat di bawah atau persis disebelahnya kode <data:post.body/>

<iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&layout=standard&show_faces=false&width=100&action=like&font=tahoma&colorscheme=light"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:310px; height:31px;'/>

Keterangan :

Angka 310 adalah lebar ukurann tombol Like.
Silahkan diganti apabila tidah sesuai.

" Selamat Mencoba "

[ Baca Selengkapnya ]

Contoh Script Pemasangan Fan Page tersembunyi disisi kanan dan kiri layar

Sebelum Meletakkan kode script Fan Page, Pastikan terlebih dahulu apakah kode dibawah ini sudah ada didalam kode template Sobat

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

Apabila belum ada ikuti cara pemasangan kode diatas seperti dibawah ini :

Pada Dashboard Pilih Template,
Pilih Edit HTML,
Centang : Expand Template Widget
Cari kode </head>
Copy kode script di atas tepat di atas kode </head> Atau bisa juga pastekan tepat dibawah kode ]]></b:skin>, selesai simpan template sobat

Berikut contoh-contoh kode script Fan page

Contoh Kode Fans Page disisi Kanan

<script type="text/javascript">
//
</script>
<style type="text/css">
.floatinglikebox{
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihpgOg8O-QMCU_I-cUGd7ro5ZgnK0Ybav6JdqxtPT6e-YcXhP7aus2WKrOqFwTh2b9xBioJHxoSfLTjv-yQSfElbdnlojS1iCrPAH0urwazuJYpQOrl2qyyqX8CqWThKCyS1aVhr0aAVc/s1600/guestbook4+copy+copy.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 40px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:40%;
}
.floatinglikebox div{
border:none;position:relative;display:block;
}
.floatinglikebox span{
bottom: 10px;font: 10px tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;
}
.floatinglikebox span a{
color: #808080;text-decoration:none;
}
.floatinglikebox span a:hover{
text-decoration:underline;
}
</style>
<div class="floatinglikebox" style="">
<div>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Dido-Net/106766964583&width=251&height=270&colorscheme=light&show_faces=true&border_color=%23cccccc&stream=false&header=false&appId=159468740772399" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:251px; height:270px; background:#fff;" allowtransparency="true"></iframe><span><a href="https://www.facebook.com/Dido.Paray" target="_blank">.:Dido Creator:.</a>
</span></div></div>

Contoh Script Fans Page Disisi Kiri

<style type="text/css">
/*<![CDATA[*/
#fbplikebox {display: block; padding: 0; z-index: 99999; position: fixed;}
.fbplbadge {background-color:#; display: block; height: 215px; top: 50%; margin-top: -75px;position: absolute; right: -55px;width: 47px; background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiipLK6PQAOJDF2TAUsI7Ka_i5IfJXX-zjezgUjmHYoIHdEEzrChmHi3eXCDeSWyMcw8olaZWkEynvL8oELZugZbW44Xubi1ARO25vSv8vZHbujKMleof3EPVwfrTmfruNxX22u4Bb1G5Y/s1600/facebook+dido.png"); background-repeat: no-repeat; overflow: hidden; -webkit-border-top-right-radius: 8px; -webkit-border-bottom-right-radius: 8px; -moz-border-radius-topright: 8px; -moz-border-radius-bottomright: 8px; border-top-right-radius: 8px; border-bottom-right-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
(function(w2b){
w2b(document).ready(function(){
var $dur = "medium"; // Duration of Animation
w2b("#fbplikebox").css({left: -250, "top" : 100 })
w2b("#fbplikebox").hover(function () {
w2b(this).stop().animate({
left: 0
}, $dur);
}, function () {
w2b(this).stop().animate({
left: -250
}, $dur);
});
w2b("#fbplikebox").show();
});
})(jQuery);
/*]]>*/
</script>
<div id="fbplikebox" style="display:none;">
<div class="fbplbadge"></div>

<iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Dido-Net/106766964583&width=245&height=255&colorscheme=light&show_faces=true&border_color=%23C4C4C4&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:245px; height:255px;background:#F5EBF5;" allowtransparency="true"></iframe></div>

Cara Memasukkan kode contoh script Diatas :

Masuk pada menu tata letak
Pilih tambahkan gadget
Pilih HTML/javascript
Pastekan contoh script fans page (tetapi jangan lupa mengganti alamat URL fans Page saya dengan URL sobat)

Selamat Mencoba dan Maaf Kalau Amburadul Dalam Penjelasan Saya

[ Baca Selengkapnya ]

Kode Smile Facebook untuk chating

Kode-kode smile Facebook ini sengaja aku masukkan di dalam blog agar mudah tuk mengingatnya... buat teman-teman yg pengen melihatnya silahkan az..
Gratis kok..

[ Baca Selengkapnya ]