Merhaba Arkadaşlar
Blogger sitelerinde Facebookun popülerliyi gün geçtikçe artıyor.Tabiki buda Blogger için çok güzel bir paylaşma.Eğer bir blogger sitesi kurmuşsanız mutlaka bir sosyal platformlara bağlamanız gerek çünkü seo açısından size bulmaları daha çok kolay olur.
Sizinle paylaşmak istediğim Facebook beğen kutusu açılır ve kapanır özelliğine sahiptir.Mutlaka Blog sitenize eklemenizi tavsiye ederim.
Peki nasıl eklenir?Aşağıda verceğim kodları doğru bir şşekilde eklerseniz,sizde kolayca Facebook beğen kutusunu ekleyebilisiniz.
Hemen başlayalım
1: Blogger admin paneline giriniz.Ekleyeceğiniz blopunuzu seçin.Ve tema bölümünden HTML ye düzenle yolunu takip ediniz.Yani temanınızın kod bölümüne giriniz.Girdikten sonra CTRL-F Yapınız,çıkan sağ üsteki arama yerini <(head> kodunu yapıştırınız ve aradınız.</head> Bulduktan sonra bu kodun bir satır üzerine alttaki CSS kodunu yapıştırınız.
CSS KODU
<style>
/*<![CDATA[*/
#fb_like_box{display:block;padding:0;z-index:99999;position:fixed}
.fb_like_box_button{background-color:#3B5998;display:block;height:150px;top:50%;margin-top:-75px;position:absolute;right:-47px;width:47px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAACWCAMAAAB5PCEjAAAAvVBMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////9o6qWPAAAAPnRSTlMAG8ITUdoJoazyBTACgvoPt4top5ed3b7HsnjvfZZKYIVcbODTV3RDmpJwQDv49dgeZOkWzEYm4itNNeznj0ydlzQAAAO6SURBVFjD7ZjZlqpADEVRJkFEWpxQBOexHXHWrv//rFvFYIOtJDzcN8+DlGtta4VwKolw3EcfffSsgymblwz8FyGkAzDl4kPHAuWNc7G40d7zLfJXq6bwli+Rl9pm5Ad8Np5M3vDCPv9Qm3K3fL7OeBeRzxnlqhzHi/RaQeaf8pwB8KoUXG0UPzLqp2ZfpSvpfNhe6dUp2fYxLQiqGV16RU+FYp6E+dOLHNcl+mqMyImv/u/9pslie6/oxxfOn9ST7cXx5IOY/buE7P0MUv4HwTuE3HnGz4K8zwBeWtOtHfqRd0pLypcA/rud9KWL8ExMy3M23uQy8YaHqDmRqvZE/R9lje9VLcMwrKnrYXDh9Ah/14NxR4/fMPgDaYirO5EuJPvzVVrfTP0bXddg/z88TL1NGgBvBEcxqBR03UScx0oGvkYZO1xv6doCeDsWfwlxvoTYPRYQddabyXJUoyqyPN2gLCcxYc1c/GnWB1Rrqych8FbMcA3Y0f2EfQoQ7p2SflsAfC/o0FHVZWUXrOf3yfFOSJf/Qjzfgr+nVGdPytvB/gl6W8DzmfgWN2YVCxFP3+fbfqZ+AL7j13CpHuXTgZ6uf2YffEND+DnPSYMAXx/B51s1TZtTm7qi7PY2j62harlcRvlZPQhMF8dxLhchkvPW2NfX49Ul3W9/1EqrDy8kv+Onr/l9mh+GNb9/mewA7P21WdJS6mHUJOS0wGP+HMXqoYnwZ7Sn63sD9qdIZzFN4/gGoj5X/OO+HlLdCKJfFPVkIqcc4gZiEiB+k2ioFmxSrzRsL3WqZXtYKuPKOe9R8WUNd1au7rjVao23V9SJueYf0Q8PMJ4Y+HQwPVo+kU4RuuHFk/FHiP5LCnMmWUc8XznWhDoI/xQyzhsmZbrheozwP5vhd0Jus9nkDgNEgwz7naIoq/TCEyq3yzZvP/0BnoF+0OITt4wZIL47TbEuiuK+dtC4/yBvWy0wTfuoYcn9zZAyhvFRIj9zCC+LCX4HhfQ8b0PzIZuZV/aCadxOaywx/3cyzNtx/7tI/2fZP4h/QrUYK4j4haf89LPl/wZaItngEYZwb7/+maP86XZM5s9qBeNPVU18CfU+mpO4Xou+1tGCLosZ30dVMvKzjHzj/d8FWtoU5mSlrTyk599VCjVHJY1o6a/y3iYXKXWwVCt31rtqOVw9mezDoO9bRL3ayPH3D2C5nSTfnyyhfhfm07rOgx9WMbzIdj1aSH7VDZt074R5H2WdY8M92H+F5AsEocd99NFHcf0Dkss5RvCdtUEAAAAASUVORK5CYII=");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>
/*<![CDATA[*/
#fb_like_box{display:block;padding:0;z-index:99999;position:fixed}
.fb_like_box_button{background-color:#3B5998;display:block;height:150px;top:50%;margin-top:-75px;position:absolute;right:-47px;width:47px;background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC8AAACWCAMAAAB5PCEjAAAAvVBMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////9o6qWPAAAAPnRSTlMAG8ITUdoJoazyBTACgvoPt4top5ed3b7HsnjvfZZKYIVcbODTV3RDmpJwQDv49dgeZOkWzEYm4itNNeznj0ydlzQAAAO6SURBVFjD7ZjZlqpADEVRJkFEWpxQBOexHXHWrv//rFvFYIOtJDzcN8+DlGtta4VwKolw3EcfffSsgymblwz8FyGkAzDl4kPHAuWNc7G40d7zLfJXq6bwli+Rl9pm5Ad8Np5M3vDCPv9Qm3K3fL7OeBeRzxnlqhzHi/RaQeaf8pwB8KoUXG0UPzLqp2ZfpSvpfNhe6dUp2fYxLQiqGV16RU+FYp6E+dOLHNcl+mqMyImv/u/9pslie6/oxxfOn9ST7cXx5IOY/buE7P0MUv4HwTuE3HnGz4K8zwBeWtOtHfqRd0pLypcA/rud9KWL8ExMy3M23uQy8YaHqDmRqvZE/R9lje9VLcMwrKnrYXDh9Ah/14NxR4/fMPgDaYirO5EuJPvzVVrfTP0bXddg/z88TL1NGgBvBEcxqBR03UScx0oGvkYZO1xv6doCeDsWfwlxvoTYPRYQddabyXJUoyqyPN2gLCcxYc1c/GnWB1Rrqych8FbMcA3Y0f2EfQoQ7p2SflsAfC/o0FHVZWUXrOf3yfFOSJf/Qjzfgr+nVGdPytvB/gl6W8DzmfgWN2YVCxFP3+fbfqZ+AL7j13CpHuXTgZ6uf2YffEND+DnPSYMAXx/B51s1TZtTm7qi7PY2j62harlcRvlZPQhMF8dxLhchkvPW2NfX49Ul3W9/1EqrDy8kv+Onr/l9mh+GNb9/mewA7P21WdJS6mHUJOS0wGP+HMXqoYnwZ7Sn63sD9qdIZzFN4/gGoj5X/OO+HlLdCKJfFPVkIqcc4gZiEiB+k2ioFmxSrzRsL3WqZXtYKuPKOe9R8WUNd1au7rjVao23V9SJueYf0Q8PMJ4Y+HQwPVo+kU4RuuHFk/FHiP5LCnMmWUc8XznWhDoI/xQyzhsmZbrheozwP5vhd0Jus9nkDgNEgwz7naIoq/TCEyq3yzZvP/0BnoF+0OITt4wZIL47TbEuiuK+dtC4/yBvWy0wTfuoYcn9zZAyhvFRIj9zCC+LCX4HhfQ8b0PzIZuZV/aCadxOaywx/3cyzNtx/7tI/2fZP4h/QrUYK4j4haf89LPl/wZaItngEYZwb7/+maP86XZM5s9qBeNPVU18CfU+mpO4Xou+1tGCLosZ30dVMvKzjHzj/d8FWtoU5mSlrTyk599VCjVHJY1o6a/y3iYXKXWwVCt31rtqOVw9mezDoO9bRL3ayPH3D2C5nSTfnyyhfhfm07rOgx9WMbzIdj1aSH7VDZt074R5H2WdY8M92H+F5AsEocd99NFHcf0Dkss5RvCdtUEAAAAASUVORK5CYII=");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>
İkinci adım: Aşağıdaki jQuery kodunu blogunuzun tema kodlarının en alt kısımlarında bulunan </body> kodunun bir satır üzerine ekleyin.
jQuery Kodu
<script>
/*<![CDATA[*/
(function(md){
md(document).ready(function(){
var $dur = "medium";
md("#fb_like_box").css({left: -250, "top" : 100 })
md("#fb_like_box").hover(function () {
md(this).stop().animate({
left: 0
}, $dur);
}, function () {
md(this).stop().animate({
left: -250
}, $dur);
});
md("#fb_like_box").show();
});
})(jQuery);
/*]]>*/
</script>
/*<![CDATA[*/
(function(md){
md(document).ready(function(){
var $dur = "medium";
md("#fb_like_box").css({left: -250, "top" : 100 })
md("#fb_like_box").hover(function () {
md(this).stop().animate({
left: 0
}, $dur);
}, function () {
md(this).stop().animate({
left: -250
}, $dur);
});
md("#fb_like_box").show();
});
})(jQuery);
/*]]>*/
</script>
HTML KODU
<div class="fb_like_box">
<div id="fb_like_box" style="display:none;">
<div class="fb_like_box_button"></div>
<center><iframe src="https://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/erdalweb&width=250&height=230&colorscheme=light&show_faces=true&border_color=%23C4C4C4&stream=false&header=false" scrolling="no" frameborder="0" style="border:none;overflow:hidden;width:250px;height:230px" allowTransparency="true"></iframe></center>
</div>
</div>
<div id="fb_like_box" style="display:none;">
<div class="fb_like_box_button"></div>
<center><iframe src="https://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/erdalweb&width=250&height=230&colorscheme=light&show_faces=true&border_color=%23C4C4C4&stream=false&header=false" scrolling="no" frameborder="0" style="border:none;overflow:hidden;width:250px;height:230px" allowTransparency="true"></iframe></center>
</div>
</div>
Yukarıdaki HTML kod içerisinde bulunan işaretli yere "erdalweb'' blogunuzun Facebook sayfası adını veya sayfa ID numarasını ekleyin.
İŞLEM BU KADAR
GÜLE GÜLE KULLANIN
Yorumlarınızı Yazınız:
0 comments: